From bd6b9c40f150fab76e8907c45e29fa809f9acae0 Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Fri, 2 Apr 2021 19:04:09 -0400
Subject: dashboard sharing initial setup, inherits acls from dashboard - looks
 like it works

---
 src/client/documents/Documents.ts   |  4 ++--
 src/client/util/CurrentUserUtils.ts | 20 +++++++++++++++-----
 src/client/views/DocComponent.tsx   | 10 ++++++----
 src/fields/Doc.ts                   |  9 ++++++++-
 src/fields/util.ts                  | 15 ++++++++++++++-
 5 files changed, 45 insertions(+), 13 deletions(-)

(limited to 'src')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index f02298f36..2a679ec95 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -836,8 +836,8 @@ export namespace Docs {
             return InstanceFromProto(Prototypes.get(DocumentType.COL), new List(documents), { schemaHeaders: new List(schemaHeaders), ...options, _viewType: CollectionViewType.Schema });
         }
 
-        export function TreeDocument(documents: Array<Doc>, options: DocumentOptions, id?: string) {
-            return InstanceFromProto(Prototypes.get(DocumentType.COL), new List(documents), { ...options, _viewType: CollectionViewType.Tree }, id);
+        export function TreeDocument(documents: Array<Doc>, options: DocumentOptions, id?: string, protoId?: string) {
+            return InstanceFromProto(Prototypes.get(DocumentType.COL), new List(documents), { ...options, _viewType: CollectionViewType.Tree }, id, undefined, protoId);
         }
 
         export function StackingDocument(documents: Array<Doc>, options: DocumentOptions, id?: string, protoId?: string) {
diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 849020392..f1357e3d7 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -35,6 +35,7 @@ import { UndoManager } from "./UndoManager";
 import { SnappingManager } from "./SnappingManager";
 import { InkTool } from "../../fields/InkField";
 import { computedFn } from "mobx-utils";
+import { SharingManager } from "./SharingManager";
 
 
 export let resolvedPorts: { server: number, socket: number };
@@ -907,9 +908,9 @@ export class CurrentUserUtils {
         if (doc.mySharedDocs === undefined) {
             let sharedDocs = Docs.newAccount ? undefined : await DocServer.GetRefField(sharingDocumentId + "outer");
             if (!sharedDocs) {
-                sharedDocs = Docs.Create.StackingDocument([], {
-                    title: "My SharedDocs", childDropAction: "alias", system: true, contentPointerEvents: "none", childLimitHeight: 0, _yMargin: 50, _gridGap: 15,
-                    _showTitle: "title", ignoreClick: true, _lockedPosition: true, "acl-Public": SharingPermissions.Add, "_acl-Public": SharingPermissions.Add, _chromeHidden: true,
+                sharedDocs = Docs.Create.TreeDocument([], {
+                    title: "My SharedDocs", childDropAction: "alias", system: true, contentPointerEvents: "all", childLimitHeight: 0, _yMargin: 50, _gridGap: 15,
+                    _showTitle: "title", ignoreClick: false, _lockedPosition: true, "acl-Public": SharingPermissions.Add, "_acl-Public": SharingPermissions.Add, _chromeHidden: true,
                 }, sharingDocumentId + "outer", sharingDocumentId);
                 (sharedDocs as Doc)["acl-Public"] = (sharedDocs as Doc)[DataSym]["acl-Public"] = SharingPermissions.Add;
             }
@@ -1188,8 +1189,10 @@ export class CurrentUserUtils {
         const toggleComic = ScriptField.MakeScript(`toggleComicMode()`);
         const snapshotDashboard = ScriptField.MakeScript(`snapshotDashboard()`);
         const createDashboard = ScriptField.MakeScript(`createNewDashboard()`);
-        dashboardDoc.contextMenuScripts = new List<ScriptField>([toggleTheme!, toggleComic!, snapshotDashboard!, createDashboard!]);
-        dashboardDoc.contextMenuLabels = new List<string>(["Toggle Theme Colors", "Toggle Comic Mode", "Snapshot Dashboard", "Create Dashboard"]);
+        const shareDashboard = ScriptField.MakeScript(`shareDashboard()`);
+        const addToDashboards = ScriptField.MakeScript(`addToDashboards(self)`);
+        dashboardDoc.contextMenuScripts = new List<ScriptField>([toggleTheme!, toggleComic!, snapshotDashboard!, createDashboard!, shareDashboard!, addToDashboards!]);
+        dashboardDoc.contextMenuLabels = new List<string>(["Toggle Theme Colors", "Toggle Comic Mode", "Snapshot Dashboard", "Create Dashboard", "Share Dashboard", "Add to Dashboards"]);
 
         Doc.AddDocToList(dashboards, "data", dashboardDoc);
         CurrentUserUtils.openDashboard(userDoc, dashboardDoc);
@@ -1241,3 +1244,10 @@ Scripting.addGlobal(function links(doc: any) { return new List(LinkManager.Insta
     "returns all the links to the document or its annotations", "(doc: any)");
 Scripting.addGlobal(function importDocument() { return CurrentUserUtils.importDocument(); },
     "imports files from device directly into the import sidebar");
+Scripting.addGlobal(function shareDashboard() {
+    CurrentUserUtils.ActiveDashboard.isShared = true;
+    SharingManager.Instance.open(undefined, CurrentUserUtils.ActiveDashboard);
+},
+    "opens sharing dialog for Dashboard");
+Scripting.addGlobal(function addToDashboards(dashboard: Doc) { Doc.AddDocToList(CurrentUserUtils.MyDashboards, "data", dashboard); },
+    "adds Dashboard to set of Dashboards");
\ No newline at end of file
diff --git a/src/client/views/DocComponent.tsx b/src/client/views/DocComponent.tsx
index 90449ab6c..447daeb02 100644
--- a/src/client/views/DocComponent.tsx
+++ b/src/client/views/DocComponent.tsx
@@ -7,7 +7,7 @@ import { InteractionUtils } from '../util/InteractionUtils';
 import { List } from '../../fields/List';
 import { DateField } from '../../fields/DateField';
 import { ScriptField } from '../../fields/ScriptField';
-import { GetEffectiveAcl, SharingPermissions, distributeAcls, denormalizeEmail } from '../../fields/util';
+import { GetEffectiveAcl, SharingPermissions, distributeAcls, denormalizeEmail, inheritParentAcls } from '../../fields/util';
 import { CurrentUserUtils } from '../util/CurrentUserUtils';
 import { DocUtils } from '../documents/Documents';
 import { returnFalse } from '../../Utils';
@@ -198,15 +198,15 @@ export function ViewBoxAnnotatableComponent<P extends ViewBoxAnnotatableProps, T
                     if (this.props.Document[AclSym] && Object.keys(this.props.Document[AclSym]).length) {
                         added.forEach(d => {
                             for (const [key, value] of Object.entries(this.props.Document[AclSym])) {
-                                if (d.author === denormalizeEmail(key.substring(4)) && !d.aliasOf) distributeAcls(key, SharingPermissions.Admin, d, true);
-                                //else if (this.props.Document[key] === SharingPermissions.Admin) distributeAcls(key, SharingPermissions.Add, d, true);
-                                // else distributeAcls(key, this.AclMap.get(value) as SharingPermissions, d, true);
+                                if (d.author === denormalizeEmail(key.substring(4)) && !d.aliasOf) distributeAcls(key, SharingPermissions.Admin, d);
                             }
                         });
                     }
 
                     if (effectiveAcl === AclAddonly) {
                         added.map(doc => {
+
+                            if ([AclAdmin, AclEdit].includes(GetEffectiveAcl(doc))) inheritParentAcls(CurrentUserUtils.ActiveDashboard, doc);
                             doc.context = this.props.Document;
                             if (annotationKey ?? this._annotationKey) Doc.GetProto(doc).annotationOn = this.props.Document;
                             this.props.layerProvider?.(doc, true);
@@ -220,6 +220,8 @@ export function ViewBoxAnnotatableComponent<P extends ViewBoxAnnotatableProps, T
                             doc._stayInCollection = undefined;
                             doc.context = this.props.Document;
                             if (annotationKey ?? this._annotationKey) Doc.GetProto(doc).annotationOn = this.props.Document;
+
+                            inheritParentAcls(CurrentUserUtils.ActiveDashboard, doc);
                         });
                         const annoDocs = targetDataDoc[annotationKey ?? this.annotationKey] as List<Doc>;
                         if (annoDocs) annoDocs.push(...added);
diff --git a/src/fields/Doc.ts b/src/fields/Doc.ts
index 5b3e21e34..b37c2fdfe 100644
--- a/src/fields/Doc.ts
+++ b/src/fields/Doc.ts
@@ -22,8 +22,9 @@ import { listSpec } from "./Schema";
 import { ComputedField, ScriptField } from "./ScriptField";
 import { Cast, FieldValue, NumCast, StrCast, ToConstructor } from "./Types";
 import { AudioField, ImageField, PdfField, VideoField, WebField } from "./URLField";
-import { deleteProperty, GetEffectiveAcl, getField, getter, makeEditable, makeReadOnly, normalizeEmail, setter, SharingPermissions, updateFunction } from "./util";
+import { deleteProperty, getField, getter, inheritParentAcls, makeEditable, makeReadOnly, normalizeEmail, setter, SharingPermissions, updateFunction } from "./util";
 import JSZip = require("jszip");
+import { CurrentUserUtils } from "../client/util/CurrentUserUtils";
 
 export namespace Field {
     export function toKeyValueString(doc: Doc, key: string): string {
@@ -424,6 +425,9 @@ export namespace Doc {
         return Array.from(results);
     }
 
+    /**
+     * @returns the index of doc toFind in list of docs, -1 otherwise
+     */
     export function IndexOf(toFind: Doc, list: Doc[], allowProtos: boolean = true) {
         let index = list.reduce((p, v, i) => (v instanceof Doc && v === toFind) ? i : p, -1);
         index = allowProtos && index !== -1 ? index : list.reduce((p, v, i) => (v instanceof Doc && Doc.AreProtosEqual(v, toFind)) ? i : p, -1);
@@ -1148,6 +1152,9 @@ export namespace Doc {
             dragFactory["dragFactory-count"] = NumCast(dragFactory["dragFactory-count"]) + 1;
             Doc.SetInPlace(ndoc, "title", ndoc.title + " " + NumCast(dragFactory["dragFactory-count"]).toString(), true);
         }
+
+        if (ndoc) inheritParentAcls(CurrentUserUtils.ActiveDashboard, ndoc);
+
         return ndoc;
     }
     export function delegateDragFactory(dragFactory: Doc) {
diff --git a/src/fields/util.ts b/src/fields/util.ts
index ea91cc057..a4c99928a 100644
--- a/src/fields/util.ts
+++ b/src/fields/util.ts
@@ -131,6 +131,19 @@ export function denormalizeEmail(email: string) {
 //     playgroundMode = !playgroundMode;
 // }
 
+
+/**
+ * Copies parent's acl fields to the child
+ */
+export function inheritParentAcls(parent: Doc, child: Doc) {
+    if (parent.isShared) {
+        const dataDoc = parent[DataSym];
+        for (const key of Object.keys(dataDoc)) {
+            key.startsWith("acl") && distributeAcls(key, dataDoc[key], child);
+        }
+    }
+}
+
 /**
  * These are the various levels of access a user can have to a document.
  * 
@@ -245,7 +258,7 @@ export function distributeAcls(key: string, acl: SharingPermissions, target: Doc
             dataDocChanged = true;
         }
 
-        // maps over the aliases of the document
+        // maps over the links of the document
         const links = DocListCast(dataDoc.links);
         links.forEach(link => distributeAcls(key, acl, link, inheritingFromCollection, visited));
 
-- 
cgit v1.2.3-70-g09d2


From d252d6dba8b789215ed8da5b66889a26b06a2a18 Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Sat, 3 Apr 2021 20:13:58 -0400
Subject: dashboard sharing works, aliases to go

---
 src/client/util/CurrentUserUtils.ts |  7 +++----
 src/client/util/SharingManager.tsx  | 24 +++++++++++++++++++++++-
 src/client/views/PropertiesView.tsx |  2 +-
 src/fields/Doc.ts                   |  2 +-
 4 files changed, 28 insertions(+), 7 deletions(-)

(limited to 'src')

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index f1357e3d7..fdceb60f3 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -1189,7 +1189,7 @@ export class CurrentUserUtils {
         const toggleComic = ScriptField.MakeScript(`toggleComicMode()`);
         const snapshotDashboard = ScriptField.MakeScript(`snapshotDashboard()`);
         const createDashboard = ScriptField.MakeScript(`createNewDashboard()`);
-        const shareDashboard = ScriptField.MakeScript(`shareDashboard()`);
+        const shareDashboard = ScriptField.MakeScript(`shareDashboard(self)`);
         const addToDashboards = ScriptField.MakeScript(`addToDashboards(self)`);
         dashboardDoc.contextMenuScripts = new List<ScriptField>([toggleTheme!, toggleComic!, snapshotDashboard!, createDashboard!, shareDashboard!, addToDashboards!]);
         dashboardDoc.contextMenuLabels = new List<string>(["Toggle Theme Colors", "Toggle Comic Mode", "Snapshot Dashboard", "Create Dashboard", "Share Dashboard", "Add to Dashboards"]);
@@ -1244,9 +1244,8 @@ Scripting.addGlobal(function links(doc: any) { return new List(LinkManager.Insta
     "returns all the links to the document or its annotations", "(doc: any)");
 Scripting.addGlobal(function importDocument() { return CurrentUserUtils.importDocument(); },
     "imports files from device directly into the import sidebar");
-Scripting.addGlobal(function shareDashboard() {
-    CurrentUserUtils.ActiveDashboard.isShared = true;
-    SharingManager.Instance.open(undefined, CurrentUserUtils.ActiveDashboard);
+Scripting.addGlobal(function shareDashboard(dashboard: Doc) {
+    SharingManager.Instance.open(undefined, dashboard);
 },
     "opens sharing dialog for Dashboard");
 Scripting.addGlobal(function addToDashboards(dashboard: Doc) { Doc.AddDocToList(CurrentUserUtils.MyDashboards, "data", dashboard); },
diff --git a/src/client/util/SharingManager.tsx b/src/client/util/SharingManager.tsx
index ded56d1da..ca14154b2 100644
--- a/src/client/util/SharingManager.tsx
+++ b/src/client/util/SharingManager.tsx
@@ -5,7 +5,7 @@ import { observer } from "mobx-react";
 import * as React from "react";
 import Select from "react-select";
 import * as RequestPromise from "request-promise";
-import { AclAddonly, AclAdmin, AclEdit, AclPrivate, AclReadonly, AclSym, DataSym, Doc, DocListCast, DocListCastAsync, Opt } from "../../fields/Doc";
+import { AclAddonly, AclAdmin, AclEdit, AclPrivate, AclReadonly, AclSym, AclUnset, DataSym, Doc, DocListCast, DocListCastAsync, Opt } from "../../fields/Doc";
 import { List } from "../../fields/List";
 import { Cast, StrCast } from "../../fields/Types";
 import { distributeAcls, GetEffectiveAcl, normalizeEmail, SharingPermissions, TraceMobx } from "../../fields/util";
@@ -17,6 +17,7 @@ import { MainViewModal } from "../views/MainViewModal";
 import { DocumentView } from "../views/nodes/DocumentView";
 import { TaskCompletionBox } from "../views/nodes/TaskCompletedBox";
 import { SearchBox } from "../views/search/SearchBox";
+import { CurrentUserUtils } from "./CurrentUserUtils";
 import { DocumentManager } from "./DocumentManager";
 import { GroupManager, UserOptions } from "./GroupManager";
 import { GroupMemberView } from "./GroupMemberView";
@@ -170,6 +171,7 @@ export class SharingManager extends React.Component<{}> {
             doc.author === Doc.CurrentUserEmail && !doc[myAcl] && distributeAcls(myAcl, SharingPermissions.Admin, doc);
             distributeAcls(acl, permission as SharingPermissions, doc);
 
+            this.setDashboardBackground(doc, permission as SharingPermissions);
             if (permission !== SharingPermissions.None) return Doc.AddDocToList(sharingDoc, storage, doc);
             else return GetEffectiveAcl(doc, user.email) === AclPrivate && Doc.RemoveDocFromList(sharingDoc, storage, (doc.aliasOf as Doc || doc));
         }).some(success => !success);
@@ -192,6 +194,7 @@ export class SharingManager extends React.Component<{}> {
         return !docs.map(doc => {
             doc.author === Doc.CurrentUserEmail && !doc[`acl-${Doc.CurrentUserEmailNormalized}`] && distributeAcls(`acl-${Doc.CurrentUserEmailNormalized}`, SharingPermissions.Admin, doc);
             distributeAcls(acl, permission as SharingPermissions, doc);
+            this.setDashboardBackground(doc, permission as SharingPermissions);
 
             if (group instanceof Doc) {
                 const members: string[] = JSON.parse(StrCast(group.members));
@@ -246,6 +249,25 @@ export class SharingManager extends React.Component<{}> {
         }
     }
 
+    /**
+     * Sets the background of the Dashboard if it has been shared as a visual indicator
+     */
+    setDashboardBackground = async (doc: Doc, permission: SharingPermissions) => {
+        if (Doc.IndexOf(doc, DocListCast(CurrentUserUtils.MyDashboards.data)) !== -1) {
+            if (permission !== SharingPermissions.None) {
+                doc.isShared = true;
+                doc.backgroundColor = "green";
+            }
+            else {
+                const acls = doc[DataSym][AclSym];
+                if (Object.keys(acls).every(key => key === `acl-${Doc.CurrentUserEmailNormalized}` ? true : [AclUnset, AclPrivate].includes(acls[key]))) {
+                    doc.isShared = undefined;
+                    doc.backgroundColor = undefined;
+                }
+            }
+        }
+    }
+
     /**
      * Removes the documents shared with a user through a group when the user is removed from the group.
      * @param group 
diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx
index c8ce8bfeb..0fc6c75d0 100644
--- a/src/client/views/PropertiesView.tsx
+++ b/src/client/views/PropertiesView.tsx
@@ -400,7 +400,7 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
         const showAdmin = effectiveAcls.every(acl => acl === AclAdmin);
 
         // users in common between all docs
-        const commonKeys = intersection(...docs.map(doc => this.layoutDocAcls ? doc?.[AclSym] && Object.keys(doc[AclSym]) : doc?.[DataSym][AclSym] && Object.keys(doc[DataSym][AclSym])));
+        const commonKeys: string[] = intersection(...docs.map(doc => this.layoutDocAcls ? doc?.[AclSym] && Object.keys(doc[AclSym]) : doc?.[DataSym][AclSym] && Object.keys(doc[DataSym][AclSym])));
 
         const tableEntries = [];
 
diff --git a/src/fields/Doc.ts b/src/fields/Doc.ts
index b37c2fdfe..1719a6445 100644
--- a/src/fields/Doc.ts
+++ b/src/fields/Doc.ts
@@ -22,7 +22,7 @@ import { listSpec } from "./Schema";
 import { ComputedField, ScriptField } from "./ScriptField";
 import { Cast, FieldValue, NumCast, StrCast, ToConstructor } from "./Types";
 import { AudioField, ImageField, PdfField, VideoField, WebField } from "./URLField";
-import { deleteProperty, getField, getter, inheritParentAcls, makeEditable, makeReadOnly, normalizeEmail, setter, SharingPermissions, updateFunction } from "./util";
+import { deleteProperty, GetEffectiveAcl, getField, getter, inheritParentAcls, makeEditable, makeReadOnly, normalizeEmail, setter, SharingPermissions, updateFunction } from "./util";
 import JSZip = require("jszip");
 import { CurrentUserUtils } from "../client/util/CurrentUserUtils";
 
-- 
cgit v1.2.3-70-g09d2


From b901d5b16b6a4d53d7975a318017dc9630966abf Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Sat, 3 Apr 2021 22:24:34 -0400
Subject: made dashboard option visible

---
 src/client/views/search/SearchBox.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 5c168d8a9..4cbdd622f 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -530,7 +530,7 @@ export class SearchBox extends ViewBoxBaseComponent<FieldViewProps, SearchBoxDoc
                         <div className="searchBox-lozenge-dashboard"  >
                             <select className="searchBox-dashSelect" onChange={e => CurrentUserUtils.openDashboard(Doc.UserDoc(), myDashboards[Number(e.target.value)])}
                                 value={myDashboards.indexOf(CurrentUserUtils.ActiveDashboard)}>
-                                {myDashboards.map((dash, i) => <option key={dash[Id]} value={i}> {StrCast(dash.title)} </option>)}
+                                {myDashboards.map((dash, i) => <option key={dash[Id]} value={i} style={{ color: "black" }}> {StrCast(dash.title)} </option>)}
                             </select>
                             <div className="searchBox-dashboards" onClick={undoBatch(() => CurrentUserUtils.createNewDashboard(Doc.UserDoc()))}>
                                 New
-- 
cgit v1.2.3-70-g09d2


From a80143dca8309463af954d09ec1e6d30aa6e3fd1 Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Sat, 3 Apr 2021 22:32:58 -0400
Subject: revised previous

---
 src/client/views/search/SearchBox.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 4cbdd622f..d3a023ec9 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -530,7 +530,7 @@ export class SearchBox extends ViewBoxBaseComponent<FieldViewProps, SearchBoxDoc
                         <div className="searchBox-lozenge-dashboard"  >
                             <select className="searchBox-dashSelect" onChange={e => CurrentUserUtils.openDashboard(Doc.UserDoc(), myDashboards[Number(e.target.value)])}
                                 value={myDashboards.indexOf(CurrentUserUtils.ActiveDashboard)}>
-                                {myDashboards.map((dash, i) => <option key={dash[Id]} value={i} style={{ color: "black" }}> {StrCast(dash.title)} </option>)}
+                                {myDashboards.map((dash, i) => <option key={dash[Id]} value={i} style={{ backgroundColor: "black" }}> {StrCast(dash.title)} </option>)}
                             </select>
                             <div className="searchBox-dashboards" onClick={undoBatch(() => CurrentUserUtils.createNewDashboard(Doc.UserDoc()))}>
                                 New
-- 
cgit v1.2.3-70-g09d2


From 0bc38e1ca78a5a2ee21d99ef511f2f744d8c67bb Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Sun, 4 Apr 2021 01:55:12 -0400
Subject: added datadoc print to console

---
 src/client/views/nodes/DocumentView.tsx | 1 +
 1 file changed, 1 insertion(+)

(limited to 'src')

diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 26cf52f17..3870cbed0 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -740,6 +740,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
         !Doc.UserDoc().novice && helpItems.push({ description: "Show Fields ", event: () => this.props.addDocTab(Docs.Create.KVPDocument(this.props.Document, { _width: 300, _height: 300 }), "add:right"), icon: "layer-group" });
         helpItems.push({ description: "Text Shortcuts Ctrl+/", event: () => this.props.addDocTab(Docs.Create.PdfDocument(Utils.prepend("/assets/cheat-sheet.pdf"), { _width: 300, _height: 300 }), "add:right"), icon: "keyboard" });
         !Doc.UserDoc().novice && helpItems.push({ description: "Print Document in Console", event: () => console.log(this.props.Document), icon: "hand-point-right" });
+        !Doc.UserDoc().novice && helpItems.push({ description: "Print DataDoc in Console", event: () => console.log(this.props.Document[DataSym]), icon: "hand-point-right" });
         cm.addItem({ description: "Help...", noexpand: true, subitems: helpItems, icon: "question" });
 
         if (!this.topMost) e?.stopPropagation(); // DocumentViews should stop propagation of this event
-- 
cgit v1.2.3-70-g09d2


From 95a42c92c9b4b2af8703afe85ece4e32975a3047 Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Tue, 13 Apr 2021 10:39:36 -0400
Subject: typos and minor changes

---
 src/client/DocServer.ts             | 2 +-
 src/client/util/CurrentUserUtils.ts | 1 -
 src/fields/Doc.ts                   | 4 ++--
 3 files changed, 3 insertions(+), 4 deletions(-)

(limited to 'src')

diff --git a/src/client/DocServer.ts b/src/client/DocServer.ts
index 1d7497cf8..59278d2af 100644
--- a/src/client/DocServer.ts
+++ b/src/client/DocServer.ts
@@ -225,7 +225,7 @@ export namespace DocServer {
      * the server if the document has not been cached.
      * @param id the id of the requested document
      */
-    const _GetRefFieldImpl = (id: string, force: boolean = false): Promise<Opt<RefField>> => {
+    const _GetRefFieldImpl = async (id: string, force: boolean = false): Promise<Opt<RefField>> => {
         // an initial pass through the cache to determine whether the document needs to be fetched,
         // is already in the process of being fetched or already exists in the
         // cache
diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index b7c2d60d8..86f563b7e 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -516,7 +516,6 @@ export class CurrentUserUtils {
             { title: "Import", target: Cast(doc.myImportPanel, Doc, null), icon: "upload", click: 'selectMainMenu(self)' },
             { title: "Recently Closed", target: Cast(doc.myRecentlyClosedDocs, Doc, null), icon: "archive", click: 'selectMainMenu(self)' },
             { title: "Sharing", target: Cast(doc.mySharedDocs, Doc, null), icon: "users", click: 'selectMainMenu(self)', watchedDocuments: doc.mySharedDocs as Doc },
-            // { title: "Filter", target: Cast(doc.currentFilter, Doc, null), icon: "filter", click: 'selectMainMenu(self)' },
             { title: "Pres. Trails", target: Cast(doc.myPresentations, Doc, null), icon: "pres-trail", click: 'selectMainMenu(self)' },
             { title: "Help", target: undefined as any, icon: "question-circle", click: 'selectMainMenu(self)' },
             { title: "Settings", target: undefined as any, icon: "cog", click: 'selectMainMenu(self)' },
diff --git a/src/fields/Doc.ts b/src/fields/Doc.ts
index 30e8b60bd..478334038 100644
--- a/src/fields/Doc.ts
+++ b/src/fields/Doc.ts
@@ -539,7 +539,7 @@ export namespace Doc {
                     const clones = await Promise.all(docs.map(async d => Doc.makeClone(d, cloneMap, rtfs, exclusions, dontCreate, asBranch)));
                     !dontCreate && assignKey(new List<Doc>(clones));
                 } else if (doc[key] instanceof Doc) {
-                    assignKey(key.includes("layout[") ? undefined : key.startsWith("layout") ? doc[key] as Doc : await Doc.makeClone(doc[key] as Doc, cloneMap, rtfs, exclusions, dontCreate, asBranch)); // reference documents except copy documents that are expanded teplate fields 
+                    assignKey(key.includes("layout[") ? undefined : key.startsWith("layout") ? doc[key] as Doc : await Doc.makeClone(doc[key] as Doc, cloneMap, rtfs, exclusions, dontCreate, asBranch)); // reference documents except copy documents that are expanded template fields 
                 } else {
                     !dontCreate && assignKey(ObjectField.MakeCopy(field));
                     if (field instanceof RichTextField) {
@@ -562,7 +562,7 @@ export namespace Doc {
                 } else if (field instanceof ObjectField) {
                     await copyObjectField(field);
                 } else if (field instanceof Promise) {
-                    debugger; //This shouldn't happend...
+                    debugger; //This shouldn't happen...
                 } else {
                     assignKey(field);
                 }
-- 
cgit v1.2.3-70-g09d2


From 2e76877dc1c9c5b1c226f5bd0394d17cabfec0b4 Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Mon, 17 May 2021 18:01:44 -0400
Subject: trying dynamic off screen docs

---
 src/client/documents/Documents.ts                  | 20 ++++++++--
 src/client/util/CurrentUserUtils.ts                | 33 ++++++++++++++---
 src/client/util/SharingManager.tsx                 | 40 ++++++++++++--------
 .../views/collections/CollectionDockingView.tsx    | 43 ++++++++++++++--------
 src/client/views/collections/TreeView.tsx          |  9 ++++-
 src/fields/util.ts                                 | 18 +++++----
 6 files changed, 115 insertions(+), 48 deletions(-)

(limited to 'src')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 1e2919bad..906603d78 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -648,8 +648,9 @@ export namespace Docs {
          * constructor just generates a new GUID. This is currently used
          * only when creating a DockDocument from the current user's already existing
          * main document.
+         * @param layoutData whether the fieldKey field on the layout doc should store the data or the data doc
          */
-        function InstanceFromProto(proto: Doc, data: Field | undefined, options: DocumentOptions, delegId?: string, fieldKey: string = "data", protoId?: string) {
+        function InstanceFromProto(proto: Doc, data: Field | undefined, options: DocumentOptions, delegId?: string, fieldKey: string = "data", protoId?: string, layoutData?: boolean) {
             const viewKeys = ["x", "y", "system"]; // keys that should be addded to the view document even though they don't begin with an "_"
             const { omit: dataProps, extract: viewProps } = OmitKeys(options, viewKeys, "^_");
 
@@ -660,7 +661,17 @@ export namespace Docs {
             dataProps[`${fieldKey}-lastModified`] = new DateField;
             dataProps["acl-Override"] = "None";
             dataProps["acl-Public"] = Doc.UserDoc()?.defaultAclPrivate ? SharingPermissions.None : SharingPermissions.Add;
-            dataProps[fieldKey] = data;
+
+            if (layoutData) {
+                viewProps[fieldKey] = data;
+                const list = new List<Doc>();
+                console.log(DocListCast(data));
+                DocListCast(data).forEach(doc => {
+                    list.push(...DocListCast(doc.data));
+                });
+                dataProps[fieldKey + "-all"] = list;
+            }
+            else dataProps[fieldKey] = data;
             // so that the list of annotations is already initialised, prevents issues in addonly.
             // without this, if a doc has no annotations but the user has AddOnly privileges, they won't be able to add an annotation because they would have needed to create the field's list which they don't have permissions to do.
             dataProps[fieldKey + "-annotations"] = new List<Doc>();
@@ -891,7 +902,7 @@ export namespace Docs {
         export function DockDocument(documents: Array<Doc>, config: string, options: DocumentOptions, id?: string) {
             const tabs = TreeDocument(documents, { title: "On-Screen Tabs", childDontRegisterViews: true, freezeChildren: "remove|add", treeViewExpandedViewLock: true, treeViewExpandedView: "data", _fitWidth: true, system: true });
             const all = TreeDocument([], { title: "Off-Screen Tabs", childDontRegisterViews: true, freezeChildren: "add", treeViewExpandedViewLock: true, treeViewExpandedView: "data", system: true });
-            return InstanceFromProto(Prototypes.get(DocumentType.COL), new List([tabs, all]), { freezeChildren: "remove|add", treeViewExpandedViewLock: true, treeViewExpandedView: "data", ...options, _viewType: CollectionViewType.Docking, dockingConfig: config }, id);
+            return InstanceFromProto(Prototypes.get(DocumentType.COL), new List([tabs, all]), { freezeChildren: "remove|add", treeViewExpandedViewLock: true, treeViewExpandedView: "data", ...options, _viewType: CollectionViewType.Docking, dockingConfig: config }, id, undefined, undefined, true);
         }
 
         export function DirectoryImportDocument(options: DocumentOptions = {}) {
@@ -1426,4 +1437,7 @@ Scripting.addGlobal(function generateLinkTitle(self: Doc) {
     const anchor2title = self.anchor2 && self.anchor2 !== self ? Cast(self.anchor2, Doc, null).title : "<?>";
     const relation = self.linkRelationship || "to";
     return `${anchor1title} (${relation}) ${anchor2title}`;
+});
+Scripting.addGlobal(function openTabAlias(tab: Doc) {
+    CollectionDockingView.AddSplit(Doc.MakeAlias(tab), "right");
 });
\ No newline at end of file
diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 5dbded00e..6fdf649a4 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -750,7 +750,7 @@ export class CurrentUserUtils {
                 title: "My Dashboards", _height: 400, childHideLinkButton: true,
                 treeViewHideTitle: true, _xMargin: 5, _yMargin: 5, _gridGap: 5, _forceActive: true, childDropAction: "alias",
                 treeViewTruncateTitleWidth: 150, ignoreClick: true,
-                _lockedPosition: true, boxShadow: "0 0", childDontRegisterViews: true, targetDropAction: "same", system: true
+                _lockedPosition: true, boxShadow: "0 0", childDontRegisterViews: true, targetDropAction: "same", treeViewType: "fileSystem", isFolder: true, system: true
             }));
             const newDashboard = ScriptField.MakeScript(`createNewDashboard(Doc.UserDoc())`);
             (doc.myDashboards as any as Doc).contextMenuScripts = new List<ScriptField>([newDashboard!]);
@@ -851,7 +851,6 @@ export class CurrentUserUtils {
         CurrentUserUtils.setupPresentations(doc);
         CurrentUserUtils.setupFilesystem(doc);
         CurrentUserUtils.setupRecentlyClosedDocs(doc);
-        // CurrentUserUtils.setupFilterDocs(doc);
         CurrentUserUtils.setupUserDoc(doc);
     }
 
@@ -1186,7 +1185,11 @@ export class CurrentUserUtils {
             title: `Untitled Tab ${NumCast(emptyPane["dragFactory-count"])}`,
         };
         const freeformDoc = CurrentUserUtils.GuestTarget || Docs.Create.FreeformDocument([], freeformOptions);
-        const dashboardDoc = Docs.Create.StandardCollectionDockingDocument([{ doc: freeformDoc, initialWidth: 600 }], { title: `Dashboard ${dashboardCount}` }, id, "row");
+        const dashboardDoc = Docs.Create.StandardCollectionDockingDocument([{ doc: freeformDoc, initialWidth: 600 }], { title: `Dashboard ${dashboardCount}` }, id, "row"); // add isFolder:true here?
+        freeformDoc.context = dashboardDoc;
+
+        DocListCast(dashboardDoc.data)[1].data = ComputedField.MakeFunction(`dynamicOffScreenDocs(dashboardDoc)`, { dashboardDoc: Doc.name }, { dashboardDoc }) as any;
+
         Doc.AddDocToList(myPresentations, "data", presentation);
         userDoc.activePresentation = presentation;
         const toggleTheme = ScriptField.MakeScript(`self.darkScheme = !self.darkScheme`);
@@ -1252,7 +1255,25 @@ Scripting.addGlobal(function shareDashboard(dashboard: Doc) {
     SharingManager.Instance.open(undefined, dashboard);
 },
     "opens sharing dialog for Dashboard");
-Scripting.addGlobal(function addToDashboards(dashboard: Doc) { Doc.AddDocToList(CurrentUserUtils.MyDashboards, "data", dashboard); },
+Scripting.addGlobal(function addToDashboards(dashboard: Doc) {
+    const dashboardAlias = Doc.MakeAlias(dashboard);
+    dashboardAlias.data = new List<Doc>(DocListCast(dashboard.data).map(tabFolder => Doc.MakeAlias(tabFolder)));
+    // DocListCast(dashboardAlias.data).forEach(tabFolder => {
+    //     tabFolder.data = new List<Doc>(DocListCast(tabFolder.data).map(tab => Doc.MakeAlias(tab)));
+    // });
+    Doc.AddDocToList(CurrentUserUtils.MyDashboards, "data", dashboardAlias);
+    CurrentUserUtils.openDashboard(Doc.UserDoc(), dashboardAlias);
+},
     "adds Dashboard to set of Dashboards");
-Scripting.addGlobal(function toggleComicMode() { Doc.UserDoc().renderStyle = Doc.UserDoc().renderStyle === "comic" ? undefined : "comic"; },
-    "toggle between regular rendeing and an informal sketch/comic style");
+
+Scripting.addGlobal(function dynamicOffScreenDocs(dashboard: Doc) {
+    const allDocs = DocListCast(dashboard[DataSym]["data-all"]);
+    console.log(allDocs);
+    const onScreenTab = DocListCast(dashboard.data)[0];
+    const onScreenDocs = DocListCast(onScreenTab.data);
+    return allDocs.reduce((result: Doc[], doc) => {
+        !onScreenDocs.includes(doc) && (result.push(doc));
+        // console.log(doc);
+        return result;
+    }, []);
+});
diff --git a/src/client/util/SharingManager.tsx b/src/client/util/SharingManager.tsx
index 2f8ecd4ee..18f254cd6 100644
--- a/src/client/util/SharingManager.tsx
+++ b/src/client/util/SharingManager.tsx
@@ -173,10 +173,14 @@ export class SharingManager extends React.Component<{}> {
         const target = targetDoc || this.targetDoc!;
         const acl = `acl-${normalizeEmail(user.email)}`;
         const myAcl = `acl-${Doc.CurrentUserEmailNormalized}`;
+        console.log(DocListCast(CurrentUserUtils.MyDashboards.data));
+        console.log(target);
+        console.log(DocListCast(CurrentUserUtils.MyDashboards.data).indexOf(target));
+        const isDashboard = DocListCast(CurrentUserUtils.MyDashboards.data).indexOf(target) !== -1;
 
         const docs = SelectionManager.Views().length < 2 ? [target] : SelectionManager.Views().map(docView => docView.props.Document);
         return !docs.map(doc => {
-            doc.author === Doc.CurrentUserEmail && !doc[myAcl] && distributeAcls(myAcl, SharingPermissions.Admin, doc);
+            doc.author === Doc.CurrentUserEmail && !doc[myAcl] && distributeAcls(myAcl, SharingPermissions.Admin, doc, undefined, undefined, isDashboard);
 
             if (permission === SharingPermissions.None) {
                 if (doc[acl] && doc[acl] !== SharingPermissions.None) doc.numUsersShared = NumCast(doc.numUsersShared, 1) - 1;
@@ -185,7 +189,7 @@ export class SharingManager extends React.Component<{}> {
                 if (!doc[acl] || doc[acl] === SharingPermissions.None) doc.numUsersShared = NumCast(doc.numUsersShared, 0) + 1;
             }
 
-            distributeAcls(acl, permission as SharingPermissions, doc);
+            distributeAcls(acl, permission as SharingPermissions, doc, undefined, undefined, isDashboard);
 
             this.setDashboardBackground(doc, permission as SharingPermissions);
             if (permission !== SharingPermissions.None) return Doc.AddDocToList(sharingDoc, storage, doc);
@@ -203,12 +207,13 @@ export class SharingManager extends React.Component<{}> {
         const target = targetDoc || this.targetDoc!;
         const key = normalizeEmail(StrCast(group.title));
         const acl = `acl-${key}`;
+        const isDashboard = DocListCast(CurrentUserUtils.MyDashboards.data).indexOf(target) !== -1;
 
         const docs = SelectionManager.Views().length < 2 ? [target] : SelectionManager.Views().map(docView => docView.props.Document);
 
         // ! ensures it returns true if document has been shared successfully, false otherwise
         return !docs.map(doc => {
-            doc.author === Doc.CurrentUserEmail && !doc[`acl-${Doc.CurrentUserEmailNormalized}`] && distributeAcls(`acl-${Doc.CurrentUserEmailNormalized}`, SharingPermissions.Admin, doc);
+            doc.author === Doc.CurrentUserEmail && !doc[`acl-${Doc.CurrentUserEmailNormalized}`] && distributeAcls(`acl-${Doc.CurrentUserEmailNormalized}`, SharingPermissions.Admin, doc, undefined, undefined, isDashboard);
 
             if (permission === SharingPermissions.None) {
                 if (doc[acl] && doc[acl] !== SharingPermissions.None) doc.numGroupsShared = NumCast(doc.numGroupsShared, 1) - 1;
@@ -217,7 +222,7 @@ export class SharingManager extends React.Component<{}> {
                 if (!doc[acl] || doc[acl] === SharingPermissions.None) doc.numGroupsShared = NumCast(doc.numGroupsShared, 0) + 1;
             }
 
-            distributeAcls(acl, permission as SharingPermissions, doc);
+            distributeAcls(acl, permission as SharingPermissions, doc, undefined, undefined, isDashboard);
             this.setDashboardBackground(doc, permission as SharingPermissions);
 
             if (group instanceof Doc) {
@@ -267,8 +272,10 @@ export class SharingManager extends React.Component<{}> {
             });
         }
         else {
+            const dashboards = DocListCast(CurrentUserUtils.MyDashboards.data);
             docs.forEach(doc => {
-                if (GetEffectiveAcl(doc) === AclAdmin) distributeAcls(`acl-${shareWith}`, permission, doc);
+                const isDashboard = dashboards.indexOf(doc) !== -1;
+                if (GetEffectiveAcl(doc) === AclAdmin) distributeAcls(`acl-${shareWith}`, permission, doc, undefined, undefined, isDashboard);
             });
         }
     }
@@ -316,10 +323,11 @@ export class SharingManager extends React.Component<{}> {
      */
     removeGroup = (group: Doc) => {
         if (group.docsShared) {
+            const dashboards = DocListCast(CurrentUserUtils.MyDashboards.data);
             DocListCast(group.docsShared).forEach(doc => {
                 const acl = `acl-${StrCast(group.title)}`;
-
-                distributeAcls(acl, SharingPermissions.None, doc);
+                const isDashboard = dashboards.indexOf(doc) !== -1;
+                distributeAcls(acl, SharingPermissions.None, doc, undefined, undefined, isDashboard);
 
                 const members: string[] = JSON.parse(StrCast(group.members));
                 const users: ValidatedUser[] = this.users.filter(({ user: { email } }) => members.includes(email));
@@ -445,16 +453,16 @@ export class SharingManager extends React.Component<{}> {
         }
     }
 
-    distributeOverCollection = (targetDoc?: Doc) => {
-        const target = targetDoc || this.targetDoc!;
+    // distributeOverCollection = (targetDoc?: Doc) => {
+    //     const target = targetDoc || this.targetDoc!;
 
-        const docs = SelectionManager.Views().length < 2 ? [target] : SelectionManager.Views().map(docView => docView.props.Document);
-        docs.forEach(doc => {
-            for (const [key, value] of Object.entries(doc[AclSym])) {
-                distributeAcls(key, this.AclMap.get(value)! as SharingPermissions, target);
-            }
-        });
-    }
+    //     const docs = SelectionManager.Views().length < 2 ? [target] : SelectionManager.Views().map(docView => docView.props.Document);
+    //     docs.forEach(doc => {
+    //         for (const [key, value] of Object.entries(doc[AclSym])) {
+    //             distributeAcls(key, this.AclMap.get(value)! as SharingPermissions, target);
+    //         }
+    //     });
+    // }
 
     /**
      * Sorting algorithm to sort users.
diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx
index 388f9a909..819667834 100644
--- a/src/client/views/collections/CollectionDockingView.tsx
+++ b/src/client/views/collections/CollectionDockingView.tsx
@@ -4,7 +4,7 @@ import { action, IReactionDisposer, observable, reaction, runInAction } from "mo
 import { observer } from "mobx-react";
 import * as ReactDOM from 'react-dom';
 import * as GoldenLayout from "../../../client/goldenLayout";
-import { Doc, DocListCast, Opt, DocListCastAsync } from "../../../fields/Doc";
+import { Doc, DocListCast, Opt, DocListCastAsync, DataSym } from "../../../fields/Doc";
 import { Id } from '../../../fields/FieldSymbols';
 import { InkTool } from '../../../fields/InkField';
 import { List } from '../../../fields/List';
@@ -24,6 +24,7 @@ import React = require("react");
 import { DocumentType } from '../../documents/DocumentTypes';
 import { listSpec } from '../../../fields/Schema';
 import { LightboxView } from '../LightboxView';
+import { inheritParentAcls } from '../../../fields/util';
 const _global = (window /* browser */ || global /* node */) as any;
 
 @observer
@@ -160,6 +161,7 @@ export class CollectionDockingView extends CollectionSubView(doc => doc) {
         }
         const instance = CollectionDockingView.Instance;
         if (!instance) return false;
+        else Doc.AddDocToList(instance.props.Document[DataSym], "data-all", document);
         const docContentConfig = CollectionDockingView.makeDocumentConfig(document, panelName);
 
         if (!pullSide && stack) {
@@ -381,15 +383,22 @@ export class CollectionDockingView extends CollectionSubView(doc => doc) {
         setTimeout(async () => {
             const sublists = await DocListCastAsync(this.props.Document[this.props.fieldKey]);
             const tabs = sublists && Cast(sublists[0], Doc, null);
-            const other = sublists && Cast(sublists[1], Doc, null);
+            // const other = sublists && Cast(sublists[1], Doc, null);
             const tabdocs = await DocListCastAsync(tabs?.data);
-            const otherdocs = await DocListCastAsync(other?.data);
-            tabs && (Doc.GetProto(tabs).data = new List<Doc>(docs));
-            const otherSet = new Set<Doc>();
-            otherdocs?.filter(doc => !docs.includes(doc)).forEach(doc => otherSet.add(doc));
-            tabdocs?.filter(doc => !docs.includes(doc) && doc.type !== DocumentType.KVP).forEach(doc => otherSet.add(doc));
-            const vals = Array.from(otherSet.values()).filter(val => val instanceof Doc).map(d => d).filter(d => d.type !== DocumentType.KVP);
-            other && (Doc.GetProto(other).data = new List<Doc>(vals));
+            // const otherdocs = await DocListCastAsync(other?.data);
+            if (tabs) {
+                tabs.data = new List<Doc>(docs);
+                // DocListCast(tabs.aliases).forEach(tab => tab !== tabs && (tab.data = new List<Doc>(docs)));
+            }
+            // const otherSet = new Set<Doc>();
+            // otherdocs?.filter(doc => !docs.includes(doc)).forEach(doc => otherSet.add(doc));
+            // tabdocs?.filter(doc => !docs.includes(doc) && doc.type !== DocumentType.KVP).forEach(doc => otherSet.add(doc));
+            // const vals = Array.from(otherSet.values()).filter(val => val instanceof Doc).map(d => d).filter(d => d.type !== DocumentType.KVP);
+            // this.props.Document[DataSym][this.props.fieldKey + "-all"] = new List<Doc>([...docs, ...vals]);
+            // if (other) {
+            //     other.data = new List<Doc>(vals);
+            //     // DocListCast(other.aliases).forEach(tab => tab !== other && (tab.data = new List<Doc>(vals)));
+            // }
         }, 0);
     }
 
@@ -399,7 +408,7 @@ export class CollectionDockingView extends CollectionSubView(doc => doc) {
         tab.reactComponents?.forEach((ele: any) => ReactDOM.unmountComponentAtNode(ele));
     }
     tabCreated = (tab: any) => {
-        tab.contentItem.element[0]?.firstChild?.firstChild?.InitTab?.(tab);  // have to explicitly initialize tabs that reuse contents from previous abs (ie, when dragging a tab around a new tab is created for the old content)
+        tab.contentItem.element[0]?.firstChild?.firstChild?.InitTab?.(tab);  // have to explicitly initialize tabs that reuse contents from previous tabs (ie, when dragging a tab around a new tab is created for the old content)
     }
 
     stackCreated = (stack: any) => {
@@ -407,9 +416,11 @@ export class CollectionDockingView extends CollectionSubView(doc => doc) {
             if (e.target === stack.header?.element[0] && e.button === 2) {
                 const emptyPane = CurrentUserUtils.EmptyPane;
                 emptyPane["dragFactory-count"] = NumCast(emptyPane["dragFactory-count"]) + 1;
-                CollectionDockingView.AddSplit(Docs.Create.FreeformDocument([], {
-                    _width: this.props.PanelWidth(), _height: this.props.PanelHeight(), _fitWidth: true, title: `Untitled Tab ${NumCast(emptyPane["dragFactory-count"])}`
-                }), "", stack);
+                const docToAdd = Docs.Create.FreeformDocument([], {
+                    _width: this.props.PanelWidth(), _height: this.props.PanelHeight(), _fitWidth: true, title: `Untitled Tab ${NumCast(emptyPane["dragFactory-count"])}`,
+                });
+                this.props.Document.isShared && inheritParentAcls(this.props.Document, docToAdd);
+                CollectionDockingView.AddSplit(docToAdd, "", stack);
             }
         });
 
@@ -430,9 +441,11 @@ export class CollectionDockingView extends CollectionSubView(doc => doc) {
                 // stack.config.fixed = !stack.config.fixed;  // force the stack to have a fixed size
                 const emptyPane = CurrentUserUtils.EmptyPane;
                 emptyPane["dragFactory-count"] = NumCast(emptyPane["dragFactory-count"]) + 1;
-                CollectionDockingView.AddSplit(Docs.Create.FreeformDocument([], {
+                const docToAdd = Docs.Create.FreeformDocument([], {
                     _width: this.props.PanelWidth(), _height: this.props.PanelHeight(), _fitWidth: true, title: `Untitled Tab ${NumCast(emptyPane["dragFactory-count"])}`
-                }), "", stack);
+                });
+                this.props.Document.isShared && inheritParentAcls(this.props.Document, docToAdd);
+                CollectionDockingView.AddSplit(docToAdd, "", stack);
             }));
     }
 
diff --git a/src/client/views/collections/TreeView.tsx b/src/client/views/collections/TreeView.tsx
index 2e98fb508..ba4af2a6d 100644
--- a/src/client/views/collections/TreeView.tsx
+++ b/src/client/views/collections/TreeView.tsx
@@ -151,7 +151,10 @@ export class TreeView extends React.Component<TreeViewProps> {
             this.treeViewOpen = !this.treeViewOpen;
         } else {
             // choose an appropriate alias or make one. --- choose the first alias that (1) user owns,  (2) has no context field ... otherwise make a new alias
+            // this.props.addDocTab(CurrentUserUtils.ActiveDashboard.isShared ? Doc.MakeAlias(this.props.document) : this.props.document, "add:right");
+            // choose an appropriate alias or make one -- -- choose the first alias that (1) the user owns, (2) has no context field - if I own it and someone else does not have it open,, otherwise create an alias
             this.props.addDocTab(this.props.document, "add:right");
+
         }
     }
     constructor(props: any) {
@@ -507,7 +510,11 @@ export class TreeView extends React.Component<TreeViewProps> {
                     [{ script: ScriptField.MakeFunction(`DocFocusOrOpen(self)`)!, label: "Focus or Open" }];
     }
     onChildClick = () => this.props.onChildClick?.() ?? (this._editTitleScript?.() || ScriptCast(this.doc.treeChildClick));
-    onChildDoubleClick = () => (!this.props.treeView.outlineMode && this._openScript?.()) || ScriptCast(this.doc.treeChildDoubleClick);
+
+    onChildDoubleClick = () => {
+        console.log(this.props.document.onChildDoubleClick);
+        return (!this.props.treeView.outlineMode && this._openScript?.()) || ScriptCast(this.doc.treeChildDoubleClick)
+    };
 
     refocus = () => this.props.treeView.props.focus(this.props.treeView.props.Document);
     ignoreEvent = (e: any) => {
diff --git a/src/fields/util.ts b/src/fields/util.ts
index a4c99928a..882c7fee8 100644
--- a/src/fields/util.ts
+++ b/src/fields/util.ts
@@ -136,11 +136,9 @@ export function denormalizeEmail(email: string) {
  * Copies parent's acl fields to the child
  */
 export function inheritParentAcls(parent: Doc, child: Doc) {
-    if (parent.isShared) {
-        const dataDoc = parent[DataSym];
-        for (const key of Object.keys(dataDoc)) {
-            key.startsWith("acl") && distributeAcls(key, dataDoc[key], child);
-        }
+    const dataDoc = parent[DataSym];
+    for (const key of Object.keys(dataDoc)) {
+        key.startsWith("acl") && distributeAcls(key, dataDoc[key], child);
     }
 }
 
@@ -228,7 +226,7 @@ function getEffectiveAcl(target: any, user?: string): symbol {
  * @param inheritingFromCollection whether the target is being assigned rights after being dragged into a collection (and so is inheriting the acls from the collection)
  * inheritingFromCollection is not currently being used but could be used if acl assignment defaults change
  */
-export function distributeAcls(key: string, acl: SharingPermissions, target: Doc, inheritingFromCollection?: boolean, visited?: Doc[]) {
+export function distributeAcls(key: string, acl: SharingPermissions, target: Doc, inheritingFromCollection?: boolean, visited?: Doc[], isDashboard?: boolean) {
     if (!visited) visited = [] as Doc[];
     if (visited.includes(target)) return;
     visited.push(target);
@@ -249,6 +247,12 @@ export function distributeAcls(key: string, acl: SharingPermissions, target: Doc
     if (GetEffectiveAcl(target) === AclAdmin && (!inheritingFromCollection || !target[key] || HierarchyMapping.get(StrCast(target[key]))! > HierarchyMapping.get(acl)!)) {
         target[key] = acl;
         layoutDocChanged = true;
+
+        if (isDashboard) {
+            DocListCast(target[Doc.LayoutFieldKey(target)]).forEach(d => {
+                distributeAcls(key, acl, d, inheritingFromCollection, visited);
+            });
+        }
     }
 
     if (dataDoc && (!inheritingFromCollection || !dataDoc[key] || HierarchyMapping.get(StrCast(dataDoc[key]))! > HierarchyMapping.get(acl)!)) {
@@ -263,7 +267,7 @@ export function distributeAcls(key: string, acl: SharingPermissions, target: Doc
         links.forEach(link => distributeAcls(key, acl, link, inheritingFromCollection, visited));
 
         // maps over the children of the document
-        DocListCast(dataDoc[Doc.LayoutFieldKey(dataDoc)]).map(d => {
+        DocListCast(dataDoc[Doc.LayoutFieldKey(dataDoc) + (isDashboard ? "-all" : "")]).map(d => { // this is now on the layoutdoc instead - figure out the "data-all" approach for the datadoc
             // if (GetEffectiveAcl(d) === AclAdmin && (!inheritingFromCollection || !d[key] || HierarchyMapping.get(StrCast(d[key]))! > HierarchyMapping.get(acl)!)) {
             distributeAcls(key, acl, d, inheritingFromCollection, visited);
             // }
-- 
cgit v1.2.3-70-g09d2


From 7c18243dd38656b63334f48d9270d912ce6384fa Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Mon, 17 May 2021 18:45:01 -0400
Subject: fixes for offscreen tabs

---
 src/client/util/CurrentUserUtils.ts | 25 ++++++++++++++-----------
 1 file changed, 14 insertions(+), 11 deletions(-)

(limited to 'src')

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 6fdf649a4..a8327ae93 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -1187,8 +1187,8 @@ export class CurrentUserUtils {
         const freeformDoc = CurrentUserUtils.GuestTarget || Docs.Create.FreeformDocument([], freeformOptions);
         const dashboardDoc = Docs.Create.StandardCollectionDockingDocument([{ doc: freeformDoc, initialWidth: 600 }], { title: `Dashboard ${dashboardCount}` }, id, "row"); // add isFolder:true here?
         freeformDoc.context = dashboardDoc;
-
-        DocListCast(dashboardDoc.data)[1].data = ComputedField.MakeFunction(`dynamicOffScreenDocs(dashboardDoc)`, { dashboardDoc: Doc.name }, { dashboardDoc }) as any;
+        DocListCast(dashboardDoc.data).forEach(doc => doc.dashboard = dashboardDoc);
+        DocListCast(dashboardDoc.data)[1].data = ComputedField.MakeFunction(`dynamicOffScreenDocs(self.dashboard)`) as any;
 
         Doc.AddDocToList(myPresentations, "data", presentation);
         userDoc.activePresentation = presentation;
@@ -1267,13 +1267,16 @@ Scripting.addGlobal(function addToDashboards(dashboard: Doc) {
     "adds Dashboard to set of Dashboards");
 
 Scripting.addGlobal(function dynamicOffScreenDocs(dashboard: Doc) {
-    const allDocs = DocListCast(dashboard[DataSym]["data-all"]);
-    console.log(allDocs);
-    const onScreenTab = DocListCast(dashboard.data)[0];
-    const onScreenDocs = DocListCast(onScreenTab.data);
-    return allDocs.reduce((result: Doc[], doc) => {
-        !onScreenDocs.includes(doc) && (result.push(doc));
-        // console.log(doc);
-        return result;
-    }, []);
+    if (dashboard[DataSym] instanceof Doc) {
+        const allDocs = DocListCast(dashboard[DataSym]["data-all"]);
+        console.log(allDocs);
+        const onScreenTab = DocListCast(dashboard.data)[0];
+        const onScreenDocs = DocListCast(onScreenTab.data);
+        return new List<Doc>(allDocs.reduce((result: Doc[], doc) => {
+            !onScreenDocs.includes(doc) && (result.push(doc));
+            // console.log(doc);
+            return result;
+        }, []));
+    }
+    return [];
 });
-- 
cgit v1.2.3-70-g09d2


From 77c16aa9f00a9d1b5e31ddf5a68d56f183f13691 Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Thu, 20 May 2021 12:47:46 -0400
Subject: dashboard sharing, aliases now work? needs more testing

---
 src/client/util/CurrentUserUtils.ts                   | 19 +++++++++++++------
 .../views/collections/CollectionDockingView.tsx       |  6 +++++-
 2 files changed, 18 insertions(+), 7 deletions(-)

(limited to 'src')

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index a8327ae93..e143887fa 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -1255,12 +1255,20 @@ Scripting.addGlobal(function shareDashboard(dashboard: Doc) {
     SharingManager.Instance.open(undefined, dashboard);
 },
     "opens sharing dialog for Dashboard");
-Scripting.addGlobal(function addToDashboards(dashboard: Doc) {
+Scripting.addGlobal(async function addToDashboards(dashboard: Doc) {
     const dashboardAlias = Doc.MakeAlias(dashboard);
+    const dockingConfig = JSON.parse(StrCast(dashboardAlias.dockingConfig));
+    dockingConfig.content = [];
+    dashboardAlias.dockingConfig = JSON.stringify(dockingConfig);
+
+    const allDocs = await DocListCastAsync(dashboard[DataSym]["data-all"]);
+
+    dashboardAlias["data-all"] = new List<Doc>((allDocs || []).map(doc => Doc.MakeAlias(doc)));
+
     dashboardAlias.data = new List<Doc>(DocListCast(dashboard.data).map(tabFolder => Doc.MakeAlias(tabFolder)));
-    // DocListCast(dashboardAlias.data).forEach(tabFolder => {
-    //     tabFolder.data = new List<Doc>(DocListCast(tabFolder.data).map(tab => Doc.MakeAlias(tab)));
-    // });
+    DocListCast(dashboardAlias.data).forEach(doc => doc.dashboard = dashboardAlias);
+    DocListCast(dashboardAlias.data)[0].data = new List<Doc>();
+    DocListCast(dashboardAlias.data)[1].data = ComputedField.MakeFunction(`dynamicOffScreenDocs(self.dashboard)`) as any;
     Doc.AddDocToList(CurrentUserUtils.MyDashboards, "data", dashboardAlias);
     CurrentUserUtils.openDashboard(Doc.UserDoc(), dashboardAlias);
 },
@@ -1268,13 +1276,12 @@ Scripting.addGlobal(function addToDashboards(dashboard: Doc) {
 
 Scripting.addGlobal(function dynamicOffScreenDocs(dashboard: Doc) {
     if (dashboard[DataSym] instanceof Doc) {
-        const allDocs = DocListCast(dashboard[DataSym]["data-all"]);
+        const allDocs = DocListCast(dashboard["data-all"]);
         console.log(allDocs);
         const onScreenTab = DocListCast(dashboard.data)[0];
         const onScreenDocs = DocListCast(onScreenTab.data);
         return new List<Doc>(allDocs.reduce((result: Doc[], doc) => {
             !onScreenDocs.includes(doc) && (result.push(doc));
-            // console.log(doc);
             return result;
         }, []));
     }
diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx
index 819667834..235fe8950 100644
--- a/src/client/views/collections/CollectionDockingView.tsx
+++ b/src/client/views/collections/CollectionDockingView.tsx
@@ -161,7 +161,11 @@ export class CollectionDockingView extends CollectionSubView(doc => doc) {
         }
         const instance = CollectionDockingView.Instance;
         if (!instance) return false;
-        else Doc.AddDocToList(instance.props.Document[DataSym], "data-all", document);
+        else {
+            const docList = DocListCast(instance.props.Document[DataSym]["data-all"]);
+            !docList.includes(document) && !docList.includes(document.aliasOf as Doc) && Doc.AddDocToList(instance.props.Document[DataSym], "data-all", document);
+            DocListCast(instance.props.Document[DataSym]["aliases"]).forEach(alias => !alias.aliasOf && alias !== instance.props.Document && Doc.AddDocToList(alias, "data-all", Doc.MakeAlias(document)));
+        }
         const docContentConfig = CollectionDockingView.makeDocumentConfig(document, panelName);
 
         if (!pullSide && stack) {
-- 
cgit v1.2.3-70-g09d2


From 64dbd28badac3e0689ea38d92e4f6c660967ccce Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Sun, 30 May 2021 17:27:31 -0400
Subject: cleanup

---
 src/client/views/collections/TreeView.tsx | 1 -
 src/fields/util.ts                        | 8 +++-----
 2 files changed, 3 insertions(+), 6 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/TreeView.tsx b/src/client/views/collections/TreeView.tsx
index ba4af2a6d..fc4361935 100644
--- a/src/client/views/collections/TreeView.tsx
+++ b/src/client/views/collections/TreeView.tsx
@@ -512,7 +512,6 @@ export class TreeView extends React.Component<TreeViewProps> {
     onChildClick = () => this.props.onChildClick?.() ?? (this._editTitleScript?.() || ScriptCast(this.doc.treeChildClick));
 
     onChildDoubleClick = () => {
-        console.log(this.props.document.onChildDoubleClick);
         return (!this.props.treeView.outlineMode && this._openScript?.()) || ScriptCast(this.doc.treeChildDoubleClick)
     };
 
diff --git a/src/fields/util.ts b/src/fields/util.ts
index 882c7fee8..f0cc20d74 100644
--- a/src/fields/util.ts
+++ b/src/fields/util.ts
@@ -267,23 +267,21 @@ export function distributeAcls(key: string, acl: SharingPermissions, target: Doc
         links.forEach(link => distributeAcls(key, acl, link, inheritingFromCollection, visited));
 
         // maps over the children of the document
-        DocListCast(dataDoc[Doc.LayoutFieldKey(dataDoc) + (isDashboard ? "-all" : "")]).map(d => { // this is now on the layoutdoc instead - figure out the "data-all" approach for the datadoc
-            // if (GetEffectiveAcl(d) === AclAdmin && (!inheritingFromCollection || !d[key] || HierarchyMapping.get(StrCast(d[key]))! > HierarchyMapping.get(acl)!)) {
+        DocListCast(dataDoc[Doc.LayoutFieldKey(dataDoc) + (isDashboard ? "-all" : "")]).map(d => {
             distributeAcls(key, acl, d, inheritingFromCollection, visited);
             // }
             const data = d[DataSym];
-            if (data) {// && GetEffectiveAcl(data) === AclAdmin && (!inheritingFromCollection || !data[key] || HierarchyMapping.get(StrCast(data[key]))! > HierarchyMapping.get(acl)!)) {
+            if (data) {
                 distributeAcls(key, acl, data, inheritingFromCollection, visited);
             }
         });
 
         // maps over the annotations of the document
         DocListCast(dataDoc[Doc.LayoutFieldKey(dataDoc) + "-annotations"]).map(d => {
-            // if (GetEffectiveAcl(d) === AclAdmin && (!inheritingFromCollection || !d[key] || HierarchyMapping.get(StrCast(d[key]))! > HierarchyMapping.get(acl)!)) {
             distributeAcls(key, acl, d, inheritingFromCollection, visited);
             // }
             const data = d[DataSym];
-            if (data) {// && GetEffectiveAcl(data) === AclAdmin && (!inheritingFromCollection || !data[key] || HierarchyMapping.get(StrCast(data[key]))! > HierarchyMapping.get(acl)!)) {
+            if (data) {
                 distributeAcls(key, acl, data, inheritingFromCollection, visited);
             }
         });
-- 
cgit v1.2.3-70-g09d2


From 7a31b05aa21d5cf99fac1ad031ab745266ca3fda Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Sun, 30 May 2021 18:03:31 -0400
Subject: sharingmanagaer cleanup

---
 src/client/util/SharingManager.tsx | 20 +++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

(limited to 'src')

diff --git a/src/client/util/SharingManager.tsx b/src/client/util/SharingManager.tsx
index 18f254cd6..db23941c7 100644
--- a/src/client/util/SharingManager.tsx
+++ b/src/client/util/SharingManager.tsx
@@ -39,7 +39,7 @@ interface GroupedOptions {
 }
 
 // const SharingKey = "sharingPermissions";
-// const PublicKey = "publicLinkPermissions";
+// const PublicKey = "all";
 // const DefaultColor = "black";
 
 // used to differentiate between individuals and groups when sharing
@@ -91,7 +91,7 @@ export class SharingManager extends React.Component<{}> {
     ]);
 
     // private get linkVisible() {
-    //     return this.sharingDoc ? this.sharingDoc[PublicKey] !== SharingPermissions.None : false;
+    //     return this.targetDoc ? this.targetDoc["acl-" + PublicKey] !== SharingPermissions.None : false;
     // }
 
     public open = (target?: DocumentView, target_doc?: Doc) => {
@@ -173,9 +173,6 @@ export class SharingManager extends React.Component<{}> {
         const target = targetDoc || this.targetDoc!;
         const acl = `acl-${normalizeEmail(user.email)}`;
         const myAcl = `acl-${Doc.CurrentUserEmailNormalized}`;
-        console.log(DocListCast(CurrentUserUtils.MyDashboards.data));
-        console.log(target);
-        console.log(DocListCast(CurrentUserUtils.MyDashboards.data).indexOf(target));
         const isDashboard = DocListCast(CurrentUserUtils.MyDashboards.data).indexOf(target) !== -1;
 
         const docs = SelectionManager.Views().length < 2 ? [target] : SelectionManager.Views().map(docView => docView.props.Document);
@@ -340,11 +337,11 @@ export class SharingManager extends React.Component<{}> {
 
 
     // private setExternalSharing = (permission: string) => {
-    //     const sharingDoc = this.sharingDoc;
-    //     if (!sharingDoc) {
+    //     const targetDoc = this.targetDoc;
+    //     if (!targetDoc) {
     //         return;
     //     }
-    //     sharingDoc[PublicKey] = permission;
+    //     targetDoc["acl-" + PublicKey] = permission;
     // }
 
     // private get sharingUrl() {
@@ -595,7 +592,7 @@ export class SharingManager extends React.Component<{}> {
 
         // the list of groups shared with
         const groupListMap: (Doc | { title: string })[] = groups.filter(({ title }) => docs.length > 1 ? commonKeys.includes(`acl-${normalizeEmail(StrCast(title))}`) : true);
-        groupListMap.unshift({ title: "Public" });//, { title: "Override" });
+        groupListMap.unshift({ title: "Public" });//, { title: "ALL" });
         const groupListContents = groupListMap.map(group => {
             const groupKey = `acl-${StrCast(group.title)}`;
             const uniform = docs.every(doc => this.layoutDocAcls ? doc?.[AclSym]?.[groupKey] === docs[0]?.[AclSym]?.[groupKey] : doc?.[DataSym]?.[AclSym]?.[groupKey] === docs[0]?.[DataSym]?.[AclSym]?.[groupKey]);
@@ -644,6 +641,11 @@ export class SharingManager extends React.Component<{}> {
                     <div className={"close-button"} onClick={this.close}>
                         <FontAwesomeIcon icon={"times"} color={"black"} size={"lg"} />
                     </div>
+                    {/* {this.linkVisible ?
+                        <div>
+                            {this.sharingUrl}
+                        </div> :
+                        (null)} */}
                     {<div className="share-container">
                         <div className="share-setup">
                             <Select
-- 
cgit v1.2.3-70-g09d2


From b85e7819ae46558a659cac73817be0b812d6abbe Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Mon, 31 May 2021 20:18:19 -0400
Subject: sharing dashboard works? pending fixing remnant on screen tabs

---
 src/client/documents/Documents.ts                  | 17 +++---------
 src/client/util/CurrentUserUtils.ts                | 30 +++++++++++++++++++---
 .../views/collections/CollectionDockingView.tsx    |  9 ++++++-
 3 files changed, 38 insertions(+), 18 deletions(-)

(limited to 'src')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 6fb6f70b3..70541b559 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -648,9 +648,8 @@ export namespace Docs {
          * constructor just generates a new GUID. This is currently used
          * only when creating a DockDocument from the current user's already existing
          * main document.
-         * @param layoutData whether the fieldKey field on the layout doc should store the data or the data doc
          */
-        function InstanceFromProto(proto: Doc, data: Field | undefined, options: DocumentOptions, delegId?: string, fieldKey: string = "data", protoId?: string, layoutData?: boolean) {
+        function InstanceFromProto(proto: Doc, data: Field | undefined, options: DocumentOptions, delegId?: string, fieldKey: string = "data", protoId?: string) {
             const viewKeys = ["x", "y", "system"]; // keys that should be addded to the view document even though they don't begin with an "_"
             const { omit: dataProps, extract: viewProps } = OmitKeys(options, viewKeys, "^_");
 
@@ -662,16 +661,8 @@ export namespace Docs {
             dataProps["acl-Override"] = "None";
             dataProps["acl-Public"] = Doc.UserDoc()?.defaultAclPrivate ? SharingPermissions.None : SharingPermissions.Add;
 
-            if (layoutData) {
-                viewProps[fieldKey] = data;
-                const list = new List<Doc>();
-                console.log(DocListCast(data));
-                DocListCast(data).forEach(doc => {
-                    list.push(...DocListCast(doc.data));
-                });
-                dataProps[fieldKey + "-all"] = list;
-            }
-            else dataProps[fieldKey] = data;
+            dataProps[fieldKey] = data;
+
             // so that the list of annotations is already initialised, prevents issues in addonly.
             // without this, if a doc has no annotations but the user has AddOnly privileges, they won't be able to add an annotation because they would have needed to create the field's list which they don't have permissions to do.
             dataProps[fieldKey + "-annotations"] = new List<Doc>();
@@ -902,7 +893,7 @@ export namespace Docs {
         export function DockDocument(documents: Array<Doc>, config: string, options: DocumentOptions, id?: string) {
             const tabs = TreeDocument(documents, { title: "On-Screen Tabs", childDontRegisterViews: true, freezeChildren: "remove|add", treeViewExpandedViewLock: true, treeViewExpandedView: "data", _fitWidth: true, system: true });
             const all = TreeDocument([], { title: "Off-Screen Tabs", childDontRegisterViews: true, freezeChildren: "add", treeViewExpandedViewLock: true, treeViewExpandedView: "data", system: true });
-            return InstanceFromProto(Prototypes.get(DocumentType.COL), new List([tabs, all]), { freezeChildren: "remove|add", treeViewExpandedViewLock: true, treeViewExpandedView: "data", ...options, _viewType: CollectionViewType.Docking, dockingConfig: config }, id, undefined, undefined, true);
+            return InstanceFromProto(Prototypes.get(DocumentType.COL), new List([tabs, all]), { freezeChildren: "remove|add", treeViewExpandedViewLock: true, treeViewExpandedView: "data", ...options, _viewType: CollectionViewType.Docking, dockingConfig: config }, id);
         }
 
         export function DirectoryImportDocument(options: DocumentOptions = {}) {
diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index e143887fa..90a2378fe 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -1187,6 +1187,22 @@ export class CurrentUserUtils {
         const freeformDoc = CurrentUserUtils.GuestTarget || Docs.Create.FreeformDocument([], freeformOptions);
         const dashboardDoc = Docs.Create.StandardCollectionDockingDocument([{ doc: freeformDoc, initialWidth: 600 }], { title: `Dashboard ${dashboardCount}` }, id, "row"); // add isFolder:true here?
         freeformDoc.context = dashboardDoc;
+
+        // switching the tabs from the datadoc to the regular doc
+        const dashboardTabs = dashboardDoc[DataSym].data;
+        dashboardDoc[DataSym].data = new List<Doc>();
+        dashboardDoc.data = dashboardTabs;
+
+        // collating all docs on the dashboard to make a data-all field
+        const allDocs = new List<Doc>();
+        const allDocs2 = new List<Doc>(); // Array.from, spread, splice all cause so stack or acl issues for some reason
+        DocListCast(dashboardTabs).forEach(doc => {
+            const tabDocs = DocListCast(doc.data);
+            allDocs.push(...tabDocs);
+            allDocs2.push(...tabDocs);
+        });
+        dashboardDoc[DataSym]["data-all"] = allDocs;
+        dashboardDoc["data-all"] = allDocs2;
         DocListCast(dashboardDoc.data).forEach(doc => doc.dashboard = dashboardDoc);
         DocListCast(dashboardDoc.data)[1].data = ComputedField.MakeFunction(`dynamicOffScreenDocs(self.dashboard)`) as any;
 
@@ -1257,14 +1273,18 @@ Scripting.addGlobal(function shareDashboard(dashboard: Doc) {
     "opens sharing dialog for Dashboard");
 Scripting.addGlobal(async function addToDashboards(dashboard: Doc) {
     const dashboardAlias = Doc.MakeAlias(dashboard);
-    const dockingConfig = JSON.parse(StrCast(dashboardAlias.dockingConfig));
-    dockingConfig.content = [];
-    dashboardAlias.dockingConfig = JSON.stringify(dockingConfig);
 
     const allDocs = await DocListCastAsync(dashboard[DataSym]["data-all"]);
 
+    // moves the data-all field from the datadoc to the layoutdoc, necessary for off screen docs tab to function properly
+    dashboard["data-all"] = new List<Doc>(allDocs);
     dashboardAlias["data-all"] = new List<Doc>((allDocs || []).map(doc => Doc.MakeAlias(doc)));
 
+    const dockingConfig = JSON.parse(StrCast(dashboardAlias.dockingConfig));
+    dockingConfig.content = [];
+    dashboardAlias.dockingConfig = JSON.stringify(dockingConfig);
+
+
     dashboardAlias.data = new List<Doc>(DocListCast(dashboard.data).map(tabFolder => Doc.MakeAlias(tabFolder)));
     DocListCast(dashboardAlias.data).forEach(doc => doc.dashboard = dashboardAlias);
     DocListCast(dashboardAlias.data)[0].data = new List<Doc>();
@@ -1274,10 +1294,12 @@ Scripting.addGlobal(async function addToDashboards(dashboard: Doc) {
 },
     "adds Dashboard to set of Dashboards");
 
+/**
+ * Dynamically computes which docs should be rendered in the off-screen tabs tree of a dashboard.
+ */
 Scripting.addGlobal(function dynamicOffScreenDocs(dashboard: Doc) {
     if (dashboard[DataSym] instanceof Doc) {
         const allDocs = DocListCast(dashboard["data-all"]);
-        console.log(allDocs);
         const onScreenTab = DocListCast(dashboard.data)[0];
         const onScreenDocs = DocListCast(onScreenTab.data);
         return new List<Doc>(allDocs.reduce((result: Doc[], doc) => {
diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx
index 235fe8950..2e44b65e6 100644
--- a/src/client/views/collections/CollectionDockingView.tsx
+++ b/src/client/views/collections/CollectionDockingView.tsx
@@ -163,8 +163,15 @@ export class CollectionDockingView extends CollectionSubView(doc => doc) {
         if (!instance) return false;
         else {
             const docList = DocListCast(instance.props.Document[DataSym]["data-all"]);
+            // adds the doc of the newly created tab to the data-all field if it doesn't already include that doc or one of its aliases
             !docList.includes(document) && !docList.includes(document.aliasOf as Doc) && Doc.AddDocToList(instance.props.Document[DataSym], "data-all", document);
-            DocListCast(instance.props.Document[DataSym]["aliases"]).forEach(alias => !alias.aliasOf && alias !== instance.props.Document && Doc.AddDocToList(alias, "data-all", Doc.MakeAlias(document)));
+            // adds an alias of the doc to the data-all field of the layoutdocs of the aliases
+            DocListCast(instance.props.Document[DataSym].aliases).forEach(alias => {
+                const aliasDocList = DocListCast(alias["data-all"]);
+                // if aliasDocList contains the alias, don't do anything
+                // otherwise add the original or an alias depending on whether the doc you're looking at is the current doc or a different alias
+                !DocListCast(document.aliases).some(a => aliasDocList.includes(a)) && Doc.AddDocToList(alias, "data-all", alias !== instance.props.Document ? Doc.MakeAlias(document) : document);
+            });
         }
         const docContentConfig = CollectionDockingView.makeDocumentConfig(document, panelName);
 
-- 
cgit v1.2.3-70-g09d2


From 16ecec059993f4f5ac3680afc0eb00eb559db91e Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Mon, 31 May 2021 21:31:30 -0400
Subject: folderised dashboards

---
 src/client/documents/Documents.ts   | 4 ++--
 src/client/util/CurrentUserUtils.ts | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

(limited to 'src')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 70541b559..da4e926b4 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -891,8 +891,8 @@ export namespace Docs {
         }
 
         export function DockDocument(documents: Array<Doc>, config: string, options: DocumentOptions, id?: string) {
-            const tabs = TreeDocument(documents, { title: "On-Screen Tabs", childDontRegisterViews: true, freezeChildren: "remove|add", treeViewExpandedViewLock: true, treeViewExpandedView: "data", _fitWidth: true, system: true });
-            const all = TreeDocument([], { title: "Off-Screen Tabs", childDontRegisterViews: true, freezeChildren: "add", treeViewExpandedViewLock: true, treeViewExpandedView: "data", system: true });
+            const tabs = TreeDocument(documents, { title: "On-Screen Tabs", childDontRegisterViews: true, freezeChildren: "remove|add", treeViewExpandedViewLock: true, treeViewExpandedView: "data", _fitWidth: true, system: true, isFolder: true });
+            const all = TreeDocument([], { title: "Off-Screen Tabs", childDontRegisterViews: true, freezeChildren: "add", treeViewExpandedViewLock: true, treeViewExpandedView: "data", system: true, isFolder: true });
             return InstanceFromProto(Prototypes.get(DocumentType.COL), new List([tabs, all]), { freezeChildren: "remove|add", treeViewExpandedViewLock: true, treeViewExpandedView: "data", ...options, _viewType: CollectionViewType.Docking, dockingConfig: config }, id);
         }
 
diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index be99d6ce4..6236e1ac9 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -1185,7 +1185,7 @@ export class CurrentUserUtils {
             title: `Untitled Tab ${NumCast(emptyPane["dragFactory-count"])}`,
         };
         const freeformDoc = CurrentUserUtils.GuestTarget || Docs.Create.FreeformDocument([], freeformOptions);
-        const dashboardDoc = Docs.Create.StandardCollectionDockingDocument([{ doc: freeformDoc, initialWidth: 600 }], { title: `Dashboard ${dashboardCount}` }, id, "row"); // add isFolder:true here?
+        const dashboardDoc = Docs.Create.StandardCollectionDockingDocument([{ doc: freeformDoc, initialWidth: 600 }], { title: `Dashboard ${dashboardCount}`, isFolder: true }, id, "row");
         freeformDoc.context = dashboardDoc;
 
         // switching the tabs from the datadoc to the regular doc
-- 
cgit v1.2.3-70-g09d2


From 0a0a467df5f87adb1f9872c82cc58bbc6c1046d7 Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Sat, 5 Jun 2021 17:44:54 -0400
Subject: cleanup

---
 src/client/views/collections/TreeView.tsx | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/TreeView.tsx b/src/client/views/collections/TreeView.tsx
index fc4361935..a20d41a8d 100644
--- a/src/client/views/collections/TreeView.tsx
+++ b/src/client/views/collections/TreeView.tsx
@@ -511,9 +511,7 @@ export class TreeView extends React.Component<TreeViewProps> {
     }
     onChildClick = () => this.props.onChildClick?.() ?? (this._editTitleScript?.() || ScriptCast(this.doc.treeChildClick));
 
-    onChildDoubleClick = () => {
-        return (!this.props.treeView.outlineMode && this._openScript?.()) || ScriptCast(this.doc.treeChildDoubleClick)
-    };
+    onChildDoubleClick = () => (!this.props.treeView.outlineMode && this._openScript?.()) || ScriptCast(this.doc.treeChildDoubleClick);
 
     refocus = () => this.props.treeView.props.focus(this.props.treeView.props.Document);
     ignoreEvent = (e: any) => {
-- 
cgit v1.2.3-70-g09d2


From fe672afad987b246b8be79366d2d9c45b6fba502 Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Thu, 10 Jun 2021 00:15:56 -0400
Subject: removed isfolder flag from dashboard to allow double click to open
 dashboard

---
 src/client/util/CurrentUserUtils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 6236e1ac9..8b3597d57 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -1185,7 +1185,7 @@ export class CurrentUserUtils {
             title: `Untitled Tab ${NumCast(emptyPane["dragFactory-count"])}`,
         };
         const freeformDoc = CurrentUserUtils.GuestTarget || Docs.Create.FreeformDocument([], freeformOptions);
-        const dashboardDoc = Docs.Create.StandardCollectionDockingDocument([{ doc: freeformDoc, initialWidth: 600 }], { title: `Dashboard ${dashboardCount}`, isFolder: true }, id, "row");
+        const dashboardDoc = Docs.Create.StandardCollectionDockingDocument([{ doc: freeformDoc, initialWidth: 600 }], { title: `Dashboard ${dashboardCount}` }, id, "row");
         freeformDoc.context = dashboardDoc;
 
         // switching the tabs from the datadoc to the regular doc
-- 
cgit v1.2.3-70-g09d2


From 0d07ddae31c5dae8364160801509e236c7e6e894 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 10 Jun 2021 18:30:29 -0400
Subject: fixed link anchor to not render as a blue box when link trails are
 turned on.

---
 src/client/views/StyleProvider.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/StyleProvider.tsx b/src/client/views/StyleProvider.tsx
index 9e61351c4..47a4a192c 100644
--- a/src/client/views/StyleProvider.tsx
+++ b/src/client/views/StyleProvider.tsx
@@ -127,7 +127,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
                 case DocumentType.LABEL: docColor = docColor || (doc.annotationOn !== undefined ? "rgba(128, 128, 128, 0.18)" : undefined); break;
                 case DocumentType.BUTTON: docColor = docColor || (darkScheme() ? "#2d2d2d" : "lightgray"); break;
                 case DocumentType.LINKANCHOR: docColor = isAnchor ? "lightblue" : "transparent"; break;
-                case DocumentType.LINK: docColor = docColor || "transparent"; break;
+                case DocumentType.LINK: docColor = (isAnchor ? docColor : "") || "transparent"; break;
                 case DocumentType.IMG:
                 case DocumentType.WEB:
                 case DocumentType.PDF:
-- 
cgit v1.2.3-70-g09d2


From d1e32902d0dabf92dd06d5aa9a139368eff17798 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 10 Jun 2021 18:40:28 -0400
Subject: fixed positioning of blue anchor dot when showing link anchor lines

---
 src/client/views/nodes/DocumentView.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index b861669f8..5646a9790 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -13,7 +13,7 @@ import { BoolCast, Cast, NumCast, ScriptCast, StrCast } from "../../../fields/Ty
 import { AudioField } from "../../../fields/URLField";
 import { GetEffectiveAcl, SharingPermissions, TraceMobx } from '../../../fields/util';
 import { MobileInterface } from '../../../mobile/MobileInterface';
-import { emptyFunction, hasDescendantTarget, OmitKeys, returnVal, Utils } from "../../../Utils";
+import { emptyFunction, hasDescendantTarget, OmitKeys, returnVal, Utils, returnTrue } from "../../../Utils";
 import { GooglePhotos } from '../../apis/google_docs/GooglePhotosClientUtils';
 import { Docs, DocUtils } from "../../documents/Documents";
 import { DocumentType } from '../../documents/DocumentTypes';
@@ -846,6 +846,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
                     PanelWidth={this.anchorPanelWidth}
                     PanelHeight={this.anchorPanelHeight}
                     dontRegisterView={false}
+                    fitWidth={returnTrue}
                     styleProvider={this.anchorStyleProvider}
                     removeDocument={this.hideLinkAnchor}
                     LayoutTemplate={undefined}
-- 
cgit v1.2.3-70-g09d2


From f651fda2c593981d918cea4afacfba4f73a1db58 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 17 Jun 2021 18:26:49 -0400
Subject: fixed drawing on images/videos/photos

---
 src/client/views/GestureOverlay.tsx                   | 2 +-
 src/client/views/nodes/ImageBox.tsx                   | 4 +++-
 src/client/views/nodes/VideoBox.tsx                   | 2 +-
 src/client/views/nodes/WebBox.tsx                     | 2 +-
 src/client/views/nodes/formattedText/RichTextMenu.tsx | 2 +-
 src/pen-gestures/GestureUtils.ts                      | 4 +---
 6 files changed, 8 insertions(+), 8 deletions(-)

(limited to 'src')

diff --git a/src/client/views/GestureOverlay.tsx b/src/client/views/GestureOverlay.tsx
index 491bf18b2..6a4f55bef 100644
--- a/src/client/views/GestureOverlay.tsx
+++ b/src/client/views/GestureOverlay.tsx
@@ -634,7 +634,7 @@ export class GestureOverlay extends Touchable {
         } else {
             this._points = [];
         }
-        CollectionFreeFormViewChrome.Instance.primCreated();
+        CollectionFreeFormViewChrome.Instance?.primCreated();
     }
 
     makePolygon = (shape: string, gesture: boolean) => {
diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx
index e2e08a0e6..13dfad0fe 100644
--- a/src/client/views/nodes/ImageBox.tsx
+++ b/src/client/views/nodes/ImageBox.tsx
@@ -26,6 +26,8 @@ import { FaceRectangles } from './FaceRectangles';
 import { FieldView, FieldViewProps } from './FieldView';
 import "./ImageBox.scss";
 import React = require("react");
+import { InkTool } from '../../../fields/InkField';
+import { CurrentUserUtils } from '../../util/CurrentUserUtils';
 const path = require('path');
 
 export const pageSchema = createSchema({
@@ -321,7 +323,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
     }
     @action
     marqueeDown = (e: React.PointerEvent) => {
-        if (!e.altKey && e.button === 0 && this.layoutDoc._viewScale === 1 && this.isContentActive(true)) this._marqueeing = [e.clientX, e.clientY];
+        if (!e.altKey && e.button === 0 && this.layoutDoc._viewScale === 1 && this.isContentActive(true) && ![InkTool.Highlighter, InkTool.Pen].includes(CurrentUserUtils.SelectedTool)) this._marqueeing = [e.clientX, e.clientY];
     }
     @action
     finishMarquee = () => {
diff --git a/src/client/views/nodes/VideoBox.tsx b/src/client/views/nodes/VideoBox.tsx
index 263fd5a19..fc08a2302 100644
--- a/src/client/views/nodes/VideoBox.tsx
+++ b/src/client/views/nodes/VideoBox.tsx
@@ -543,7 +543,7 @@ export class VideoBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
     }
 
     marqueeDown = action((e: React.PointerEvent) => {
-        if (!e.altKey && e.button === 0 && this.layoutDoc._viewScale === 1 && this.isContentActive(true)) this._marqueeing = [e.clientX, e.clientY];
+        if (!e.altKey && e.button === 0 && this.layoutDoc._viewScale === 1 && this.isContentActive(true) && ![InkTool.Highlighter, InkTool.Pen].includes(CurrentUserUtils.SelectedTool)) this._marqueeing = [e.clientX, e.clientY];
     });
 
     finishMarquee = action(() => {
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index cb7e58559..bd9e03856 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -395,7 +395,7 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
 
     @action
     onMarqueeDown = (e: React.PointerEvent) => {
-        if (!e.altKey && e.button === 0 && this.isContentActive(true)) {
+        if (!e.altKey && e.button === 0 && this.isContentActive(true) && ![InkTool.Highlighter, InkTool.Pen].includes(CurrentUserUtils.SelectedTool)) {
             this._marqueeing = [e.clientX, e.clientY];
             this.props.select(false);
         }
diff --git a/src/client/views/nodes/formattedText/RichTextMenu.tsx b/src/client/views/nodes/formattedText/RichTextMenu.tsx
index 071491463..59b2d3753 100644
--- a/src/client/views/nodes/formattedText/RichTextMenu.tsx
+++ b/src/client/views/nodes/formattedText/RichTextMenu.tsx
@@ -352,7 +352,7 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
         function onClick(e: React.PointerEvent) {
             e.preventDefault();
             e.stopPropagation();
-            self.TextView.endUndoTypingBatch();
+            self.TextView?.endUndoTypingBatch();
             UndoManager.RunInBatch(() => {
                 self.view && command && command(self.view.state, self.view.dispatch, self.view);
                 self.view && onclick && onclick(self.view.state, self.view.dispatch, self.view);
diff --git a/src/pen-gestures/GestureUtils.ts b/src/pen-gestures/GestureUtils.ts
index e7cc89697..65f2bf80c 100644
--- a/src/pen-gestures/GestureUtils.ts
+++ b/src/pen-gestures/GestureUtils.ts
@@ -20,9 +20,7 @@ export namespace GestureUtils {
     ): GestureEventDisposer {
         const handler = (e: Event) => func(e, (e as CustomEvent<GestureEvent>).detail);
         element.addEventListener("dashOnGesture", handler);
-        return () => {
-            element.removeEventListener("dashOnGesture", handler);
-        };
+        return () => element.removeEventListener("dashOnGesture", handler);
     }
 
     export enum Gestures {
-- 
cgit v1.2.3-70-g09d2


From 383e98b01fbee9383f1bc738a87d4ebeab1dea0b Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 17 Jun 2021 19:42:28 -0400
Subject: from last

---
 src/client/views/pdf/PDFViewer.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx
index 85cf5abd7..3c6cad42f 100644
--- a/src/client/views/pdf/PDFViewer.tsx
+++ b/src/client/views/pdf/PDFViewer.tsx
@@ -372,7 +372,7 @@ export class PDFViewer extends React.Component<IViewerProps> {
         if ((e.button !== 0 || e.altKey) && this.props.isContentActive(true)) {
             this._setPreviewCursor?.(e.clientX, e.clientY, true);
         }
-        if (!e.altKey && e.button === 0 && this.props.isContentActive(true)) {
+        if (!e.altKey && e.button === 0 && this.props.isContentActive(true) && ![InkTool.Highlighter, InkTool.Pen].includes(CurrentUserUtils.SelectedTool)) {
             this.props.select(false);
             this._marqueeing = [e.clientX, e.clientY];
             if (e.target && ((e.target as any).className.includes("endOfContent") || ((e.target as any).parentElement.className !== "textLayer"))) {
-- 
cgit v1.2.3-70-g09d2


From 0c6269f2eda7a090ebd7d10298d55b7bc832297b Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Sat, 19 Jun 2021 19:41:12 -0400
Subject: trying to solve sidebar issues

---
 src/client/views/DocComponent.tsx | 1 -
 src/client/views/MainView.tsx     | 6 +++---
 src/fields/util.ts                | 4 ++--
 3 files changed, 5 insertions(+), 6 deletions(-)

(limited to 'src')

diff --git a/src/client/views/DocComponent.tsx b/src/client/views/DocComponent.tsx
index f1042de0f..2baf9fbda 100644
--- a/src/client/views/DocComponent.tsx
+++ b/src/client/views/DocComponent.tsx
@@ -205,7 +205,6 @@ export function ViewBoxAnnotatableComponent<P extends ViewBoxAnnotatableProps, T
 
                     if (effectiveAcl === AclAddonly) {
                         added.map(doc => {
-
                             if ([AclAdmin, AclEdit].includes(GetEffectiveAcl(doc))) inheritParentAcls(CurrentUserUtils.ActiveDashboard, doc);
                             doc.context = this.props.Document;
                             if (annotationKey ?? this._annotationKey) Doc.GetProto(doc).annotationOn = this.props.Document;
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index 4eeb1fc95..9d7999672 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -103,7 +103,7 @@ export class MainView extends React.Component {
         }
         new InkStrokeProperties();
         this._sidebarContent.proto = undefined;
-        DocServer.setPlaygroundFields(["x", "y", "dataTransition", "_autoHeight", "_showSidebar", "_sidebarWidthPercent", "_width", "_height", "_viewTransition", "_panX", "_panY", "_viewScale", "_scrollTop", "hidden", "_curPage", "_viewType", "_chromeHidden"]); // can play with these fields on someone else's
+        DocServer.setPlaygroundFields(["x", "y", "dataTransition", "_autoHeight", "_showSidebar", "showSidebar", "_sidebarWidthPercent", "_width", "_height", "width", "height", "_viewTransition", "_panX", "_panY", "_viewScale", "_scrollTop", "hidden", "_curPage", "_viewType", "_chromeHidden", "nativeWidth", "_nativeWidth"]); // can play with these fields on someone else's
 
         DocServer.GetRefField("rtfProto").then(proto => (proto instanceof Doc) && reaction(() => StrCast(proto.BROADCAST_MESSAGE), msg => msg && alert(msg)));
 
@@ -180,8 +180,8 @@ export class MainView extends React.Component {
             const targClass = targets[0].className.toString();
             if (SearchBox.Instance._searchbarOpen || SearchBox.Instance.open) {
                 const check = targets.some((thing) =>
-                    (thing.className === "collectionSchemaView-searchContainer" || (thing as any)?.dataset.icon === "filter" ||
-                        thing.className === "collectionSchema-header-menuOptions"));
+                (thing.className === "collectionSchemaView-searchContainer" || (thing as any)?.dataset.icon === "filter" ||
+                    thing.className === "collectionSchema-header-menuOptions"));
                 !check && SearchBox.Instance.resetSearch(true);
             }
             !targClass.includes("contextMenu") && ContextMenu.Instance.closeMenu();
diff --git a/src/fields/util.ts b/src/fields/util.ts
index f0cc20d74..526e5af72 100644
--- a/src/fields/util.ts
+++ b/src/fields/util.ts
@@ -249,8 +249,8 @@ export function distributeAcls(key: string, acl: SharingPermissions, target: Doc
         layoutDocChanged = true;
 
         if (isDashboard) {
-            DocListCast(target[Doc.LayoutFieldKey(target)]).forEach(d => {
-                distributeAcls(key, acl, d, inheritingFromCollection, visited);
+            DocListCastAsync(target[Doc.LayoutFieldKey(target)]).then(docs => {
+                docs?.forEach(d => distributeAcls(key, acl, d, inheritingFromCollection, visited));
             });
         }
     }
-- 
cgit v1.2.3-70-g09d2


From db2864dfbe85f411e0a098447a7684e104a093ed Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Mon, 21 Jun 2021 13:48:23 -0400
Subject: null tests

---
 src/client/views/nodes/ScreenshotBox.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/ScreenshotBox.tsx b/src/client/views/nodes/ScreenshotBox.tsx
index 252c029e4..700f8a7d3 100644
--- a/src/client/views/nodes/ScreenshotBox.tsx
+++ b/src/client/views/nodes/ScreenshotBox.tsx
@@ -252,8 +252,8 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
             this.dataDoc.mediaState = "recording";
             DocUtils.ActiveRecordings.push(this);
         } else {
-            this._audioRec.stop();
-            this._videoRec.stop();
+            this._audioRec?.stop();
+            this._videoRec?.stop();
             this.dataDoc.mediaState = "paused";
             const ind = DocUtils.ActiveRecordings.indexOf(this);
             ind !== -1 && (DocUtils.ActiveRecordings.splice(ind, 1));
-- 
cgit v1.2.3-70-g09d2


From 3dcf29b8c96eb93eda5c0d75475a36821036130e Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Mon, 21 Jun 2021 15:00:06 -0400
Subject: allow playground fields to be updated by clients that have edit
 permissions

---
 src/fields/Doc.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/fields/Doc.ts b/src/fields/Doc.ts
index de4c1e5f9..c9a5ee1bc 100644
--- a/src/fields/Doc.ts
+++ b/src/fields/Doc.ts
@@ -251,7 +251,9 @@ export class Doc extends RefField {
                         DocServer.GetRefField(this[Id], true);
                     }
                 };
-                if (sameAuthor || fKey.startsWith("acl") || DocServer.getFieldWriteMode(fKey) !== DocServer.WriteMode.Playground) {
+                const effectiveAcl = GetEffectiveAcl(fKey);
+                const writeMode = DocServer.getFieldWriteMode(fKey as string);
+                if (sameAuthor || effectiveAcl === AclEdit || effectiveAcl === AclAdmin || fKey.startsWith("acl") || writeMode !== DocServer.WriteMode.Playground) {
                     delete this[CachedUpdates][fKey];
                     await fn();
                 } else {
-- 
cgit v1.2.3-70-g09d2


From 1cf3f477c3066a59158b6a26b5e3be2148e92574 Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Mon, 21 Jun 2021 16:40:04 -0400
Subject: half-functional ability to add strings without putting quotes around
 them

---
 .../views/collections/CollectionSchemaCells.tsx    | 32 ++++++++++++++++++++--
 1 file changed, 29 insertions(+), 3 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
index 2e6186680..b1dc82ce2 100644
--- a/src/client/views/collections/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/CollectionSchemaCells.tsx
@@ -236,14 +236,40 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                         Field.IsField(cfield) ? Field.toScriptString(cfield) : "";
                                 }}
                                 SetValue={action((value: string) => {
+                                    // sets what is displayed after the user makes an input
                                     let retVal = false;
                                     if (value.startsWith(":=") || value.startsWith("=:=")) {
+                                        // decides how to compute a value when given either of the above strings
                                         const script = value.substring(value.startsWith("=:=") ? 3 : 2);
                                         retVal = this.props.setComputed(script, value.startsWith(":=") ? this._rowDataDoc : this._rowDoc, this.renderFieldKey, this.props.row, this.props.col);
                                     } else {
-                                        const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
-                                        const script = CompileScript(inputscript, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                        script.compiled && (retVal = this.applyToDoc(inputscript.length !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                        const inputAsNum: number = parseInt(value);
+                                        // check if the input is a number
+                                        if (isNaN(inputAsNum)) {
+                                            // if it's not a number, it's a string, and should be processed as such
+                                            //TODO: maake the input not "thing" when it is being edited
+                                            const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
+                                            let inputAsString = '"';
+                                            // escape any quotes in the string
+                                            //TODO: remove this note to self: when the type is number, it behaves liek I want any to behave
+                                            for (const i of inputscript) {
+                                                if (i == '"') {
+                                                    inputAsString += '\\"';
+                                                } else {
+                                                    inputAsString += i;
+                                                }
+                                            }
+                                            inputAsString += '"';
+                                            //two options here: we can strip off outer quotes or we can figure out what's going on with the script
+                                            const script = CompileScript(inputAsString, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                            script.compiled && (retVal = this.applyToDoc(inputscript.length !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                        } else {
+                                            //TODO: make accept numbers
+                                            const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
+                                            const inputAsString = '"' + inputscript + '"';
+                                            const script = CompileScript(inputscript, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                            script.compiled && (retVal = this.applyToDoc(inputscript.length !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                        }
                                     }
                                     if (retVal) {
                                         this._isEditing = false; // need to set this here. otherwise, the assignment of the field will invalidate & cause render() to be called with the wrong value for 'editing'
-- 
cgit v1.2.3-70-g09d2


From 8937d756513cd918371664aad25a8a9fa41878d1 Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Mon, 21 Jun 2021 16:40:25 -0400
Subject: fixed bug pertaining to quotes

---
 src/client/views/collections/CollectionSchemaCells.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
index b1dc82ce2..045995faa 100644
--- a/src/client/views/collections/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/CollectionSchemaCells.tsx
@@ -248,7 +248,13 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                         if (isNaN(inputAsNum)) {
                                             // if it's not a number, it's a string, and should be processed as such
                                             //TODO: maake the input not "thing" when it is being edited
-                                            const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
+                                            // strips the string of quotes when it is edited to prevent quotes form being added to the text automatically 
+                                            // after each edit
+                                            let valueSansQuotes = value;
+                                            if (this._isEditing) {
+                                                valueSansQuotes = valueSansQuotes.substring(1, valueSansQuotes.length - 1);
+                                            }
+                                            const inputscript = valueSansQuotes.substring(value.startsWith("=") ? 1 : 0);
                                             let inputAsString = '"';
                                             // escape any quotes in the string
                                             //TODO: remove this note to self: when the type is number, it behaves liek I want any to behave
-- 
cgit v1.2.3-70-g09d2


From 441a3dab4ada425d28a55435be51339e3d28c892 Mon Sep 17 00:00:00 2001
From: vkalev <50213748+vkalev@users.noreply.github.com>
Date: Mon, 21 Jun 2021 17:44:19 -0500
Subject: adding comments

---
 src/client/views/InkStrokeProperties.ts | 43 +++++++++++++++++++++++++++++++++
 src/client/views/InkingStroke.tsx       | 26 +++++++++++++++++---
 src/fields/InkField.ts                  |  4 +++
 3 files changed, 70 insertions(+), 3 deletions(-)

(limited to 'src')

diff --git a/src/client/views/InkStrokeProperties.ts b/src/client/views/InkStrokeProperties.ts
index b13b04f68..533fdf006 100644
--- a/src/client/views/InkStrokeProperties.ts
+++ b/src/client/views/InkStrokeProperties.ts
@@ -17,8 +17,11 @@ export class InkStrokeProperties {
     private _lastDash = "2";
     private _inkDocs: { x: number, y: number, width: number, height: number }[] = [];
 
+    // Indicates whether the ink is locked.
     @observable _lock = false;
+    // Indicates whether the ink's format is being currently edited (displaying of control points).
     @observable _controlBtn = false;
+    // Stores the index of the current selected control point of the ink instance.
     @observable _currPoint = -1;
 
     getField(key: string) {
@@ -80,6 +83,14 @@ export class InkStrokeProperties {
         InkStrokeProperties.Instance = this;
     }
 
+    /**
+     * Adds a new control point to the ink instance when editing its format.
+     * @param x The x-coordinate of the current new point.
+     * @param y The y-coordinate of the current new point.
+     * @param pts The list containing all of the points to be added in PointData form.
+     * @param index The index of the current new point.
+     * @param control The list of all control points of the ink.
+     */
     @undoBatch
     @action
     addPoints = (x: number, y: number, pts: { X: number, Y: number }[], index: number, control: { X: number, Y: number }[]) => {
@@ -115,6 +126,12 @@ export class InkStrokeProperties {
         }));
     }
 
+    /**
+     * Helper function that enables other functions to be applied to a particular ink instance.
+     * @param func The inputted function.
+     * @param requireCurrPoint Indicates whether the current selected point is needed.
+     * @returns The applied function.
+     */
     applyFunction = (func: (doc: Doc, ink: InkData, ptsXscale: number, ptsYscale: number) => { X: number, Y: number }[] | undefined, requireCurrPoint: boolean = false) => {
         var appliedFunc = false;
         this.selectedInk?.forEach(action(inkView => {
@@ -145,6 +162,10 @@ export class InkStrokeProperties {
         return appliedFunc;
     }
 
+    /**
+     * Deletes the points of the current ink instance.
+     * @returns The changed x- and y-coordinates of the control points.
+     */
     @undoBatch
     @action
     deletePoints = () => this.applyFunction((doc: Doc, ink: InkData) => {
@@ -168,6 +189,11 @@ export class InkStrokeProperties {
         return newPoints;
     }, true);
 
+    /**
+     * Rotates the points of the current ink instance by a certain angle degree.
+     * @param angle The angle at which to rotate the ink (all of its x- and y-coordinates).
+     * @returns The changed x- and y-coordinates of the control points.
+     */
     @undoBatch
     @action
     rotate = (angle: number) => {
@@ -186,6 +212,13 @@ export class InkStrokeProperties {
         });
     }
 
+    /**
+     * Handles the movement / scaling of control points of an ink instance.
+     * @param xDiff The movement of the control point's x-coordinate.
+     * @param yDiff The movement of the control point's y-coordinate.
+     * @param controlNum The index of the current control point selected.
+     * @returns The changed x- and y-coordinates of the control points.
+     */
     @undoBatch
     @action
     control = (xDiff: number, yDiff: number, controlNum: number) =>
@@ -209,6 +242,11 @@ export class InkStrokeProperties {
             return newPoints;
         });
 
+    /**
+     * Changes the color of the border of the ink instance.
+     * @param color The new hex value to change the border to.
+     * @returns true.
+     */
     @undoBatch
     @action
     switchStk = (color: ColorState) => {
@@ -217,6 +255,11 @@ export class InkStrokeProperties {
         return true;
     }
 
+    /**
+     * Changes the color of the fill of the ink instance.
+     * @param color The new hex value to change the fill to.
+     * @returns true.
+     */
     @undoBatch
     @action
     switchFil = (color: ColorState) => {
diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx
index 449019ca8..859e53b97 100644
--- a/src/client/views/InkingStroke.tsx
+++ b/src/client/views/InkingStroke.tsx
@@ -41,6 +41,11 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         inkDoc._stayInCollection = inkDoc.isInkMask ? true : undefined;
     });
 
+    /**
+     * Handles the movement of a selected control point when the user clicks and drags.
+     * @param e React Pointer Event.
+     * @param controlNum The number of the currently selected control point.
+     */
     @action
     onControlDown = (e: React.PointerEvent, controlNum: number): void => {
         if (InkStrokeProperties.Instance) {
@@ -56,6 +61,10 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         }
     }
 
+    /**
+     * Changes the current selected control point.
+     * @param i The number of the point to be selected.
+     */
     @action
     changeCurrPoint = (i: number) => {
         if (InkStrokeProperties.Instance) {
@@ -64,6 +73,10 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         }
     }
 
+    /**
+     * Deletes the currently selected points.
+     * @param e Keyboard Event.
+     */
     @action
     delPts = (e: KeyboardEvent) => {
         if (["-", "Backspace", "Delete"].includes(e.key)) {
@@ -71,6 +84,10 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         }
     }
 
+    /**
+     * Handles the movement of the entire ink object when the user clicks and drags.
+     * @param e React Pointer Event.
+     */
     onPointerDown = (e: React.PointerEvent) => {
         if (this.props.isSelected(true)) {
             setupMoveUpEvents(this, e, returnFalse, emptyFunction, action((e: PointerEvent, doubleTap: boolean | undefined) =>
@@ -102,17 +119,18 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         const scaleY = height === strokeWidth ? 1 : (this.props.PanelHeight() - strokeWidth) / (height - strokeWidth);
         const strokeColor = StrCast(this.layoutDoc.color, "");
 
+        // Visually renders the polygonal line made by the user.
         const points = InteractionUtils.CreatePolyline(data, left, top, strokeColor, strokeWidth, strokeWidth,
             StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
             StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
             StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5 && lineBot - lineTop > 1 && lineRgt - lineLft > 1, false);
 
+        // Invisible polygonal line that enables the ink to be selected by the user.
         const hpoints = InteractionUtils.CreatePolyline(data, left, top,
             this.props.isSelected() && strokeWidth > 5 ? strokeColor : "transparent", strokeWidth, (strokeWidth + 15),
             StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
             "none", "none", undefined, scaleX, scaleY, "", this.props.layerProvider?.(this.props.Document) === false ? "none" : "visiblepainted", false, true);
 
-        //points for adding
         const apoints = InteractionUtils.CreatePoints(data, left, top, strokeColor, strokeWidth, strokeWidth,
             StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
             StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
@@ -153,24 +171,27 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         // }
         const dotsize = Math.max(width * scaleX, height * scaleY) / 40;
 
+        // Additional points (controls) added by the user via click when editing the ink's format.
         const addpoints = apoints.map((pts, i) =>
             <svg height="10" width="10" key={`add${i}`}>
                 <circle cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} r={strokeWidth / 2} stroke="invisible" strokeWidth={dotsize / 2} fill="invisible"
                     onPointerDown={(e) => { formatInstance.addPoints(pts.X, pts.Y, apoints, i, controlPoints); }} pointerEvents="all" cursor="all-scroll"
                 />
             </svg>);
+        // Green circles that allow the user to edit the curvature of the line using the selected point as the anchor.
         const handles = handlePoints.map((pts, i) =>
             <svg height="10" width="10" key={`hdl${i}`}>
                 <circle cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} r={strokeWidth} strokeWidth={0} fill="green"
                     onPointerDown={(e) => this.onControlDown(e, pts.I)} pointerEvents="all" cursor="default" display={(pts.dot1 === formatInstance._currPoint || pts.dot2 === formatInstance._currPoint) ? "inherit" : "none"} />
             </svg>);
-
+        // Points (red circles) of the ink that are made visible to user when editing its format.
         const controls = controlPoints.map((pts, i) =>
             <svg height="10" width="10" key={`ctrl${i}`}>
                 <circle cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} r={strokeWidth / 2} strokeWidth={0} fill="red"
                     onPointerDown={(e) => { this.changeCurrPoint(pts.I); this.onControlDown(e, pts.I); }} pointerEvents="all" cursor="default"
                 />
             </svg>);
+        // Set of two green lines (each with a handle at the end) that are rendered perpendicular to the current selected point while editing.
         const handleLines = handleLine.map((pts, i) =>
             <svg height="100" width="100" key={`line${i}`}  >
                 <line x1={(pts.X1 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} y1={(pts.Y1 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
@@ -181,7 +202,6 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
                     display={(pts.dot1 === formatInstance._currPoint || pts.dot2 === formatInstance._currPoint) ? "inherit" : "none"} />
             </svg>);
 
-
         return (
             <svg className="inkingStroke"
                 style={{
diff --git a/src/fields/InkField.ts b/src/fields/InkField.ts
index dbe51b24a..b79a03146 100644
--- a/src/fields/InkField.ts
+++ b/src/fields/InkField.ts
@@ -4,6 +4,7 @@ import { ObjectField } from "./ObjectField";
 import { Copy, ToScriptString, ToString, Update } from "./FieldSymbols";
 import { Scripting } from "../client/util/Scripting";
 
+// Helps keep track of the current ink tool in use.
 export enum InkTool {
     None = "none",
     Pen = "pen",
@@ -12,11 +13,13 @@ export enum InkTool {
     Stamp = "stamp"
 }
 
+// Defines a point in an ink as a pair of x- and y-coordinates.
 export interface PointData {
     X: number;
     Y: number;
 }
 
+// Defines an ink as an array of points.
 export type InkData = Array<PointData>;
 
 const pointSchema = createSimpleSchema({
@@ -28,6 +31,7 @@ const strokeDataSchema = createSimpleSchema({
     "*": true
 });
 
+// Holistic class representing the store of an ink.
 @Deserializable("ink")
 export class InkField extends ObjectField {
     @serializable(list(object(strokeDataSchema)))
-- 
cgit v1.2.3-70-g09d2


From 7c7c1634a5ec37ec885bd8201c0350627b411b75 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Tue, 22 Jun 2021 12:15:05 -0400
Subject: changed playground fields to never update...

---
 src/fields/Doc.ts | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/fields/Doc.ts b/src/fields/Doc.ts
index c9a5ee1bc..f5825fa66 100644
--- a/src/fields/Doc.ts
+++ b/src/fields/Doc.ts
@@ -251,9 +251,8 @@ export class Doc extends RefField {
                         DocServer.GetRefField(this[Id], true);
                     }
                 };
-                const effectiveAcl = GetEffectiveAcl(fKey);
                 const writeMode = DocServer.getFieldWriteMode(fKey as string);
-                if (sameAuthor || effectiveAcl === AclEdit || effectiveAcl === AclAdmin || fKey.startsWith("acl") || writeMode !== DocServer.WriteMode.Playground) {
+                if (fKey.startsWith("acl") || writeMode !== DocServer.WriteMode.Playground) {
                     delete this[CachedUpdates][fKey];
                     await fn();
                 } else {
-- 
cgit v1.2.3-70-g09d2


From 676b8fc85b5a12929457ff352d0e0e759f8b40ed Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Tue, 22 Jun 2021 13:39:34 -0400
Subject: added "live" flag to url parsing to override playground fields.

---
 src/client/views/Main.tsx     |  1 +
 src/client/views/MainView.tsx | 10 ++++++----
 2 files changed, 7 insertions(+), 4 deletions(-)

(limited to 'src')

diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx
index 60327f1bf..7553c8118 100644
--- a/src/client/views/Main.tsx
+++ b/src/client/views/Main.tsx
@@ -12,6 +12,7 @@ import { LinkManager } from "../util/LinkManager";
 AssignAllExtensions();
 
 (async () => {
+    MainView.Live = window.location.search.includes("live");
     window.location.search.includes("safe") && CollectionView.SetSafeMode(true);
     const info = await CurrentUserUtils.loadCurrentUser();
     if (info.id !== "__guest__") {
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index 9d7999672..a064f7fe8 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -68,6 +68,7 @@ const _global = (window /* browser */ || global /* node */) as any;
 @observer
 export class MainView extends React.Component {
     public static Instance: MainView;
+    public static Live: boolean = false;
     private _docBtnRef = React.createRef<HTMLDivElement>();
     @observable public LastButton: Opt<Doc>;
     @observable private _windowWidth: number = 0;
@@ -103,8 +104,9 @@ export class MainView extends React.Component {
         }
         new InkStrokeProperties();
         this._sidebarContent.proto = undefined;
-        DocServer.setPlaygroundFields(["x", "y", "dataTransition", "_autoHeight", "_showSidebar", "showSidebar", "_sidebarWidthPercent", "_width", "_height", "width", "height", "_viewTransition", "_panX", "_panY", "_viewScale", "_scrollTop", "hidden", "_curPage", "_viewType", "_chromeHidden", "nativeWidth", "_nativeWidth"]); // can play with these fields on someone else's
-
+        if (!MainView.Live) {
+            DocServer.setPlaygroundFields(["x", "y", "dataTransition", "_autoHeight", "_showSidebar", "showSidebar", "_sidebarWidthPercent", "_width", "_height", "width", "height", "_viewTransition", "_panX", "_panY", "_viewScale", "_scrollTop", "hidden", "_curPage", "_viewType", "_chromeHidden", "nativeWidth", "_nativeWidth"]); // can play with these fields on someone else's
+        }
         DocServer.GetRefField("rtfProto").then(proto => (proto instanceof Doc) && reaction(() => StrCast(proto.BROADCAST_MESSAGE), msg => msg && alert(msg)));
 
         const tag = document.createElement('script');
@@ -180,8 +182,8 @@ export class MainView extends React.Component {
             const targClass = targets[0].className.toString();
             if (SearchBox.Instance._searchbarOpen || SearchBox.Instance.open) {
                 const check = targets.some((thing) =>
-                (thing.className === "collectionSchemaView-searchContainer" || (thing as any)?.dataset.icon === "filter" ||
-                    thing.className === "collectionSchema-header-menuOptions"));
+                    (thing.className === "collectionSchemaView-searchContainer" || (thing as any)?.dataset.icon === "filter" ||
+                        thing.className === "collectionSchema-header-menuOptions"));
                 !check && SearchBox.Instance.resetSearch(true);
             }
             !targClass.includes("contextMenu") && ContextMenu.Instance.closeMenu();
-- 
cgit v1.2.3-70-g09d2


From 886439bdb812b54a756587be2a2f12e8ced67159 Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Thu, 24 Jun 2021 18:22:06 -0400
Subject: pre-initialised annos list to prevent addonly privilege issues + some
 cleanup

---
 src/client/views/SidebarAnnos.tsx | 29 +++++++++++++++++------------
 1 file changed, 17 insertions(+), 12 deletions(-)

(limited to 'src')

diff --git a/src/client/views/SidebarAnnos.tsx b/src/client/views/SidebarAnnos.tsx
index 59ff1c340..dcdc4f776 100644
--- a/src/client/views/SidebarAnnos.tsx
+++ b/src/client/views/SidebarAnnos.tsx
@@ -31,18 +31,22 @@ interface ExtraProps {
 }
 @observer
 export class SidebarAnnos extends React.Component<FieldViewProps & ExtraProps> {
+    constructor(props: Readonly<FieldViewProps & ExtraProps>) {
+        super(props);
+        this.props.dataDoc[this.sidebarKey] = new List<Doc>();
+    }
     _stackRef = React.createRef<CollectionStackingView>();
     @computed get allHashtags() {
         const keys = new Set<string>();
-        DocListCast(this.props.rootDoc[this.sidebarKey()]).forEach(doc => SearchBox.documentKeys(doc).forEach(key => keys.add(key)));
+        DocListCast(this.props.rootDoc[this.sidebarKey]).forEach(doc => SearchBox.documentKeys(doc).forEach(key => keys.add(key)));
         return Array.from(keys.keys()).filter(key => key[0]).filter(key => !key.startsWith("_") && (key[0] === "#" || key[0] === key[0].toUpperCase())).sort();
     }
     @computed get allUsers() {
         const keys = new Set<string>();
-        DocListCast(this.props.rootDoc[this.sidebarKey()]).forEach(doc => keys.add(StrCast(doc.author)));
+        DocListCast(this.props.rootDoc[this.sidebarKey]).forEach(doc => keys.add(StrCast(doc.author)));
         return Array.from(keys.keys()).sort();
     }
-    get filtersKey() { return "_" + this.sidebarKey() + "-docFilters"; }
+    get filtersKey() { return "_" + this.sidebarKey + "-docFilters"; }
 
     anchorMenuClick = (anchor: Doc) => {
         const startup = StrListCast(this.props.rootDoc.docFilters).map(filter => filter.split(":")[0]).join(" ");
@@ -59,7 +63,7 @@ export class SidebarAnnos extends React.Component<FieldViewProps & ExtraProps> {
         this._stackRef.current?.focusDocument(target);
     }
     makeDocUnfiltered = (doc: Doc) => {
-        if (DocListCast(this.props.rootDoc[this.sidebarKey()]).includes(doc)) {
+        if (DocListCast(this.props.rootDoc[this.sidebarKey]).includes(doc)) {
             if (this.props.layoutDoc[this.filtersKey]) {
                 this.props.layoutDoc[this.filtersKey] = new List<string>();
                 return true;
@@ -67,14 +71,15 @@ export class SidebarAnnos extends React.Component<FieldViewProps & ExtraProps> {
         }
         return false;
     }
-    sidebarKey = () => this.props.fieldKey + "-sidebar";
+
+    get sidebarKey() { return this.props.fieldKey + "-sidebar"; }
     filtersHeight = () => 38;
     screenToLocalTransform = () => this.props.ScreenToLocalTransform().translate(Doc.NativeWidth(this.props.dataDoc), 0).scale(this.props.scaling?.() || 1);
     panelWidth = () => !this.props.layoutDoc._showSidebar ? 0 : this.props.layoutDoc.type === DocumentType.RTF ? this.props.PanelWidth() : (NumCast(this.props.layoutDoc.nativeWidth) - Doc.NativeWidth(this.props.dataDoc)) * this.props.PanelWidth() / NumCast(this.props.layoutDoc.nativeWidth);
     panelHeight = () => this.props.PanelHeight() - this.filtersHeight();
-    addDocument = (doc: Doc | Doc[]) => this.props.sidebarAddDocument(doc, this.sidebarKey());
-    moveDocument = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (doc: Doc | Doc[]) => boolean) => this.props.moveDocument(doc, targetCollection, addDocument, this.sidebarKey());
-    removeDocument = (doc: Doc | Doc[]) => this.props.removeDocument(doc, this.sidebarKey());
+    addDocument = (doc: Doc | Doc[]) => this.props.sidebarAddDocument(doc, this.sidebarKey);
+    moveDocument = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (doc: Doc | Doc[]) => boolean) => this.props.moveDocument(doc, targetCollection, addDocument, this.sidebarKey);
+    removeDocument = (doc: Doc | Doc[]) => this.props.removeDocument(doc, this.sidebarKey);
     docFilters = () => [...StrListCast(this.props.layoutDoc._docFilters), ...StrListCast(this.props.layoutDoc[this.filtersKey])];
 
     sidebarStyleProvider = (doc: Opt<Doc>, props: Opt<FieldViewProps | DocumentViewProps>, property: string) => {
@@ -85,14 +90,14 @@ export class SidebarAnnos extends React.Component<FieldViewProps & ExtraProps> {
         const renderTag = (tag: string) => {
             const active = StrListCast(this.props.rootDoc[this.filtersKey]).includes(`${tag}:${tag}:check`);
             return <div key={tag} className={`sidebarAnnos-filterTag${active ? "-active" : ""}`}
-                onClick={e => Doc.setDocFilter(this.props.rootDoc, tag, tag, "check", true, this.sidebarKey(), e.shiftKey)}>
+                onClick={e => Doc.setDocFilter(this.props.rootDoc, tag, tag, "check", true, this.sidebarKey, e.shiftKey)}>
                 {tag}
             </div>;
         };
         const renderUsers = (user: string) => {
             const active = StrListCast(this.props.rootDoc[this.filtersKey]).includes(`author:${user}:check`);
             return <div key={user} className={`sidebarAnnos-filterUser${active ? "-active" : ""}`}
-                onClick={e => Doc.setDocFilter(this.props.rootDoc, "author", user, "check", true, this.sidebarKey(), e.shiftKey)}>
+                onClick={e => Doc.setDocFilter(this.props.rootDoc, "author", user, "check", true, this.sidebarKey, e.shiftKey)}>
                 {user}
             </div>;
         };
@@ -116,7 +121,7 @@ export class SidebarAnnos extends React.Component<FieldViewProps & ExtraProps> {
                         PanelWidth={this.panelWidth}
                         styleProvider={this.sidebarStyleProvider}
                         docFilters={this.docFilters}
-                        scaleField={this.sidebarKey() + "-scale"}
+                        scaleField={this.sidebarKey + "-scale"}
                         isAnnotationOverlay={false}
                         select={emptyFunction}
                         scaling={returnOne}
@@ -129,7 +134,7 @@ export class SidebarAnnos extends React.Component<FieldViewProps & ExtraProps> {
                         ScreenToLocalTransform={this.screenToLocalTransform}
                         renderDepth={this.props.renderDepth + 1}
                         viewType={CollectionViewType.Stacking}
-                        fieldKey={this.sidebarKey()}
+                        fieldKey={this.sidebarKey}
                         pointerEvents={"all"}
                     />
                 </div>
-- 
cgit v1.2.3-70-g09d2


From 2ac055ce068c2380a76c03d962b1e8b218c213de Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Thu, 24 Jun 2021 18:22:25 -0400
Subject: more cleanup

---
 src/client/util/GroupMemberView.tsx | 1 -
 src/client/views/DocComponent.tsx   | 7 -------
 2 files changed, 8 deletions(-)

(limited to 'src')

diff --git a/src/client/util/GroupMemberView.tsx b/src/client/util/GroupMemberView.tsx
index 927200ed3..b7f89794d 100644
--- a/src/client/util/GroupMemberView.tsx
+++ b/src/client/util/GroupMemberView.tsx
@@ -50,7 +50,6 @@ export class GroupMemberView extends React.Component<GroupMemberViewProps> {
                                     onChange={selectedOption => GroupManager.Instance.addMemberToGroup(this.props.group, (selectedOption as UserOptions).value)}
                                     placeholder={"Add members"}
                                     value={null}
-                                    closeMenuOnSelect={true}
                                     styles={{
                                         dropdownIndicator: (base, state) => ({
                                             ...base,
diff --git a/src/client/views/DocComponent.tsx b/src/client/views/DocComponent.tsx
index 2baf9fbda..fc2a968fe 100644
--- a/src/client/views/DocComponent.tsx
+++ b/src/client/views/DocComponent.tsx
@@ -107,13 +107,6 @@ export function ViewBoxAnnotatableComponent<P extends ViewBoxAnnotatableProps, T
         // key where data is stored
         @computed get fieldKey() { return this.props.fieldKey; }
 
-        private AclMap = new Map<symbol, string>([
-            [AclPrivate, SharingPermissions.None],
-            [AclReadonly, SharingPermissions.View],
-            [AclAddonly, SharingPermissions.Add],
-            [AclEdit, SharingPermissions.Edit],
-            [AclAdmin, SharingPermissions.Admin]
-        ]);
 
         lookupField = (field: string) => ScriptCast((this.layoutDoc as any).lookupField)?.script.run({ self: this.layoutDoc, data: this.rootDoc, field: field }).result;
 
-- 
cgit v1.2.3-70-g09d2


From 40f52d119be06b60515e5058607633409f847e4f Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Sat, 26 Jun 2021 17:15:59 -0400
Subject: numbers now recognized as numbers, other misc. bugfixes, some bugs
 remaining

---
 src/client/util/Scripting.ts                       |  1 +
 .../views/collections/CollectionSchemaCells.tsx    | 39 ++++++++++++++++------
 2 files changed, 30 insertions(+), 10 deletions(-)

(limited to 'src')

diff --git a/src/client/util/Scripting.ts b/src/client/util/Scripting.ts
index c3c3083be..3fe14a2a4 100644
--- a/src/client/util/Scripting.ts
+++ b/src/client/util/Scripting.ts
@@ -268,6 +268,7 @@ function forEachNode(node: ts.Node, onEnter: Traverser, onExit?: Traverser, inde
 
 export function CompileScript(script: string, options: ScriptOptions = {}): CompileResult {
     const { requiredType = "", addReturn = false, params = {}, capturedVariables = {}, typecheck = true } = options;
+    console.log("options: " + options.requiredType, options.addReturn, options.params);
     if (options.params && !options.params.this) options.params.this = Doc.name;
     if (options.params && !options.params.self) options.params.self = Doc.name;
     if (options.globals) {
diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
index 045995faa..38b3b1628 100644
--- a/src/client/views/collections/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/CollectionSchemaCells.tsx
@@ -243,37 +243,56 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                         const script = value.substring(value.startsWith("=:=") ? 3 : 2);
                                         retVal = this.props.setComputed(script, value.startsWith(":=") ? this._rowDataDoc : this._rowDoc, this.renderFieldKey, this.props.row, this.props.col);
                                     } else {
-                                        const inputAsNum: number = parseInt(value);
                                         // check if the input is a number
-                                        if (isNaN(inputAsNum)) {
+                                        let inputIsNum = true;
+                                        for (let s of value) {
+                                            if (isNaN(parseInt(s))) {
+                                                inputIsNum = false;
+                                            }
+                                            console.log(inputIsNum);
+                                        }
+                                        console.log("value: " + value);
+                                        if (!inputIsNum && !value.startsWith("=")) {
+                                            console.log("I don't beep because I'm not a computer.");
                                             // if it's not a number, it's a string, and should be processed as such
-                                            //TODO: maake the input not "thing" when it is being edited
                                             // strips the string of quotes when it is edited to prevent quotes form being added to the text automatically 
                                             // after each edit
                                             let valueSansQuotes = value;
                                             if (this._isEditing) {
-                                                valueSansQuotes = valueSansQuotes.substring(1, valueSansQuotes.length - 1);
+                                                const vsqLength = valueSansQuotes.length;
+                                                // get rid of outer quotes
+                                                valueSansQuotes = valueSansQuotes.substring(value.startsWith("\"") ? 1 : 0,
+                                                    valueSansQuotes.charAt(vsqLength - 1) == "\"" ? vsqLength - 1 : vsqLength);
                                             }
-                                            const inputscript = valueSansQuotes.substring(value.startsWith("=") ? 1 : 0);
                                             let inputAsString = '"';
                                             // escape any quotes in the string
-                                            //TODO: remove this note to self: when the type is number, it behaves liek I want any to behave
-                                            for (const i of inputscript) {
+                                            //TODO: remove this note to self: when the type is number, it behaves like I want any to behave
+                                            //TODO: fix type laziness
+                                            for (const i of valueSansQuotes) {
                                                 if (i == '"') {
                                                     inputAsString += '\\"';
                                                 } else {
                                                     inputAsString += i;
                                                 }
                                             }
+                                            // add a closing quote
                                             inputAsString += '"';
+                                            console.log(inputAsString);
                                             //two options here: we can strip off outer quotes or we can figure out what's going on with the script
                                             const script = CompileScript(inputAsString, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            script.compiled && (retVal = this.applyToDoc(inputscript.length !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            script.compiled && (retVal = this.applyToDoc(valueSansQuotes.length !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
                                         } else {
                                             //TODO: make accept numbers
+                                            console.log("I beep because I'm a computer");
                                             const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
-                                            const inputAsString = '"' + inputscript + '"';
-                                            const script = CompileScript(inputscript, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                            // if commas are not stripped, the parser only considers the numbers after the last comma
+                                            let inputSansCommas = "";
+                                            for (let s of inputscript) {
+                                                if (!(s == ",")) {
+                                                    inputSansCommas += s;
+                                                }
+                                            }
+                                            const script = CompileScript(inputSansCommas, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
                                             script.compiled && (retVal = this.applyToDoc(inputscript.length !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
                                         }
                                     }
-- 
cgit v1.2.3-70-g09d2


From 9d03a05ae686768a542da499b6d5e1ce4d9c20fd Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Sun, 27 Jun 2021 16:18:55 -0400
Subject: can delete dashboards

---
 src/client/util/CurrentUserUtils.ts | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 8b3597d57..9f01b165f 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -1214,8 +1214,9 @@ export class CurrentUserUtils {
         const createDashboard = ScriptField.MakeScript(`createNewDashboard()`);
         const shareDashboard = ScriptField.MakeScript(`shareDashboard(self)`);
         const addToDashboards = ScriptField.MakeScript(`addToDashboards(self)`);
-        dashboardDoc.contextMenuScripts = new List<ScriptField>([toggleTheme!, toggleComic!, snapshotDashboard!, createDashboard!, shareDashboard!, addToDashboards!]);
-        dashboardDoc.contextMenuLabels = new List<string>(["Toggle Theme Colors", "Toggle Comic Mode", "Snapshot Dashboard", "Create Dashboard", "Share Dashboard", "Add to Dashboards"]);
+        const removeDashboard = ScriptField.MakeScript('removeDashboard(self)');
+        dashboardDoc.contextMenuScripts = new List<ScriptField>([toggleTheme!, toggleComic!, snapshotDashboard!, createDashboard!, shareDashboard!, addToDashboards!, removeDashboard!]);
+        dashboardDoc.contextMenuLabels = new List<string>(["Toggle Theme Colors", "Toggle Comic Mode", "Snapshot Dashboard", "Create Dashboard", "Share Dashboard", "Add to Dashboards", "Remove Dashboard"]);
 
         Doc.AddDocToList(dashboards, "data", dashboardDoc);
         CurrentUserUtils.openDashboard(userDoc, dashboardDoc);
@@ -1271,6 +1272,15 @@ Scripting.addGlobal(function shareDashboard(dashboard: Doc) {
     SharingManager.Instance.open(undefined, dashboard);
 },
     "opens sharing dialog for Dashboard");
+Scripting.addGlobal(async function removeDashboard(dashboard: Doc) {
+    console.log(dashboard);
+    const dashboards = await DocListCastAsync(CurrentUserUtils.MyDashboards.data);
+    if (dashboards && dashboards.length > 1) {
+        if (dashboard === CurrentUserUtils.ActiveDashboard) CurrentUserUtils.openDashboard(Doc.UserDoc(), dashboards.find(doc => doc !== dashboard)!);
+        Doc.RemoveDocFromList(CurrentUserUtils.MyDashboards, "data", dashboard);
+    }
+},
+    "Remove Dashboard from Dashboards");
 Scripting.addGlobal(async function addToDashboards(dashboard: Doc) {
     const dashboardAlias = Doc.MakeAlias(dashboard);
 
-- 
cgit v1.2.3-70-g09d2


From d6e313be26323d7e8265714665c71e2d571764ae Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Sun, 27 Jun 2021 17:20:59 -0400
Subject: whoops

---
 src/client/util/CurrentUserUtils.ts | 1 -
 1 file changed, 1 deletion(-)

(limited to 'src')

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 9f01b165f..4584d3282 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -1273,7 +1273,6 @@ Scripting.addGlobal(function shareDashboard(dashboard: Doc) {
 },
     "opens sharing dialog for Dashboard");
 Scripting.addGlobal(async function removeDashboard(dashboard: Doc) {
-    console.log(dashboard);
     const dashboards = await DocListCastAsync(CurrentUserUtils.MyDashboards.data);
     if (dashboards && dashboards.length > 1) {
         if (dashboard === CurrentUserUtils.ActiveDashboard) CurrentUserUtils.openDashboard(Doc.UserDoc(), dashboards.find(doc => doc !== dashboard)!);
-- 
cgit v1.2.3-70-g09d2


From 61f5e6edac1967480e31c6407e3505eea2a08c26 Mon Sep 17 00:00:00 2001
From: dinhanhtruong <70963346+dinhanhtruong@users.noreply.github.com>
Date: Mon, 28 Jun 2021 16:31:02 -0400
Subject: linkMenu comments

added linkMenu comments
---
 src/client/views/linking/LinkMenu.tsx     | 8 ++++++++
 src/client/views/nodes/LinkDocPreview.tsx | 4 ++--
 2 files changed, 10 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/client/views/linking/LinkMenu.tsx b/src/client/views/linking/LinkMenu.tsx
index c7888c5ee..6fc860447 100644
--- a/src/client/views/linking/LinkMenu.tsx
+++ b/src/client/views/linking/LinkMenu.tsx
@@ -15,6 +15,9 @@ interface Props {
     changeFlyout: () => void;
 }
 
+/**
+ * the outermost component for the link menu of a node that contains a list of its linked nodes
+ */
 @observer
 export class LinkMenu extends React.Component<Props> {
     private _editorRef = React.createRef<HTMLDivElement>();
@@ -36,6 +39,11 @@ export class LinkMenu extends React.Component<Props> {
         }
     }
 
+    /**
+     * maps each link to a JSX element to be rendered
+     * @param groups LinkManager containing info of all of the links
+     * @returns list of link JSX elements if there at least one linked element
+     */
     renderAllGroups = (groups: Map<string, Array<Doc>>): Array<JSX.Element> => {
         const linkItems = Array.from(groups.entries()).map(group =>
             <LinkMenuGroup
diff --git a/src/client/views/nodes/LinkDocPreview.tsx b/src/client/views/nodes/LinkDocPreview.tsx
index b73fb10df..65afbe131 100644
--- a/src/client/views/nodes/LinkDocPreview.tsx
+++ b/src/client/views/nodes/LinkDocPreview.tsx
@@ -110,11 +110,11 @@ export class LinkDocPreview extends React.Component<LinkDocPreviewProps> {
         }
     }
     width = () => {
-        if (!this._targetDoc) return 225;
+        if (!this._targetDoc) return 500;
         if (this._targetDoc[WidthSym]() < this._targetDoc?.[HeightSym]()) {
             return Math.min(225, this._targetDoc[HeightSym]()) * this._targetDoc[WidthSym]() / this._targetDoc[HeightSym]();
         }
-        return Math.min(225, NumCast(this._targetDoc?.[WidthSym](), 225));
+        return Math.min(500, NumCast(this._targetDoc?.[WidthSym](), 500));
     }
     height = () => {
         if (!this._targetDoc) return 225;
-- 
cgit v1.2.3-70-g09d2


From 501bf6a5d6c81ea1e58509e51ab8c252eaf178ca Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Mon, 28 Jun 2021 16:57:56 -0400
Subject: resolved bugs and removes console.log

---
 src/client/util/Scripting.ts                       |  1 -
 .../views/collections/CollectionSchemaCells.tsx    | 22 +++---
 .../CollectionSchemaMovableTableHOC.tsx            | 92 +++++++++++-----------
 3 files changed, 60 insertions(+), 55 deletions(-)

(limited to 'src')

diff --git a/src/client/util/Scripting.ts b/src/client/util/Scripting.ts
index 3fe14a2a4..c3c3083be 100644
--- a/src/client/util/Scripting.ts
+++ b/src/client/util/Scripting.ts
@@ -268,7 +268,6 @@ function forEachNode(node: ts.Node, onEnter: Traverser, onExit?: Traverser, inde
 
 export function CompileScript(script: string, options: ScriptOptions = {}): CompileResult {
     const { requiredType = "", addReturn = false, params = {}, capturedVariables = {}, typecheck = true } = options;
-    console.log("options: " + options.requiredType, options.addReturn, options.params);
     if (options.params && !options.params.this) options.params.this = Doc.name;
     if (options.params && !options.params.self) options.params.self = Doc.name;
     if (options.globals) {
diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
index 38b3b1628..42c5375ce 100644
--- a/src/client/views/collections/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/CollectionSchemaCells.tsx
@@ -251,9 +251,10 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                             }
                                             console.log(inputIsNum);
                                         }
-                                        console.log("value: " + value);
-                                        if (!inputIsNum && !value.startsWith("=")) {
-                                            console.log("I don't beep because I'm not a computer.");
+                                        // check if the input is a boolean
+                                        let inputIsBool: boolean = value == "false" || value == "true";
+
+                                        if (!inputIsNum && !inputIsBool && !value.startsWith("=")) {
                                             // if it's not a number, it's a string, and should be processed as such
                                             // strips the string of quotes when it is edited to prevent quotes form being added to the text automatically 
                                             // after each edit
@@ -266,8 +267,6 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                             }
                                             let inputAsString = '"';
                                             // escape any quotes in the string
-                                            //TODO: remove this note to self: when the type is number, it behaves like I want any to behave
-                                            //TODO: fix type laziness
                                             for (const i of valueSansQuotes) {
                                                 if (i == '"') {
                                                     inputAsString += '\\"';
@@ -277,13 +276,12 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                             }
                                             // add a closing quote
                                             inputAsString += '"';
-                                            console.log(inputAsString);
                                             //two options here: we can strip off outer quotes or we can figure out what's going on with the script
                                             const script = CompileScript(inputAsString, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            script.compiled && (retVal = this.applyToDoc(valueSansQuotes.length !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
-                                        } else {
+                                            script.compiled && (retVal = this.applyToDoc(inputAsString.length !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            // handle numbers and expressions
+                                        } else if (inputIsNum || value.startsWith("=")) {
                                             //TODO: make accept numbers
-                                            console.log("I beep because I'm a computer");
                                             const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
                                             // if commas are not stripped, the parser only considers the numbers after the last comma
                                             let inputSansCommas = "";
@@ -293,7 +291,11 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                                 }
                                             }
                                             const script = CompileScript(inputSansCommas, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            script.compiled && (retVal = this.applyToDoc(inputscript.length !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            script.compiled && (retVal = this.applyToDoc(inputSansCommas.length + 2 !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            // handle booleans
+                                        } else if (inputIsBool) {
+                                            const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                            script.compiled && (retVal = this.applyToDoc(value.length + 2 !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
                                         }
                                     }
                                     if (retVal) {
diff --git a/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx b/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
index 881246bd4..a842d629e 100644
--- a/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
+++ b/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
@@ -143,16 +143,20 @@ export class MovableRow extends React.Component<MovableRowProps> {
     private _header?: React.RefObject<HTMLDivElement> = React.createRef();
     private _rowDropDisposer?: DragManager.DragDropDisposer;
 
+    // Event listeners are only necessary when the user is hovering over the table
+    // Create one when the mouse starts hovering...
     onPointerEnter = (e: React.PointerEvent): void => {
         if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
             this._header!.current!.className = "collectionSchema-row-wrapper";
             document.addEventListener("pointermove", this.onDragMove, true);
         }
     }
+    // ... and delete it when the mouse leaves
     onPointerLeave = (e: React.PointerEvent): void => {
         this._header!.current!.className = "collectionSchema-row-wrapper";
         document.removeEventListener("pointermove", this.onDragMove, true);
     }
+    // The method for the event listener, reorders columns when dragged to their new locations.
     onDragMove = (e: PointerEvent): void => {
         const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
         const rect = this._header!.current!.getBoundingClientRect();
@@ -167,14 +171,14 @@ export class MovableRow extends React.Component<MovableRowProps> {
 
         this._rowDropDisposer?.();
     }
-
+    //
     createRowDropTarget = (ele: HTMLDivElement) => {
         this._rowDropDisposer?.();
         if (ele) {
             this._rowDropDisposer = DragManager.MakeDropTarget(ele, this.rowDrop.bind(this));
         }
     }
-
+    // Controls what hppens when a row is dragged and dropped
     rowDrop = (e: Event, de: DragManager.DropEvent) => {
         this.onPointerLeave(e as any);
         const rowDoc = FieldValue(Cast(this.props.rowInfo.original, Doc));
@@ -200,59 +204,59 @@ export class MovableRow extends React.Component<MovableRowProps> {
         return false;
     }
 
-    onRowContextMenu = (e: React.MouseEvent): void => {
+    onRowContextMenu = (e: React.MouseEvent): void =>
         e.preventDefault();
-        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
-        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
+    const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
+    ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
     }
 
-    @undoBatch
-    @action
-    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
-        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
-        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
-    }
+@undoBatch
+@action
+move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
+    const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
+    return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
+}
 
-    @action
-    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
-        console.log("yes");
-        if (e.key === "Backspace" || e.key === "Delete") {
-            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
-        }
+@action
+onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
+    console.log("yes");
+    if (e.key === "Backspace" || e.key === "Delete") {
+        undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
     }
+}
 
-    render() {
-        const { children = null, rowInfo } = this.props;
+render() {
+    const { children = null, rowInfo } = this.props;
 
-        if (!rowInfo) {
-            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
-        }
+    if (!rowInfo) {
+        return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
+    }
 
-        const { original } = rowInfo;
-        const doc = FieldValue(Cast(original, Doc));
+    const { original } = rowInfo;
+    const doc = FieldValue(Cast(original, Doc));
 
-        if (!doc) return (null);
+    if (!doc) return (null);
 
-        const reference = React.createRef<HTMLDivElement>();
-        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
+    const reference = React.createRef<HTMLDivElement>();
+    const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
 
-        let className = "collectionSchema-row";
-        if (this.props.rowFocused) className += " row-focused";
-        if (this.props.rowWrapped) className += " row-wrapped";
+    let className = "collectionSchema-row";
+    if (this.props.rowFocused) className += " row-focused";
+    if (this.props.rowWrapped) className += " row-wrapped";
 
-        return (
-            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
-                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
-                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
-                        <div className="row-dragger">
-                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
-                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
-                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
-                        </div>
-                        {children}
-                    </ReactTableDefaults.TrComponent>
-                </div>
+    return (
+        <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
+            <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
+                <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
+                    <div className="row-dragger">
+                        <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
+                        <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
+                        <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
+                    </div>
+                    {children}
+                </ReactTableDefaults.TrComponent>
             </div>
-        );
-    }
+        </div>
+    );
+}
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From b0efa4a390415072eaeb06c8719ea57d73e10466 Mon Sep 17 00:00:00 2001
From: vkalev <50213748+vkalev@users.noreply.github.com>
Date: Wed, 30 Jun 2021 12:52:52 -0500
Subject: ink Bézier handle movement fixed + small visual changes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/client/util/InteractionUtils.tsx    |   2 +-
 src/client/views/InkStrokeProperties.ts | 119 ++++++++++++++++++++++++--------
 src/client/views/InkingStroke.scss      |  18 ++---
 src/client/views/InkingStroke.tsx       |  93 ++++++++++++++-----------
 src/fields/InkField.ts                  |  24 +++++++
 5 files changed, 177 insertions(+), 79 deletions(-)

(limited to 'src')

diff --git a/src/client/util/InteractionUtils.tsx b/src/client/util/InteractionUtils.tsx
index 01d00db30..ba935e3bf 100644
--- a/src/client/util/InteractionUtils.tsx
+++ b/src/client/util/InteractionUtils.tsx
@@ -208,7 +208,7 @@ export namespace InteractionUtils {
             <polyline
                 points={strpts}
                 style={{
-                    filter: drawHalo ? "url(#inkSelectionHalo)" : undefined,
+                    // filter: drawHalo ? "url(#inkSelectionHalo)" : undefined,
                     fill: fill ? fill : "none",
                     opacity: strokeWidth !== width ? 0.5 : undefined,
                     pointerEvents: pevents as any,
diff --git a/src/client/views/InkStrokeProperties.ts b/src/client/views/InkStrokeProperties.ts
index 533fdf006..5c5395984 100644
--- a/src/client/views/InkStrokeProperties.ts
+++ b/src/client/views/InkStrokeProperties.ts
@@ -2,12 +2,11 @@ import { action, computed, observable } from "mobx";
 import { ColorState } from 'react-color';
 import { Doc, Field, Opt } from "../../fields/Doc";
 import { Document } from "../../fields/documentSchemas";
-import { InkField, InkData } from "../../fields/InkField";
+import { InkField, InkData, PointData } from "../../fields/InkField";
 import { Cast, NumCast } from "../../fields/Types";
 import { DocumentType } from "../documents/DocumentTypes";
 import { SelectionManager } from "../util/SelectionManager";
 import { undoBatch } from "../util/UndoManager";
-import { bool } from "sharp";
 
 export class InkStrokeProperties {
     static Instance: InkStrokeProperties | undefined;
@@ -15,15 +14,15 @@ export class InkStrokeProperties {
     private _lastFill = "#D0021B";
     private _lastLine = "#D0021B";
     private _lastDash = "2";
-    private _inkDocs: { x: number, y: number, width: number, height: number }[] = [];
 
-    // Indicates whether the ink is locked.
     @observable _lock = false;
-    // Indicates whether the ink's format is being currently edited (displaying of control points).
     @observable _controlBtn = false;
-    // Stores the index of the current selected control point of the ink instance.
     @observable _currPoint = -1;
 
+    constructor() {
+        InkStrokeProperties.Instance = this;
+    }
+
     getField(key: string) {
         return this.selectedInk?.reduce((p, i) =>
             (p === undefined || (p && p === i.rootDoc[key])) && i.rootDoc[key] !== "0" ? Field.toString(i.rootDoc[key] as Field) : "", undefined as Opt<string>);
@@ -79,10 +78,6 @@ export class InkStrokeProperties {
         });
     }
 
-    constructor() {
-        InkStrokeProperties.Instance = this;
-    }
-
     /**
      * Adds a new control point to the ink instance when editing its format.
      * @param x The x-coordinate of the current new point.
@@ -213,35 +208,99 @@ export class InkStrokeProperties {
     }
 
     /**
-     * Handles the movement / scaling of control points of an ink instance.
-     * @param xDiff The movement of the control point's x-coordinate.
-     * @param yDiff The movement of the control point's y-coordinate.
-     * @param controlNum The index of the current control point selected.
-     * @returns The changed x- and y-coordinates of the control points.
+     * Handles the movement/scaling of a control point.
      */
     @undoBatch
     @action
-    control = (xDiff: number, yDiff: number, controlNum: number) =>
-        this.applyFunction((doc: Doc, ink: InkData, ptsXscale: number, ptsYscale: number) => {
+    moveControl = (deltaX: number, deltaY: number, controlIndex: number) =>
+        this.applyFunction((doc: Doc, ink: InkData, xScale: number, yScale: number) => {
             const newPoints: { X: number, Y: number }[] = [];
-            const order = controlNum % 4;
+            const order = controlIndex % 4;
             for (var i = 0; i < ink.length; i++) {
-                newPoints.push(
-                    (controlNum === i ||
-                        (order === 0 && i === controlNum + 1) ||
-                        (order === 0 && controlNum !== 0 && i === controlNum - 2) ||
-                        (order === 0 && controlNum !== 0 && i === controlNum - 1) ||
-                        (order === 3 && i === controlNum - 1) ||
-                        (order === 3 && controlNum !== ink.length - 1 && i === controlNum + 1) ||
-                        (order === 3 && controlNum !== ink.length - 1 && i === controlNum + 2) ||
-                        ((ink[0].X === ink[ink.length - 1].X) && (ink[0].Y === ink[ink.length - 1].Y) && (i === 0 || i === ink.length - 1) && (controlNum === 0 || controlNum === ink.length - 1))
-                    ) ?
-                        { X: ink[i].X - xDiff / ptsXscale, Y: ink[i].Y - yDiff / ptsYscale } :
-                        { X: ink[i].X, Y: ink[i].Y });
+                const leftHandlePoint = order === 0 && i === controlIndex + 1;
+                const rightHandlePoint = order === 0 && controlIndex !== 0 && i === controlIndex - 2;
+                if (controlIndex === i ||
+                    leftHandlePoint ||
+                    rightHandlePoint ||
+                    (order === 0 && controlIndex !== 0 && i === controlIndex - 1) ||
+                    (order === 3 && i === controlIndex - 1) ||
+                    (order === 3 && controlIndex !== ink.length - 1 && i === controlIndex + 1) ||
+                    (order === 3 && controlIndex !== ink.length - 1 && i === controlIndex + 2) ||
+                    ((ink[0].X === ink[ink.length - 1].X) && (ink[0].Y === ink[ink.length - 1].Y) && (i === 0 || i === ink.length - 1) && (controlIndex === 0 || controlIndex === ink.length - 1))) {
+                    newPoints.push({ X: ink[i].X - deltaX / xScale, Y: ink[i].Y - deltaY / yScale });
+                } else {
+                    newPoints.push({ X: ink[i].X, Y: ink[i].Y });
+                }
             }
             return newPoints;
         });
 
+    /**
+     * Rotates the target point about the origin point for a given angle (radians).
+     */
+    @action
+    rotatePoint = (target: PointData, origin: PointData, angle: number) => {
+        target.X -= origin.X;
+        target.Y -= origin.Y;
+        const newX = Math.cos(angle) * target.X - Math.sin(angle) * target.Y;
+        const newY = Math.sin(angle) * target.X + Math.cos(angle) * target.Y;
+        target.X = newX + origin.X;
+        target.Y = newY + origin.Y;
+        return target
+    }
+
+    /**
+     * Finds the angle difference (in radians) between two vectors relative to an arbitrary origin.
+     */
+    angleChange = (a: PointData, b: PointData, origin: PointData) => {
+        // Finding vector representation of inputted points relative to new origin.
+        let vectorA = { X: a.X - origin.X, Y: a.Y - origin.Y };
+        let vectorB = { X: b.X - origin.X, Y: b.Y - origin.Y };
+        const crossProduct = vectorB.X * vectorA.Y - vectorB.Y * vectorA.X;
+        // Determining whether rotation is clockwise or counterclockwise.
+        const sign = crossProduct < 0 ? 1 : -1;
+        const magnitudeA = Math.sqrt(vectorA.X * vectorA.X + vectorA.Y * vectorA.Y);
+        const magnitudeB = Math.sqrt(vectorB.X * vectorB.X + vectorB.Y * vectorB.Y);
+        // Normalizing the vectors.
+        vectorA = { X: vectorA.X / magnitudeA, Y: vectorA.Y / magnitudeA };
+        vectorB = { X: vectorB.X / magnitudeB, Y: vectorB.Y / magnitudeB };
+        const dotProduct = vectorB.X * vectorA.X + vectorB.Y * vectorA.Y;
+        const theta = Math.acos(dotProduct);
+        return sign * theta;
+    }
+
+    /**
+     * Handles the movement/scaling of a handle point.
+     */
+    @undoBatch
+    @action
+    moveHandle = (deltaX: number, deltaY: number, handleIndex: number) =>
+        this.applyFunction((doc: Doc, ink: InkData, xScale: number, yScale: number) => {
+            const newPoints: { X: number, Y: number }[] = [];
+            const order = handleIndex % 4;
+            let newHandlePoint = { X: 0, Y: 0 };
+
+            for (var i = 0; i < ink.length; i++) {
+                if (handleIndex === i) {
+                    newHandlePoint = { X: ink[i].X - deltaX / xScale, Y: ink[i].Y - deltaY / yScale };
+                    newPoints.push({ X: newHandlePoint.X, Y: newHandlePoint.Y });
+                } else {
+                    newPoints.push({ X: ink[i].X, Y: ink[i].Y });
+                }
+            }
+
+            if (handleIndex !== 1 && handleIndex !== ink.length - 2) {
+                const oldHandlePoint = ink[handleIndex];
+                let oppositeHandlePoint = order === 1 ? ink[handleIndex - 3] : ink[handleIndex + 3];
+                const controlPoint = order === 1 ? ink[handleIndex - 1] : ink[handleIndex + 1];
+                const angle = this.angleChange(oldHandlePoint, newHandlePoint, controlPoint);
+                oppositeHandlePoint = this.rotatePoint(oppositeHandlePoint, controlPoint, angle);
+                order === 1 ? newPoints[handleIndex - 3] = oppositeHandlePoint : newPoints[handleIndex + 3] = oppositeHandlePoint;
+            }
+
+            return newPoints;
+        });
+
     /**
      * Changes the color of the border of the ink instance.
      * @param color The new hex value to change the border to.
diff --git a/src/client/views/InkingStroke.scss b/src/client/views/InkingStroke.scss
index 30ab1967e..f67b1779d 100644
--- a/src/client/views/InkingStroke.scss
+++ b/src/client/views/InkingStroke.scss
@@ -1,11 +1,11 @@
 .inkingStroke {
-    mix-blend-mode: multiply;
-    stroke-linejoin: round;
-    stroke-linecap: round;
-    overflow: visible !important;
-    transform-origin: top left;
+  mix-blend-mode: multiply;
+  stroke-linejoin: round;
+  stroke-linecap: round;
+  overflow: visible !important;
+  transform-origin: top left;
 
-    svg:not(:root) {
-        overflow: visible !important;
-    }
-}
\ No newline at end of file
+  svg:not(:root) {
+    overflow: visible !important;
+  }
+}
diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx
index 859e53b97..163eb05b0 100644
--- a/src/client/views/InkingStroke.tsx
+++ b/src/client/views/InkingStroke.tsx
@@ -2,7 +2,7 @@ import { action } from "mobx";
 import { observer } from "mobx-react";
 import { Doc } from "../../fields/Doc";
 import { documentSchema } from "../../fields/documentSchemas";
-import { InkData, InkField, InkTool } from "../../fields/InkField";
+import { InkData, InkField, InkTool, ControlPoint, HandlePoint, HandleLine } from "../../fields/InkField";
 import { makeInterface } from "../../fields/Schema";
 import { Cast, StrCast } from "../../fields/Types";
 import { TraceMobx } from "../../fields/util";
@@ -28,33 +28,51 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
 
     public static LayoutString(fieldStr: string) { return FieldView.LayoutString(InkingStroke, fieldStr); }
 
-    private analyzeStrokes = () => {
+    analyzeStrokes = () => {
         const data: InkData = Cast(this.dataDoc[this.fieldKey], InkField)?.inkData ?? [];
         CognitiveServices.Inking.Appliers.ConcatenateHandwriting(this.dataDoc, ["inkAnalysis", "handwriting"], [data]);
     }
 
-    public static toggleMask = action((inkDoc: Doc) => {
+    @action
+    public static toggleMask = (inkDoc: Doc) => {
         inkDoc.isInkMask = !inkDoc.isInkMask;
         inkDoc._backgroundColor = inkDoc.isInkMask ? "rgba(0,0,0,0.7)" : undefined;
         inkDoc.mixBlendMode = inkDoc.isInkMask ? "hard-light" : undefined;
         inkDoc.color = "#9b9b9bff";
         inkDoc._stayInCollection = inkDoc.isInkMask ? true : undefined;
-    });
+    };
 
     /**
      * Handles the movement of a selected control point when the user clicks and drags.
-     * @param e React Pointer Event.
-     * @param controlNum The number of the currently selected control point.
+     * @param controlNum The index of the currently selected control point.
      */
     @action
     onControlDown = (e: React.PointerEvent, controlNum: number): void => {
         if (InkStrokeProperties.Instance) {
-            InkStrokeProperties.Instance.control(0, 0, 1);
+            InkStrokeProperties.Instance.moveControl(0, 0, 1);
+            const controlUndo = UndoManager.StartBatch("DocDecs set radius");
+            const screenScale = this.props.ScreenToLocalTransform().Scale;
+            setupMoveUpEvents(this, e,
+                (e: PointerEvent, down: number[], delta: number[]) => {
+                    InkStrokeProperties.Instance?.moveControl(-delta[0] * screenScale, -delta[1] * screenScale, controlNum);
+                    return false;
+                },
+                () => controlUndo?.end(), emptyFunction);
+        }
+    }
+
+    /**
+     * Handles the movement of a selected handle point when the user clicks and drags.
+     * @param controlNum The index of the currently selected handle point.
+     */
+    onHandleDown = (e: React.PointerEvent, handleNum: number): void => {
+        if (InkStrokeProperties.Instance) {
+            InkStrokeProperties.Instance.moveControl(0, 0, 1);
             const controlUndo = UndoManager.StartBatch("DocDecs set radius");
             const screenScale = this.props.ScreenToLocalTransform().Scale;
             setupMoveUpEvents(this, e,
                 (e: PointerEvent, down: number[], delta: number[]) => {
-                    InkStrokeProperties.Instance?.control(-delta[0] * screenScale, -delta[1] * screenScale, controlNum);
+                    InkStrokeProperties.Instance?.moveHandle(-delta[0] * screenScale, -delta[1] * screenScale, handleNum);
                     return false;
                 },
                 () => controlUndo?.end(), emptyFunction);
@@ -69,7 +87,7 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
     changeCurrPoint = (i: number) => {
         if (InkStrokeProperties.Instance) {
             InkStrokeProperties.Instance._currPoint = i;
-            document.addEventListener("keydown", this.delPts, true);
+            document.addEventListener("keydown", this.onDelete, true);
         }
     }
 
@@ -78,7 +96,7 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
      * @param e Keyboard Event.
      */
     @action
-    delPts = (e: KeyboardEvent) => {
+    onDelete = (e: KeyboardEvent) => {
         if (["-", "Backspace", "Delete"].includes(e.key)) {
             if (InkStrokeProperties.Instance?.deletePoints()) e.stopPropagation();
         }
@@ -101,7 +119,6 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         const formatInstance = InkStrokeProperties.Instance;
         if (!formatInstance) return (null);
         const data: InkData = Cast(this.dataDoc[this.fieldKey], InkField)?.inkData ?? [];
-        // const strokeWidth = Number(StrCast(this.layoutDoc.strokeWidth, ActiveInkWidth()));
         const strokeWidth = Number(this.layoutDoc.strokeWidth);
         const xs = data.map(p => p.X);
         const ys = data.map(p => p.Y);
@@ -118,12 +135,18 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         const scaleX = width === strokeWidth ? 1 : (this.props.PanelWidth() - strokeWidth) / (width - strokeWidth);
         const scaleY = height === strokeWidth ? 1 : (this.props.PanelHeight() - strokeWidth) / (height - strokeWidth);
         const strokeColor = StrCast(this.layoutDoc.color, "");
+        const dotsize = Math.max(width * scaleX, height * scaleY) / 40;
 
         // Visually renders the polygonal line made by the user.
         const points = InteractionUtils.CreatePolyline(data, left, top, strokeColor, strokeWidth, strokeWidth,
             StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
             StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
             StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5 && lineBot - lineTop > 1 && lineRgt - lineLft > 1, false);
+        
+        const selectedLine = InteractionUtils.CreatePolyline(data, lineLft - strokeWidth * 3, lineTop - strokeWidth * 3, "#1F85DE", strokeWidth / 6, strokeWidth / 6,
+            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
+            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
+            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5 && lineBot - lineTop > 1 && lineRgt - lineLft > 1, false);
 
         // Invisible polygonal line that enables the ink to be selected by the user.
         const hpoints = InteractionUtils.CreatePolyline(data, left, top,
@@ -136,10 +159,13 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
             StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
             StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5, false);
 
-        const controlPoints: { X: number, Y: number, I: number }[] = [];
-        const handlePoints: { X: number, Y: number, I: number, dot1: number, dot2: number }[] = [];
-        const handleLine: { X1: number, Y1: number, X2: number, Y2: number, X3: number, Y3: number, dot1: number, dot2: number }[] = [];
+        const controlPoints: ControlPoint[] = [];
+        const handlePoints: HandlePoint[] = [];
+        const handleLine: HandleLine[] = [];
+        // check the purpose of this conditional
         if (data.length >= 4) {
+
+            // create separate functions for these            
             for (var i = 0; i <= data.length - 4; i += 4) {
                 controlPoints.push({ X: data[i].X, Y: data[i].Y, I: i });
                 controlPoints.push({ X: data[i + 3].X, Y: data[i + 3].Y, I: i + 3 });
@@ -147,29 +173,21 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
                 handlePoints.push({ X: data[i + 2].X, Y: data[i + 2].Y, I: i + 2, dot1: i + 3, dot2: i === data.length ? i + 3 : i + 4 });
             }
 
-            handleLine.push({ X1: data[0].X, Y1: data[0].Y, X2: data[0].X, Y2: data[0].Y, X3: data[1].X, Y3: data[1].Y, dot1: 0, dot2: 0 });
+            // first (single) handle line 
+            handleLine.push({ X1: data[0].X, Y1: data[0].Y, X2: data[1].X, Y2: data[1].Y, dot1: 0, dot2: 0 });
             for (var i = 2; i < data.length - 4; i += 4) {
 
-                handleLine.push({ X1: data[i].X, Y1: data[i].Y, X2: data[i + 1].X, Y2: data[i + 1].Y, X3: data[i + 3].X, Y3: data[i + 3].Y, dot1: i + 1, dot2: i + 2 });
+                handleLine.push({ X1: data[i].X, Y1: data[i].Y, X2: data[i + 3].X, Y2: data[i + 3].Y, dot1: i + 1, dot2: i + 2 });
 
             }
-            handleLine.push({ X1: data[data.length - 2].X, Y1: data[data.length - 2].Y, X2: data[data.length - 1].X, Y2: data[data.length - 1].Y, X3: data[data.length - 1].X, Y3: data[data.length - 1].Y, dot1: data.length - 1, dot2: data.length - 1 });
+            // last (single) handle line
+            handleLine.push({ X1: data[data.length - 2].X, Y1: data[data.length - 2].Y, X2: data[data.length - 1].X, Y2: data[data.length - 1].Y, dot1: data.length - 1, dot2: data.length - 1 });
 
             for (var i = 0; i <= data.length - 4; i += 4) {
                 handlePoints.push({ X: data[i + 1].X, Y: data[i + 1].Y, I: i + 1, dot1: i, dot2: i === 0 ? i : i - 1 });
                 handlePoints.push({ X: data[i + 2].X, Y: data[i + 2].Y, I: i + 2, dot1: i + 3, dot2: i === data.length ? i + 3 : i + 4 });
             }
         }
-        // if (data.length <= 4) {
-        //     handlePoints = [];
-        //     handleLine = [];
-        //     controlPoints = [];
-        //     for (var i = 0; i < data.length; i++) {
-        //         controlPoints.push({ X: data[i].X, Y: data[i].Y, I: i });
-        //     }
-
-        // }
-        const dotsize = Math.max(width * scaleX, height * scaleY) / 40;
 
         // Additional points (controls) added by the user via click when editing the ink's format.
         const addpoints = apoints.map((pts, i) =>
@@ -178,27 +196,24 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
                     onPointerDown={(e) => { formatInstance.addPoints(pts.X, pts.Y, apoints, i, controlPoints); }} pointerEvents="all" cursor="all-scroll"
                 />
             </svg>);
-        // Green circles that allow the user to edit the curvature of the line using the selected point as the anchor.
+        // Blue circles that allow the user to edit the curvature of the line using the selected control point as the anchor.
         const handles = handlePoints.map((pts, i) =>
             <svg height="10" width="10" key={`hdl${i}`}>
-                <circle cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} r={strokeWidth} strokeWidth={0} fill="green"
-                    onPointerDown={(e) => this.onControlDown(e, pts.I)} pointerEvents="all" cursor="default" display={(pts.dot1 === formatInstance._currPoint || pts.dot2 === formatInstance._currPoint) ? "inherit" : "none"} />
+                <circle cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} r={strokeWidth / 2} strokeWidth={0} fill="#1F85DE"
+                    onPointerDown={(e) => this.onHandleDown(e, pts.I)} pointerEvents="all" cursor="default" display={(pts.dot1 === formatInstance._currPoint || pts.dot2 === formatInstance._currPoint) ? "inherit" : "none"} />
             </svg>);
-        // Points (red circles) of the ink that are made visible to user when editing its format.
+        // Control points of the ink (blue outlined squares) that are made visible to user when editing its format.
         const controls = controlPoints.map((pts, i) =>
             <svg height="10" width="10" key={`ctrl${i}`}>
-                <circle cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} r={strokeWidth / 2} strokeWidth={0} fill="red"
+                <rect x={(pts.X - left) * scaleX} y={(pts.Y - top) * scaleY} height={strokeWidth} width={strokeWidth} strokeWidth={strokeWidth / 6} stroke="#1F85DE" fill={formatInstance && formatInstance._currPoint === pts.I ? "#1F85DE" : "white"}
                     onPointerDown={(e) => { this.changeCurrPoint(pts.I); this.onControlDown(e, pts.I); }} pointerEvents="all" cursor="default"
                 />
             </svg>);
-        // Set of two green lines (each with a handle at the end) that are rendered perpendicular to the current selected point while editing.
+        // Set of two blue lines (each with a handle at the end) that are rendered perpendicular to the current selected point while editing.
         const handleLines = handleLine.map((pts, i) =>
-            <svg height="100" width="100" key={`line${i}`}  >
+            <svg height="100" width="100" key={`line${i}`}>
                 <line x1={(pts.X1 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} y1={(pts.Y1 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
-                    x2={(pts.X2 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} y2={(pts.Y2 - top - strokeWidth / 2) * scaleY + strokeWidth / 2} stroke="green" strokeWidth={dotsize / 6}
-                    display={(pts.dot1 === formatInstance._currPoint || pts.dot2 === formatInstance._currPoint) ? "inherit" : "none"} />
-                <line x1={(pts.X2 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} y1={(pts.Y2 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
-                    x2={(pts.X3 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} y2={(pts.Y3 - top - strokeWidth / 2) * scaleY + strokeWidth / 2} stroke="green" strokeWidth={dotsize / 6}
+                    x2={(pts.X2 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} y2={(pts.Y2 - top - strokeWidth / 2) * scaleY + strokeWidth / 2} stroke="#1F85DE" strokeWidth={dotsize / 10}
                     display={(pts.dot1 === formatInstance._currPoint || pts.dot2 === formatInstance._currPoint) ? "inherit" : "none"} />
             </svg>);
 
@@ -227,8 +242,8 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
                 {formatInstance._controlBtn && this.props.isSelected() ? addpoints : ""}
                 {formatInstance._controlBtn && this.props.isSelected() ? handleLines : ""}
                 {formatInstance._controlBtn && this.props.isSelected() ? handles : ""}
+                {this.props.isSelected() ? selectedLine : ""}
                 {formatInstance._controlBtn && this.props.isSelected() ? controls : ""}
-
             </svg>
         );
     }
diff --git a/src/fields/InkField.ts b/src/fields/InkField.ts
index b79a03146..c158dac42 100644
--- a/src/fields/InkField.ts
+++ b/src/fields/InkField.ts
@@ -13,6 +13,7 @@ export enum InkTool {
     Stamp = "stamp"
 }
 
+
 // Defines a point in an ink as a pair of x- and y-coordinates.
 export interface PointData {
     X: number;
@@ -22,6 +23,29 @@ export interface PointData {
 // Defines an ink as an array of points.
 export type InkData = Array<PointData>;
 
+export interface ControlPoint {
+    X: number;
+    Y: number;
+    I: number;
+}
+
+export interface HandlePoint {
+    X: number;
+    Y: number;
+    I: number;
+    dot1: number;
+    dot2: number;
+}
+
+export interface HandleLine {
+    X1: number;
+    Y1: number;
+    X2: number;
+    Y2: number;
+    dot1: number;
+    dot2: number;
+}
+
 const pointSchema = createSimpleSchema({
     X: true, Y: true
 });
-- 
cgit v1.2.3-70-g09d2


From 93c480867eac8071b7aff27b6f1c711f5e166eef Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 10 Jun 2021 18:30:29 -0400
Subject: fixed link anchor to not render as a blue box when link trails are
 turned on.

---
 src/client/views/StyleProvider.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/StyleProvider.tsx b/src/client/views/StyleProvider.tsx
index 9e61351c4..47a4a192c 100644
--- a/src/client/views/StyleProvider.tsx
+++ b/src/client/views/StyleProvider.tsx
@@ -127,7 +127,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
                 case DocumentType.LABEL: docColor = docColor || (doc.annotationOn !== undefined ? "rgba(128, 128, 128, 0.18)" : undefined); break;
                 case DocumentType.BUTTON: docColor = docColor || (darkScheme() ? "#2d2d2d" : "lightgray"); break;
                 case DocumentType.LINKANCHOR: docColor = isAnchor ? "lightblue" : "transparent"; break;
-                case DocumentType.LINK: docColor = docColor || "transparent"; break;
+                case DocumentType.LINK: docColor = (isAnchor ? docColor : "") || "transparent"; break;
                 case DocumentType.IMG:
                 case DocumentType.WEB:
                 case DocumentType.PDF:
-- 
cgit v1.2.3-70-g09d2


From 17816eaeb0bc9bbf7522d0a8b947d3d415cbca78 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 10 Jun 2021 18:40:28 -0400
Subject: fixed positioning of blue anchor dot when showing link anchor lines

---
 src/client/views/nodes/DocumentView.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index b861669f8..5646a9790 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -13,7 +13,7 @@ import { BoolCast, Cast, NumCast, ScriptCast, StrCast } from "../../../fields/Ty
 import { AudioField } from "../../../fields/URLField";
 import { GetEffectiveAcl, SharingPermissions, TraceMobx } from '../../../fields/util';
 import { MobileInterface } from '../../../mobile/MobileInterface';
-import { emptyFunction, hasDescendantTarget, OmitKeys, returnVal, Utils } from "../../../Utils";
+import { emptyFunction, hasDescendantTarget, OmitKeys, returnVal, Utils, returnTrue } from "../../../Utils";
 import { GooglePhotos } from '../../apis/google_docs/GooglePhotosClientUtils';
 import { Docs, DocUtils } from "../../documents/Documents";
 import { DocumentType } from '../../documents/DocumentTypes';
@@ -846,6 +846,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
                     PanelWidth={this.anchorPanelWidth}
                     PanelHeight={this.anchorPanelHeight}
                     dontRegisterView={false}
+                    fitWidth={returnTrue}
                     styleProvider={this.anchorStyleProvider}
                     removeDocument={this.hideLinkAnchor}
                     LayoutTemplate={undefined}
-- 
cgit v1.2.3-70-g09d2


From 306d34d838ef6c7f51d653837ace5f019be2e5f3 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Mon, 21 Jun 2021 13:48:23 -0400
Subject: null tests

---
 src/client/views/nodes/ScreenshotBox.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/ScreenshotBox.tsx b/src/client/views/nodes/ScreenshotBox.tsx
index 252c029e4..700f8a7d3 100644
--- a/src/client/views/nodes/ScreenshotBox.tsx
+++ b/src/client/views/nodes/ScreenshotBox.tsx
@@ -252,8 +252,8 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
             this.dataDoc.mediaState = "recording";
             DocUtils.ActiveRecordings.push(this);
         } else {
-            this._audioRec.stop();
-            this._videoRec.stop();
+            this._audioRec?.stop();
+            this._videoRec?.stop();
             this.dataDoc.mediaState = "paused";
             const ind = DocUtils.ActiveRecordings.indexOf(this);
             ind !== -1 && (DocUtils.ActiveRecordings.splice(ind, 1));
-- 
cgit v1.2.3-70-g09d2


From f82aba302c493ec535263142b3b1dff65173f7b5 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 17 Jun 2021 18:26:49 -0400
Subject: fixed drawing on images/videos/photos

---
 src/client/views/GestureOverlay.tsx                   | 2 +-
 src/client/views/nodes/ImageBox.tsx                   | 4 +++-
 src/client/views/nodes/VideoBox.tsx                   | 2 +-
 src/client/views/nodes/WebBox.tsx                     | 2 +-
 src/client/views/nodes/formattedText/RichTextMenu.tsx | 2 +-
 src/pen-gestures/GestureUtils.ts                      | 4 +---
 6 files changed, 8 insertions(+), 8 deletions(-)

(limited to 'src')

diff --git a/src/client/views/GestureOverlay.tsx b/src/client/views/GestureOverlay.tsx
index 491bf18b2..6a4f55bef 100644
--- a/src/client/views/GestureOverlay.tsx
+++ b/src/client/views/GestureOverlay.tsx
@@ -634,7 +634,7 @@ export class GestureOverlay extends Touchable {
         } else {
             this._points = [];
         }
-        CollectionFreeFormViewChrome.Instance.primCreated();
+        CollectionFreeFormViewChrome.Instance?.primCreated();
     }
 
     makePolygon = (shape: string, gesture: boolean) => {
diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx
index e2e08a0e6..13dfad0fe 100644
--- a/src/client/views/nodes/ImageBox.tsx
+++ b/src/client/views/nodes/ImageBox.tsx
@@ -26,6 +26,8 @@ import { FaceRectangles } from './FaceRectangles';
 import { FieldView, FieldViewProps } from './FieldView';
 import "./ImageBox.scss";
 import React = require("react");
+import { InkTool } from '../../../fields/InkField';
+import { CurrentUserUtils } from '../../util/CurrentUserUtils';
 const path = require('path');
 
 export const pageSchema = createSchema({
@@ -321,7 +323,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
     }
     @action
     marqueeDown = (e: React.PointerEvent) => {
-        if (!e.altKey && e.button === 0 && this.layoutDoc._viewScale === 1 && this.isContentActive(true)) this._marqueeing = [e.clientX, e.clientY];
+        if (!e.altKey && e.button === 0 && this.layoutDoc._viewScale === 1 && this.isContentActive(true) && ![InkTool.Highlighter, InkTool.Pen].includes(CurrentUserUtils.SelectedTool)) this._marqueeing = [e.clientX, e.clientY];
     }
     @action
     finishMarquee = () => {
diff --git a/src/client/views/nodes/VideoBox.tsx b/src/client/views/nodes/VideoBox.tsx
index 263fd5a19..fc08a2302 100644
--- a/src/client/views/nodes/VideoBox.tsx
+++ b/src/client/views/nodes/VideoBox.tsx
@@ -543,7 +543,7 @@ export class VideoBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
     }
 
     marqueeDown = action((e: React.PointerEvent) => {
-        if (!e.altKey && e.button === 0 && this.layoutDoc._viewScale === 1 && this.isContentActive(true)) this._marqueeing = [e.clientX, e.clientY];
+        if (!e.altKey && e.button === 0 && this.layoutDoc._viewScale === 1 && this.isContentActive(true) && ![InkTool.Highlighter, InkTool.Pen].includes(CurrentUserUtils.SelectedTool)) this._marqueeing = [e.clientX, e.clientY];
     });
 
     finishMarquee = action(() => {
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index cb7e58559..bd9e03856 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -395,7 +395,7 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
 
     @action
     onMarqueeDown = (e: React.PointerEvent) => {
-        if (!e.altKey && e.button === 0 && this.isContentActive(true)) {
+        if (!e.altKey && e.button === 0 && this.isContentActive(true) && ![InkTool.Highlighter, InkTool.Pen].includes(CurrentUserUtils.SelectedTool)) {
             this._marqueeing = [e.clientX, e.clientY];
             this.props.select(false);
         }
diff --git a/src/client/views/nodes/formattedText/RichTextMenu.tsx b/src/client/views/nodes/formattedText/RichTextMenu.tsx
index 071491463..59b2d3753 100644
--- a/src/client/views/nodes/formattedText/RichTextMenu.tsx
+++ b/src/client/views/nodes/formattedText/RichTextMenu.tsx
@@ -352,7 +352,7 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
         function onClick(e: React.PointerEvent) {
             e.preventDefault();
             e.stopPropagation();
-            self.TextView.endUndoTypingBatch();
+            self.TextView?.endUndoTypingBatch();
             UndoManager.RunInBatch(() => {
                 self.view && command && command(self.view.state, self.view.dispatch, self.view);
                 self.view && onclick && onclick(self.view.state, self.view.dispatch, self.view);
diff --git a/src/pen-gestures/GestureUtils.ts b/src/pen-gestures/GestureUtils.ts
index e7cc89697..65f2bf80c 100644
--- a/src/pen-gestures/GestureUtils.ts
+++ b/src/pen-gestures/GestureUtils.ts
@@ -20,9 +20,7 @@ export namespace GestureUtils {
     ): GestureEventDisposer {
         const handler = (e: Event) => func(e, (e as CustomEvent<GestureEvent>).detail);
         element.addEventListener("dashOnGesture", handler);
-        return () => {
-            element.removeEventListener("dashOnGesture", handler);
-        };
+        return () => element.removeEventListener("dashOnGesture", handler);
     }
 
     export enum Gestures {
-- 
cgit v1.2.3-70-g09d2


From 2579a16d5fb79a80a603e1e3574ed2548b1a77db Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 17 Jun 2021 19:42:28 -0400
Subject: from last

---
 src/client/views/pdf/PDFViewer.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx
index 85cf5abd7..3c6cad42f 100644
--- a/src/client/views/pdf/PDFViewer.tsx
+++ b/src/client/views/pdf/PDFViewer.tsx
@@ -372,7 +372,7 @@ export class PDFViewer extends React.Component<IViewerProps> {
         if ((e.button !== 0 || e.altKey) && this.props.isContentActive(true)) {
             this._setPreviewCursor?.(e.clientX, e.clientY, true);
         }
-        if (!e.altKey && e.button === 0 && this.props.isContentActive(true)) {
+        if (!e.altKey && e.button === 0 && this.props.isContentActive(true) && ![InkTool.Highlighter, InkTool.Pen].includes(CurrentUserUtils.SelectedTool)) {
             this.props.select(false);
             this._marqueeing = [e.clientX, e.clientY];
             if (e.target && ((e.target as any).className.includes("endOfContent") || ((e.target as any).parentElement.className !== "textLayer"))) {
-- 
cgit v1.2.3-70-g09d2


From 5e3f3de83797fa7aa3c82a2823e0bafeca222550 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 30 Jun 2021 16:11:11 -0400
Subject: allowed Dash-Web[0-9] as a valid pathname for local Dash
 repositories.

---
 src/server/DashUploadUtils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/server/DashUploadUtils.ts b/src/server/DashUploadUtils.ts
index 555e3bf3b..5ce69999a 100644
--- a/src/server/DashUploadUtils.ts
+++ b/src/server/DashUploadUtils.ts
@@ -33,7 +33,7 @@ export function InjectSize(filename: string, size: SizeSuffix) {
 }
 
 function isLocal() {
-    return /Dash-Web[\\\/]src[\\\/]server[\\\/]public[\\\/](.*)/;
+    return /Dash-Web[0-9]*[\\\/]src[\\\/]server[\\\/]public[\\\/](.*)/;
 }
 
 export namespace DashUploadUtils {
-- 
cgit v1.2.3-70-g09d2


From d9b5d949c22658531504c95cc94e30c824519cd1 Mon Sep 17 00:00:00 2001
From: vkalev <50213748+vkalev@users.noreply.github.com>
Date: Thu, 1 Jul 2021 12:44:52 -0500
Subject: ink controls resize on hover

---
 src/client/views/DocumentDecorations.tsx |   2 +-
 src/client/views/InkControl.tsx          | 103 ++++++++++++++++++++++
 src/client/views/InkStrokeProperties.ts  | 141 ++++++++++++++++---------------
 src/client/views/InkingStroke.tsx        |  35 +-------
 4 files changed, 179 insertions(+), 102 deletions(-)
 create mode 100644 src/client/views/InkControl.tsx

(limited to 'src')

diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index bf939d57c..d1682c09d 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -201,7 +201,7 @@ export class DocumentDecorations extends React.Component<{ boundsLeft: number, b
             (e: PointerEvent, down: number[], delta: number[]) => {
                 const movement = { X: delta[0], Y: e.clientY - down[1] };
                 const angle = Math.max(1, Math.abs(movement.Y / 10));
-                InkStrokeProperties.Instance?.rotate(2 * movement.X / angle * (Math.PI / 180));
+                InkStrokeProperties.Instance?.rotateInk(2 * movement.X / angle * (Math.PI / 180));
                 return false;
             },
             () => this._rotateUndo?.end(),
diff --git a/src/client/views/InkControl.tsx b/src/client/views/InkControl.tsx
new file mode 100644
index 000000000..ae0fc0b22
--- /dev/null
+++ b/src/client/views/InkControl.tsx
@@ -0,0 +1,103 @@
+import React = require("react");
+import { observable, action } from "mobx";
+import { observer } from "mobx-react";
+import { InkStrokeProperties } from "./InkStrokeProperties";
+import { setupMoveUpEvents, emptyFunction } from "../../Utils";
+import { UndoManager } from "../util/UndoManager";
+import { ControlPoint } from "../../fields/InkField";
+import { Transform } from "../util/Transform";
+
+export interface InkControlProps {
+    control: ControlPoint;
+    left: number;
+    top: number;
+    scaleX: number;
+    scaleY: number;
+    strokeWidth: number;
+    ScreenToLocalTransform: () => Transform;
+}
+
+@observer
+export class InkControl extends React.Component<InkControlProps> {
+    @observable private _overControl = false;
+
+    @action
+    onPointerEnter = () => {
+        this._overControl = true;
+    }
+
+    @action
+    onPointerLeave = () => {
+        this._overControl = false;
+    }
+
+    /**
+     * Handles the movement of a selected control point when the user clicks and drags.
+     * @param controlNum The index of the currently selected control point.
+     */
+    @action
+    onControlDown = (e: React.PointerEvent, controlNum: number): void => {
+        if (InkStrokeProperties.Instance) {
+            InkStrokeProperties.Instance.moveControl(0, 0, 1);
+            const controlUndo = UndoManager.StartBatch("DocDecs set radius");
+            const screenScale = this.props.ScreenToLocalTransform().Scale;
+            setupMoveUpEvents(this, e,
+                (e: PointerEvent, down: number[], delta: number[]) => {
+                    InkStrokeProperties.Instance?.moveControl(-delta[0] * screenScale, -delta[1] * screenScale, controlNum);
+                    return false;
+                },
+                () => controlUndo?.end(), emptyFunction);
+        }
+    }
+
+    /**
+     * Deletes the currently selected points.
+     * @param e Keyboard Event.
+     */
+    @action
+    onDelete = (e: KeyboardEvent) => {
+        if (["-", "Backspace", "Delete"].includes(e.key)) {
+            if (InkStrokeProperties.Instance?.deletePoints()) e.stopPropagation();
+        }
+    }
+
+    /**
+     * Changes the current selected control point.
+     * @param i The number of the point to be selected.
+     */
+    @action
+    changeCurrPoint = (i: number) => {
+        if (InkStrokeProperties.Instance) {
+            InkStrokeProperties.Instance._currPoint = i;
+            document.addEventListener("keydown", this.onDelete, true);
+        }
+    }
+ 
+
+    render() {
+        const control = this.props.control;
+        const left = this.props.left;
+        const top = this.props.top;
+        const scaleX = this.props.scaleX;
+        const scaleY = this.props.scaleY;
+        const strokeWidth = this.props.strokeWidth;
+
+        return (
+            <svg height="10" width="10" key={`ctrl${control.I}`}>
+                <rect 
+                    x={(control.X - left) * scaleX} 
+                    y={(control.Y - top) * scaleY} 
+                    height={this._overControl ? strokeWidth * 1.5 : strokeWidth} 
+                    width={this._overControl ? strokeWidth * 1.5 : strokeWidth} 
+                    strokeWidth={strokeWidth / 6} stroke="#1F85DE" 
+                    fill={InkStrokeProperties.Instance?._currPoint === control.I ? "#1F85DE" : "white"}
+                    onPointerDown={(e) => { this.changeCurrPoint(control.I); this.onControlDown(e, control.I); }} 
+                    onMouseEnter={this.onPointerEnter} 
+                    onMouseLeave={this.onPointerLeave} 
+                    pointerEvents="all" 
+                    cursor="default"
+                />
+            </svg>
+        )
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/InkStrokeProperties.ts b/src/client/views/InkStrokeProperties.ts
index 5c5395984..720a89334 100644
--- a/src/client/views/InkStrokeProperties.ts
+++ b/src/client/views/InkStrokeProperties.ts
@@ -32,51 +32,52 @@ export class InkStrokeProperties {
         const inks = SelectionManager.Views().filter(i => Document(i.rootDoc).type === DocumentType.INK);
         return inks.length ? inks : undefined;
     }
-    @computed get unFilled() { return this.selectedInk?.reduce((p, i) => p && !i.rootDoc.fillColor ? true : false, true) || false; }
-    @computed get unStrokd() { return this.selectedInk?.reduce((p, i) => p && !i.rootDoc.color ? true : false, true) || false; }
-    @computed get solidFil() { return this.selectedInk?.reduce((p, i) => p && i.rootDoc.fillColor ? true : false, true) || false; }
-    @computed get solidStk() { return this.selectedInk?.reduce((p, i) => p && i.rootDoc.color && (!i.rootDoc.strokeDash || i.rootDoc.strokeDash === "0") ? true : false, true) || false; }
-    @computed get dashdStk() { return !this.unStrokd && this.getField("strokeDash") || ""; }
-    @computed get colorFil() { const ccol = this.getField("fillColor") || ""; ccol && (this._lastFill = ccol); return ccol; }
-    @computed get colorStk() { const ccol = this.getField("color") || ""; ccol && (this._lastLine = ccol); return ccol; }
-    @computed get widthStk() { return this.getField("strokeWidth") || "1"; }
-    @computed get markHead() { return this.getField("strokeStartMarker") || ""; }
-    @computed get markTail() { return this.getField("strokeEndMarker") || ""; }
-    @computed get shapeHgt() { return this.getField("_height"); }
-    @computed get shapeWid() { return this.getField("_width"); }
-    @computed get shapeXps() { return this.getField("x"); }
-    @computed get shapeYps() { return this.getField("y"); }
-    @computed get shapeRot() { return this.getField("rotation"); }
-    set unFilled(value) { this.colorFil = value ? "" : this._lastFill; }
-    set solidFil(value) { this.unFilled = !value; }
-    set colorFil(value) { value && (this._lastFill = value); this.selectedInk?.forEach(i => i.rootDoc.fillColor = value ? value : undefined); }
-    set colorStk(value) { value && (this._lastLine = value); this.selectedInk?.forEach(i => i.rootDoc.color = value ? value : undefined); }
-    set markHead(value) { this.selectedInk?.forEach(i => i.rootDoc.strokeStartMarker = value); }
-    set markTail(value) { this.selectedInk?.forEach(i => i.rootDoc.strokeEndMarker = value); }
-    set unStrokd(value) { this.colorStk = value ? "" : this._lastLine; }
-    set solidStk(value) { this.dashdStk = ""; this.unStrokd = !value; }
-    set dashdStk(value) {
-        value && (this._lastDash = value) && (this.unStrokd = false);
-        this.selectedInk?.forEach(i => i.rootDoc.strokeDash = value ? this._lastDash : undefined);
-    }
-    set shapeXps(value) { this.selectedInk?.forEach(i => i.rootDoc.x = Number(value)); }
-    set shapeYps(value) { this.selectedInk?.forEach(i => i.rootDoc.y = Number(value)); }
-    set shapeRot(value) { this.selectedInk?.forEach(i => i.rootDoc.rotation = Number(value)); }
-    set widthStk(value) { this.selectedInk?.forEach(i => i.rootDoc.strokeWidth = Number(value)); }
-    set shapeWid(value) {
-        this.selectedInk?.filter(i => i.rootDoc._width && i.rootDoc._height).forEach(i => {
-            const oldWidth = NumCast(i.rootDoc._width);
-            i.rootDoc._width = Number(value);
-            this._lock && (i.rootDoc._height = (i.rootDoc._width * NumCast(i.rootDoc._height)) / oldWidth);
-        });
-    }
-    set shapeHgt(value) {
-        this.selectedInk?.filter(i => i.rootDoc._width && i.rootDoc._height).forEach(i => {
-            const oldHeight = NumCast(i.rootDoc._height);
-            i.rootDoc._height = Number(value);
-            this._lock && (i.rootDoc._width = (i.rootDoc._height * NumCast(i.rootDoc._width)) / oldHeight);
-        });
-    }
+
+    // @computed get unFilled() { return this.selectedInk?.reduce((p, i) => p && !i.rootDoc.fillColor ? true : false, true) || false; }
+    // @computed get unStrokd() { return this.selectedInk?.reduce((p, i) => p && !i.rootDoc.color ? true : false, true) || false; }
+    // @computed get solidFil() { return this.selectedInk?.reduce((p, i) => p && i.rootDoc.fillColor ? true : false, true) || false; }
+    // @computed get solidStk() { return this.selectedInk?.reduce((p, i) => p && i.rootDoc.color && (!i.rootDoc.strokeDash || i.rootDoc.strokeDash === "0") ? true : false, true) || false; }
+    // @computed get dashdStk() { return !this.unStrokd && this.getField("strokeDash") || ""; }
+    // @computed get colorFil() { const ccol = this.getField("fillColor") || ""; ccol && (this._lastFill = ccol); return ccol; }
+    // @computed get colorStk() { const ccol = this.getField("color") || ""; ccol && (this._lastLine = ccol); return ccol; }
+    // @computed get widthStk() { return this.getField("strokeWidth") || "1"; }
+    // @computed get markHead() { return this.getField("strokeStartMarker") || ""; }
+    // @computed get markTail() { return this.getField("strokeEndMarker") || ""; }
+    // @computed get shapeHgt() { return this.getField("_height"); }
+    // @computed get shapeWid() { return this.getField("_width"); }
+    // @computed get shapeXps() { return this.getField("x"); }
+    // @computed get shapeYps() { return this.getField("y"); }
+    // @computed get shapeRot() { return this.getField("rotation"); }
+    // set unFilled(value) { this.colorFil = value ? "" : this._lastFill; }
+    // set solidFil(value) { this.unFilled = !value; }
+    // set colorFil(value) { value && (this._lastFill = value); this.selectedInk?.forEach(i => i.rootDoc.fillColor = value ? value : undefined); }
+    // set colorStk(value) { value && (this._lastLine = value); this.selectedInk?.forEach(i => i.rootDoc.color = value ? value : undefined); }
+    // set markHead(value) { this.selectedInk?.forEach(i => i.rootDoc.strokeStartMarker = value); }
+    // set markTail(value) { this.selectedInk?.forEach(i => i.rootDoc.strokeEndMarker = value); }
+    // set unStrokd(value) { this.colorStk = value ? "" : this._lastLine; }
+    // set solidStk(value) { this.dashdStk = ""; this.unStrokd = !value; }
+    // set dashdStk(value) {
+    //     value && (this._lastDash = value) && (this.unStrokd = false);
+    //     this.selectedInk?.forEach(i => i.rootDoc.strokeDash = value ? this._lastDash : undefined);
+    // }
+    // set shapeXps(value) { this.selectedInk?.forEach(i => i.rootDoc.x = Number(value)); }
+    // set shapeYps(value) { this.selectedInk?.forEach(i => i.rootDoc.y = Number(value)); }
+    // set shapeRot(value) { this.selectedInk?.forEach(i => i.rootDoc.rotation = Number(value)); }
+    // set widthStk(value) { this.selectedInk?.forEach(i => i.rootDoc.strokeWidth = Number(value)); }
+    // set shapeWid(value) {
+    //     this.selectedInk?.filter(i => i.rootDoc._width && i.rootDoc._height).forEach(i => {
+    //         const oldWidth = NumCast(i.rootDoc._width);
+    //         i.rootDoc._width = Number(value);
+    //         this._lock && (i.rootDoc._height = (i.rootDoc._width * NumCast(i.rootDoc._height)) / oldWidth);
+    //     });
+    // }
+    // set shapeHgt(value) {
+    //     this.selectedInk?.filter(i => i.rootDoc._width && i.rootDoc._height).forEach(i => {
+    //         const oldHeight = NumCast(i.rootDoc._height);
+    //         i.rootDoc._height = Number(value);
+    //         this._lock && (i.rootDoc._width = (i.rootDoc._height * NumCast(i.rootDoc._width)) / oldHeight);
+    //     });
+    // }
 
     /**
      * Adds a new control point to the ink instance when editing its format.
@@ -191,7 +192,7 @@ export class InkStrokeProperties {
      */
     @undoBatch
     @action
-    rotate = (angle: number) => {
+    rotateInk = (angle: number) => {
         this.applyFunction((doc: Doc, ink: InkData, ptsXscale: number, ptsYscale: number) => {
             const oldXrange = (xs => ({ coord: NumCast(doc.x), min: Math.min(...xs), max: Math.max(...xs) }))(ink.map(p => p.X));
             const oldYrange = (ys => ({ coord: NumCast(doc.y), min: Math.min(...ys), max: Math.max(...ys) }))(ink.map(p => p.Y));
@@ -301,29 +302,29 @@ export class InkStrokeProperties {
             return newPoints;
         });
 
-    /**
-     * Changes the color of the border of the ink instance.
-     * @param color The new hex value to change the border to.
-     * @returns true.
-     */
-    @undoBatch
-    @action
-    switchStk = (color: ColorState) => {
-        const val = String(color.hex);
-        this.colorStk = val;
-        return true;
-    }
+    // /**
+    //  * Changes the color of the border of the ink instance.
+    //  * @param color The new hex value to change the border to.
+    //  * @returns true.
+    //  */
+    // @undoBatch
+    // @action
+    // switchStk = (color: ColorState) => {
+    //     const val = String(color.hex);
+    //     this.colorStk = val;
+    //     return true;
+    // }
 
-    /**
-     * Changes the color of the fill of the ink instance.
-     * @param color The new hex value to change the fill to.
-     * @returns true.
-     */
-    @undoBatch
-    @action
-    switchFil = (color: ColorState) => {
-        const val = String(color.hex);
-        this.colorFil = val;
-        return true;
-    }
+    // /**
+    //  * Changes the color of the fill of the ink instance.
+    //  * @param color The new hex value to change the fill to.
+    //  * @returns true.
+    //  */
+    // @undoBatch
+    // @action
+    // switchFil = (color: ColorState) => {
+    //     const val = String(color.hex);
+    //     this.colorFil = val;
+    //     return true;
+    // }
 }
\ No newline at end of file
diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx
index 163eb05b0..9555557ec 100644
--- a/src/client/views/InkingStroke.tsx
+++ b/src/client/views/InkingStroke.tsx
@@ -18,6 +18,7 @@ import { FieldView, FieldViewProps } from "./nodes/FieldView";
 import React = require("react");
 import { InkStrokeProperties } from "./InkStrokeProperties";
 import { CurrentUserUtils } from "../util/CurrentUserUtils";
+import { InkControl } from "./InkControl";
 
 type InkDocument = makeInterface<[typeof documentSchema]>;
 const InkDocument = makeInterface(documentSchema);
@@ -79,29 +80,6 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         }
     }
 
-    /**
-     * Changes the current selected control point.
-     * @param i The number of the point to be selected.
-     */
-    @action
-    changeCurrPoint = (i: number) => {
-        if (InkStrokeProperties.Instance) {
-            InkStrokeProperties.Instance._currPoint = i;
-            document.addEventListener("keydown", this.onDelete, true);
-        }
-    }
-
-    /**
-     * Deletes the currently selected points.
-     * @param e Keyboard Event.
-     */
-    @action
-    onDelete = (e: KeyboardEvent) => {
-        if (["-", "Backspace", "Delete"].includes(e.key)) {
-            if (InkStrokeProperties.Instance?.deletePoints()) e.stopPropagation();
-        }
-    }
-
     /**
      * Handles the movement of the entire ink object when the user clicks and drags.
      * @param e React Pointer Event.
@@ -113,7 +91,7 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         }
     }
 
-    public static MaskDim = 50000;
+    static readonly MaskDim = 50000;
     render() {
         TraceMobx();
         const formatInstance = InkStrokeProperties.Instance;
@@ -143,7 +121,7 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
             StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
             StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5 && lineBot - lineTop > 1 && lineRgt - lineLft > 1, false);
         
-        const selectedLine = InteractionUtils.CreatePolyline(data, lineLft - strokeWidth * 3, lineTop - strokeWidth * 3, "#1F85DE", strokeWidth / 6, strokeWidth / 6,
+        const selectedLine = InteractionUtils.CreatePolyline(data, lineLft - strokeWidth * 4 * scaleX, lineTop - strokeWidth * 4 * scaleX, "#1F85DE", strokeWidth / 6, strokeWidth / 6,
             StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
             StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
             StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5 && lineBot - lineTop > 1 && lineRgt - lineLft > 1, false);
@@ -203,12 +181,7 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
                     onPointerDown={(e) => this.onHandleDown(e, pts.I)} pointerEvents="all" cursor="default" display={(pts.dot1 === formatInstance._currPoint || pts.dot2 === formatInstance._currPoint) ? "inherit" : "none"} />
             </svg>);
         // Control points of the ink (blue outlined squares) that are made visible to user when editing its format.
-        const controls = controlPoints.map((pts, i) =>
-            <svg height="10" width="10" key={`ctrl${i}`}>
-                <rect x={(pts.X - left) * scaleX} y={(pts.Y - top) * scaleY} height={strokeWidth} width={strokeWidth} strokeWidth={strokeWidth / 6} stroke="#1F85DE" fill={formatInstance && formatInstance._currPoint === pts.I ? "#1F85DE" : "white"}
-                    onPointerDown={(e) => { this.changeCurrPoint(pts.I); this.onControlDown(e, pts.I); }} pointerEvents="all" cursor="default"
-                />
-            </svg>);
+        const controls = controlPoints.map((pts, i) => <InkControl control={pts} left={left} top={top} scaleX={scaleX} scaleY={scaleY} strokeWidth={strokeWidth} ScreenToLocalTransform={this.props.ScreenToLocalTransform} /> );
         // Set of two blue lines (each with a handle at the end) that are rendered perpendicular to the current selected point while editing.
         const handleLines = handleLine.map((pts, i) =>
             <svg height="100" width="100" key={`line${i}`}>
-- 
cgit v1.2.3-70-g09d2


From 48640698459e073118a8a36d5428639c88cb6864 Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Thu, 1 Jul 2021 16:55:16 -0400
Subject: fixed bizarre bug

---
 .../CollectionSchemaMovableTableHOC.tsx            | 85 +++++++++++-----------
 1 file changed, 42 insertions(+), 43 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx b/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
index a842d629e..149677976 100644
--- a/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
+++ b/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
@@ -204,59 +204,58 @@ export class MovableRow extends React.Component<MovableRowProps> {
         return false;
     }
 
-    onRowContextMenu = (e: React.MouseEvent): void =>
-        e.preventDefault();
-    const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
-    ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
+    onRowContextMenu = (e: React.MouseEvent): void => {
+        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
+        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
     }
 
-@undoBatch
-@action
-move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
-    const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
-    return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
-}
+    @undoBatch
+    @action
+    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
+        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
+        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
+    }
 
-@action
-onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
-    console.log("yes");
-    if (e.key === "Backspace" || e.key === "Delete") {
-        undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
+    @action
+    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
+        console.log("yes");
+        if (e.key === "Backspace" || e.key === "Delete") {
+            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
+        }
     }
-}
 
-render() {
-    const { children = null, rowInfo } = this.props;
+    render() {
+        const { children = null, rowInfo } = this.props;
 
-    if (!rowInfo) {
-        return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
-    }
+        if (!rowInfo) {
+            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
+        }
 
-    const { original } = rowInfo;
-    const doc = FieldValue(Cast(original, Doc));
+        const { original } = rowInfo;
+        const doc = FieldValue(Cast(original, Doc));
 
-    if (!doc) return (null);
+        if (!doc) return (null);
 
-    const reference = React.createRef<HTMLDivElement>();
-    const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
+        const reference = React.createRef<HTMLDivElement>();
+        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
 
-    let className = "collectionSchema-row";
-    if (this.props.rowFocused) className += " row-focused";
-    if (this.props.rowWrapped) className += " row-wrapped";
+        let className = "collectionSchema-row";
+        if (this.props.rowFocused) className += " row-focused";
+        if (this.props.rowWrapped) className += " row-wrapped";
 
-    return (
-        <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
-            <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
-                <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
-                    <div className="row-dragger">
-                        <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
-                        <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
-                        <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
-                    </div>
-                    {children}
-                </ReactTableDefaults.TrComponent>
+        return (
+            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
+                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
+                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
+                        <div className="row-dragger">
+                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
+                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
+                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
+                        </div>
+                        {children}
+                    </ReactTableDefaults.TrComponent>
+                </div>
             </div>
-        </div>
-    );
-}
+        );
+    }
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From be53a5a9122d0a6caa27810e34544578abb4c573 Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Thu, 1 Jul 2021 17:08:57 -0400
Subject: fixed minor bug that prevented strings in quotes from being saved

---
 src/client/views/collections/CollectionSchemaCells.tsx | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
index 42c5375ce..e9c5c009f 100644
--- a/src/client/views/collections/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/CollectionSchemaCells.tsx
@@ -249,11 +249,10 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                             if (isNaN(parseInt(s))) {
                                                 inputIsNum = false;
                                             }
-                                            console.log(inputIsNum);
                                         }
                                         // check if the input is a boolean
                                         let inputIsBool: boolean = value == "false" || value == "true";
-
+                                        // what to do in the case 
                                         if (!inputIsNum && !inputIsBool && !value.startsWith("=")) {
                                             // if it's not a number, it's a string, and should be processed as such
                                             // strips the string of quotes when it is edited to prevent quotes form being added to the text automatically 
@@ -278,7 +277,7 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                             inputAsString += '"';
                                             //two options here: we can strip off outer quotes or we can figure out what's going on with the script
                                             const script = CompileScript(inputAsString, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            script.compiled && (retVal = this.applyToDoc(inputAsString.length !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            script.compiled && (retVal = this.applyToDoc((inputAsString.length !== value.length || inputAsString.length - 2 !== value.length) ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
                                             // handle numbers and expressions
                                         } else if (inputIsNum || value.startsWith("=")) {
                                             //TODO: make accept numbers
-- 
cgit v1.2.3-70-g09d2


From 2ddb05c1cfbd146c4bd0888c3502c7ad3ab5f961 Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Thu, 1 Jul 2021 17:17:41 -0400
Subject: added bugfixes to other branches of the if-else

---
 src/client/views/collections/CollectionSchemaCells.tsx | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
index e9c5c009f..3fb9910b5 100644
--- a/src/client/views/collections/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/CollectionSchemaCells.tsx
@@ -277,7 +277,8 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                             inputAsString += '"';
                                             //two options here: we can strip off outer quotes or we can figure out what's going on with the script
                                             const script = CompileScript(inputAsString, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            script.compiled && (retVal = this.applyToDoc((inputAsString.length !== value.length || inputAsString.length - 2 !== value.length) ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            const changeMade = inputAsString.length !== value.length || inputAsString.length - 2 !== value.length
+                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
                                             // handle numbers and expressions
                                         } else if (inputIsNum || value.startsWith("=")) {
                                             //TODO: make accept numbers
@@ -290,11 +291,13 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                                 }
                                             }
                                             const script = CompileScript(inputSansCommas, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            script.compiled && (retVal = this.applyToDoc(inputSansCommas.length + 2 !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
+                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
                                             // handle booleans
                                         } else if (inputIsBool) {
                                             const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            script.compiled && (retVal = this.applyToDoc(value.length + 2 !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
+                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
                                         }
                                     }
                                     if (retVal) {
-- 
cgit v1.2.3-70-g09d2


From 464bca333ba97185dcbc93409001adeb26711902 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 1 Jul 2021 22:43:47 -0400
Subject: added ability to create anchors in PDF/Webboxes by making a selection
 and clicking the start link button

---
 src/client/views/MarqueeAnnotator.tsx |  8 ++++----
 src/client/views/nodes/PDFBox.tsx     | 13 ++++++++-----
 src/client/views/nodes/WebBox.tsx     | 19 +++++++++++--------
 src/client/views/pdf/AnchorMenu.tsx   |  1 +
 src/client/views/pdf/PDFViewer.tsx    |  8 ++++----
 5 files changed, 28 insertions(+), 21 deletions(-)

(limited to 'src')

diff --git a/src/client/views/MarqueeAnnotator.tsx b/src/client/views/MarqueeAnnotator.tsx
index d2074d653..b5df7b79b 100644
--- a/src/client/views/MarqueeAnnotator.tsx
+++ b/src/client/views/MarqueeAnnotator.tsx
@@ -65,10 +65,9 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
         doc.addEventListener("pointermove", this.onSelectMove);
         doc.addEventListener("pointerup", this.onSelectEnd);
 
-        AnchorMenu.Instance.OnClick = (e: PointerEvent) => {
-            this.props.anchorMenuClick?.()?.(this.highlight("rgba(173, 216, 230, 0.75)", true));
-        };
+        AnchorMenu.Instance.OnClick = (e: PointerEvent) => this.props.anchorMenuClick?.()?.(this.highlight("rgba(173, 216, 230, 0.75)", true));
         AnchorMenu.Instance.Highlight = this.highlight;
+        AnchorMenu.Instance.GetAnchor = () => this.highlight("rgba(173, 216, 230, 0.75)", true);
         /**
          * This function is used by the AnchorMenu to create an anchor highlight and a new linked text annotation.  
          * It also initiates a Drag/Drop interaction to place the text annotation.
@@ -105,7 +104,8 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
     @action
     makeAnnotationDocument = (color: string, isLinkButton?: boolean): Opt<Doc> => {
         if (this.props.savedAnnotations.size === 0) return undefined;
-        if ((Array.from(this.props.savedAnnotations.values())[0][0] as any).marqueeing) {
+        const savedAnnos = Array.from(this.props.savedAnnotations.values())[0];
+        if (savedAnnos.length && (savedAnnos[0] as any).marqueeing) {
             const scale = this.props.scaling?.() || 1;
             const anno = Array.from(this.props.savedAnnotations.values())[0][0];
             const containerOffset = this.props.containerOffset?.() || [0, 0];
diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx
index feaeb9e21..8f61e252b 100644
--- a/src/client/views/nodes/PDFBox.tsx
+++ b/src/client/views/nodes/PDFBox.tsx
@@ -23,6 +23,7 @@ import { FieldView, FieldViewProps } from './FieldView';
 import { pageSchema } from "./ImageBox";
 import "./PDFBox.scss";
 import React = require("react");
+import { AnchorMenu } from '../pdf/AnchorMenu';
 
 type PdfDocument = makeInterface<[typeof documentSchema, typeof panZoomSchema, typeof pageSchema]>;
 const PdfDocument = makeInterface(documentSchema, panZoomSchema, pageSchema);
@@ -94,11 +95,13 @@ export class PDFBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
         return this._pdfViewer?.scrollFocus(doc, smooth);
     }
     getAnchor = () => {
-        const anchor = Docs.Create.TextanchorDocument({
-            title: StrCast(this.rootDoc.title + " " + this.layoutDoc._scrollTop),
-            annotationOn: this.rootDoc,
-            y: NumCast(this.layoutDoc._scrollTop),
-        });
+        const anchor =
+            AnchorMenu.Instance?.GetAnchor() ??
+            Docs.Create.TextanchorDocument({
+                title: StrCast(this.rootDoc.title + " " + this.layoutDoc._scrollTop),
+                annotationOn: this.rootDoc,
+                y: NumCast(this.layoutDoc._scrollTop),
+            });
         this.addDocument(anchor);
         return anchor;
     }
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index bd9e03856..a16881b66 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -88,9 +88,10 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
 
         this._disposers.selection = reaction(() => this.props.isSelected(),
             selected => !selected && setTimeout(() => {
-                Array.from(this._savedAnnotations.values()).forEach(v => v.forEach(a => a.remove()));
-                this._savedAnnotations.clear();
-            }));
+                // Array.from(this._savedAnnotations.values()).forEach(v => v.forEach(a => a.remove()));
+                // this._savedAnnotations.clear();
+            })
+        );
 
         if (this.webField?.href.indexOf("youtube") !== -1) {
             const youtubeaspect = 400 / 315;
@@ -174,11 +175,13 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
     }
 
     getAnchor = () => {
-        const anchor = Docs.Create.TextanchorDocument({
-            title: StrCast(this.rootDoc.title + " " + this.layoutDoc._scrollTop),
-            annotationOn: this.rootDoc,
-            y: NumCast(this.layoutDoc._scrollTop),
-        });
+        const anchor =
+            AnchorMenu.Instance?.GetAnchor() ??
+            Docs.Create.TextanchorDocument({
+                title: StrCast(this.rootDoc.title + " " + this.layoutDoc._scrollTop),
+                annotationOn: this.rootDoc,
+                y: NumCast(this.layoutDoc._scrollTop),
+            });
         this.addDocument(anchor);
         return anchor;
     }
diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx
index 1e2d72254..86b124de5 100644
--- a/src/client/views/pdf/AnchorMenu.tsx
+++ b/src/client/views/pdf/AnchorMenu.tsx
@@ -46,6 +46,7 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
     public OnClick: (e: PointerEvent) => void = unimplementedFunction;
     public StartDrag: (e: PointerEvent, ele: HTMLElement) => void = unimplementedFunction;
     public Highlight: (color: string, isPushpin: boolean) => Opt<Doc> = (color: string, isPushpin: boolean) => undefined;
+    public GetAnchor: () => Opt<Doc> = () => undefined;
     public Delete: () => void = unimplementedFunction;
     public AddTag: (key: string, value: string) => boolean = returnFalse;
     public PinToPres: () => void = unimplementedFunction;
diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx
index 3c6cad42f..4a50dccf3 100644
--- a/src/client/views/pdf/PDFViewer.tsx
+++ b/src/client/views/pdf/PDFViewer.tsx
@@ -133,10 +133,10 @@ export class PDFViewer extends React.Component<IViewerProps> {
 
         this._disposers.selected = reaction(() => this.props.isSelected(),
             selected => {
-                if (!selected) {
-                    Array.from(this._savedAnnotations.values()).forEach(v => v.forEach(a => a.remove()));
-                    Array.from(this._savedAnnotations.keys()).forEach(k => this._savedAnnotations.set(k, []));
-                }
+                // if (!selected) {
+                //     Array.from(this._savedAnnotations.values()).forEach(v => v.forEach(a => a.remove()));
+                //     Array.from(this._savedAnnotations.keys()).forEach(k => this._savedAnnotations.set(k, []));
+                // }
                 (SelectionManager.Views().length === 1) && this.setupPdfJsViewer();
             },
             { fireImmediately: true });
-- 
cgit v1.2.3-70-g09d2


From 89c8891e9def96a871d36ab7772e453b8d8c21c1 Mon Sep 17 00:00:00 2001
From: vkalev <vjk1883@gmail.com>
Date: Fri, 2 Jul 2021 11:58:06 -0500
Subject: indicator appears on hover for ink control points to be added

---
 src/client/views/InkControl.tsx   |  8 +++-----
 src/client/views/InkingStroke.tsx | 23 ++++++++++++++++++-----
 2 files changed, 21 insertions(+), 10 deletions(-)

(limited to 'src')

diff --git a/src/client/views/InkControl.tsx b/src/client/views/InkControl.tsx
index ae0fc0b22..accb16f61 100644
--- a/src/client/views/InkControl.tsx
+++ b/src/client/views/InkControl.tsx
@@ -51,8 +51,7 @@ export class InkControl extends React.Component<InkControlProps> {
     }
 
     /**
-     * Deletes the currently selected points.
-     * @param e Keyboard Event.
+     * Deletes the currently selected point.
      */
     @action
     onDelete = (e: KeyboardEvent) => {
@@ -63,7 +62,6 @@ export class InkControl extends React.Component<InkControlProps> {
 
     /**
      * Changes the current selected control point.
-     * @param i The number of the point to be selected.
      */
     @action
     changeCurrPoint = (i: number) => {
@@ -85,8 +83,8 @@ export class InkControl extends React.Component<InkControlProps> {
         return (
             <svg height="10" width="10" key={`ctrl${control.I}`}>
                 <rect 
-                    x={(control.X - left) * scaleX} 
-                    y={(control.Y - top) * scaleY} 
+                    x={(control.X - left - strokeWidth / 2) * scaleX} 
+                    y={(control.Y - top - strokeWidth / 2) * scaleY} 
                     height={this._overControl ? strokeWidth * 1.5 : strokeWidth} 
                     width={this._overControl ? strokeWidth * 1.5 : strokeWidth} 
                     strokeWidth={strokeWidth / 6} stroke="#1F85DE" 
diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx
index 9555557ec..b2ef76882 100644
--- a/src/client/views/InkingStroke.tsx
+++ b/src/client/views/InkingStroke.tsx
@@ -1,4 +1,4 @@
-import { action } from "mobx";
+import { action, observable } from "mobx";
 import { observer } from "mobx-react";
 import { Doc } from "../../fields/Doc";
 import { documentSchema } from "../../fields/documentSchemas";
@@ -26,6 +26,9 @@ const InkDocument = makeInterface(documentSchema);
 @observer
 export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocument>(InkDocument) {
     private _controlUndo?: UndoManager.Batch;
+    @observable private _overAddPoint = -1;
+
+    static readonly MaskDim = 50000;
 
     public static LayoutString(fieldStr: string) { return FieldView.LayoutString(InkingStroke, fieldStr); }
 
@@ -34,6 +37,17 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         CognitiveServices.Inking.Appliers.ConcatenateHandwriting(this.dataDoc, ["inkAnalysis", "handwriting"], [data]);
     }
 
+    @action
+    onPointerEnter = (i: number) => {
+        this._overAddPoint = i;
+    }
+
+    @action
+    onPointerLeave = () => {
+        this._overAddPoint = -1;
+    }
+
+
     @action
     public static toggleMask = (inkDoc: Doc) => {
         inkDoc.isInkMask = !inkDoc.isInkMask;
@@ -91,7 +105,6 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         }
     }
 
-    static readonly MaskDim = 50000;
     render() {
         TraceMobx();
         const formatInstance = InkStrokeProperties.Instance;
@@ -121,7 +134,7 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
             StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
             StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5 && lineBot - lineTop > 1 && lineRgt - lineLft > 1, false);
         
-        const selectedLine = InteractionUtils.CreatePolyline(data, lineLft - strokeWidth * 4 * scaleX, lineTop - strokeWidth * 4 * scaleX, "#1F85DE", strokeWidth / 6, strokeWidth / 6,
+        const selectedLine = InteractionUtils.CreatePolyline(data, lineLft - strokeWidth * 3, lineTop - strokeWidth * 3, "#1F85DE", strokeWidth / 6, strokeWidth / 6,
             StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
             StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
             StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5 && lineBot - lineTop > 1 && lineRgt - lineLft > 1, false);
@@ -170,8 +183,8 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         // Additional points (controls) added by the user via click when editing the ink's format.
         const addpoints = apoints.map((pts, i) =>
             <svg height="10" width="10" key={`add${i}`}>
-                <circle cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} r={strokeWidth / 2} stroke="invisible" strokeWidth={dotsize / 2} fill="invisible"
-                    onPointerDown={(e) => { formatInstance.addPoints(pts.X, pts.Y, apoints, i, controlPoints); }} pointerEvents="all" cursor="all-scroll"
+                <circle cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} r={strokeWidth / 2} stroke={this._overAddPoint === i ? "#1F85DE" : "invisible"} strokeWidth={dotsize / 4} fill={this._overAddPoint === i ? "#1F85DE" : "invisible"}
+                    onPointerDown={(e) => { formatInstance.addPoints(pts.X, pts.Y, apoints, i, controlPoints); }} onMouseEnter={() => this.onPointerEnter(i)} onMouseLeave={this.onPointerLeave} pointerEvents="all" cursor="all-scroll"
                 />
             </svg>);
         // Blue circles that allow the user to edit the curvature of the line using the selected control point as the anchor.
-- 
cgit v1.2.3-70-g09d2


From a0207bf861908da9235a1752a723e69ecdbba734 Mon Sep 17 00:00:00 2001
From: vkalev <vjk1883@gmail.com>
Date: Tue, 6 Jul 2021 12:45:37 -0500
Subject: refactoring

---
 src/client/documents/Documents.ts                  |   8 +-
 src/client/views/GestureOverlay.tsx                |   2 +-
 src/client/views/GlobalKeyHandler.ts               |   2 +-
 src/client/views/InkControl.tsx                    | 101 --------
 src/client/views/InkControls.tsx                   | 118 +++++++++
 src/client/views/InkHandles.tsx                    |  84 +++++++
 src/client/views/InkStroke.scss                    |  11 +
 src/client/views/InkStroke.tsx                     | 187 ++++++++++++++
 src/client/views/InkStrokeProperties.ts            | 205 +++++-----------
 src/client/views/InkingStroke.scss                 |  11 -
 src/client/views/InkingStroke.tsx                  | 271 ---------------------
 src/client/views/PropertiesButtons.tsx             |   4 +-
 src/client/views/PropertiesView.tsx                |   4 +-
 src/client/views/collections/CollectionMenu.tsx    |   2 +-
 .../collectionFreeForm/CollectionFreeFormView.tsx  |   2 +-
 .../views/nodes/CollectionFreeFormDocumentView.tsx |   4 +-
 src/client/views/nodes/ColorBox.tsx                |   2 +-
 src/client/views/nodes/DocumentContentsView.tsx    |   4 +-
 src/client/views/nodes/DocumentView.tsx            |   6 +-
 19 files changed, 478 insertions(+), 550 deletions(-)
 delete mode 100644 src/client/views/InkControl.tsx
 create mode 100644 src/client/views/InkControls.tsx
 create mode 100644 src/client/views/InkHandles.tsx
 create mode 100644 src/client/views/InkStroke.scss
 create mode 100644 src/client/views/InkStroke.tsx
 delete mode 100644 src/client/views/InkingStroke.scss
 delete mode 100644 src/client/views/InkingStroke.tsx

(limited to 'src')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 24682cbd0..188fe31c0 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -31,7 +31,7 @@ import { CollectionView, CollectionViewType } from "../views/collections/Collect
 import { ContextMenu } from "../views/ContextMenu";
 import { ContextMenuProps } from "../views/ContextMenuItem";
 import { DFLT_IMAGE_NATIVE_DIM } from "../views/globalCssVariables.scss";
-import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth, InkingStroke } from "../views/InkingStroke";
+import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth, InkStroke } from "../views/InkStroke";
 import { AudioBox } from "../views/nodes/AudioBox";
 import { ColorBox } from "../views/nodes/ColorBox";
 import { ComparisonBox } from "../views/nodes/ComparisonBox";
@@ -432,7 +432,7 @@ export namespace Docs {
                 options: { links: ComputedField.MakeFunction("links(self)") as any, hideLinkButton: true }
             }],
             [DocumentType.INK, {
-                layout: { view: InkingStroke, dataField: defaultDataKey },
+                layout: { view: InkStroke, dataField: defaultDataKey },
                 options: { _fontFamily: "cursive", backgroundColor: "transparent", links: ComputedField.MakeFunction("links(self)") as any }
             }],
             [DocumentType.SCREENSHOT, {
@@ -760,7 +760,7 @@ export namespace Docs {
             const I = new Doc();
             I[Initializing] = true;
             I.type = DocumentType.INK;
-            I.layout = InkingStroke.LayoutString("data");
+            I.layout = InkStroke.LayoutString("data");
             I.color = color;
             I.fillColor = fillColor;
             I.strokeWidth = Number(strokeWidth);
@@ -1144,7 +1144,7 @@ export namespace DocUtils {
             layout = AudioBox.LayoutString;
         } else if (field instanceof InkField) {
             created = Docs.Create.InkDocument(ActiveInkColor(), CurrentUserUtils.SelectedTool, ActiveInkWidth(), ActiveInkBezierApprox(), ActiveFillColor(), ActiveArrowStart(), ActiveArrowEnd(), ActiveDash(), (field).inkData, resolved);
-            layout = InkingStroke.LayoutString;
+            layout = InkStroke.LayoutString;
         } else if (field instanceof List && field[0] instanceof Doc) {
             created = Docs.Create.StackingDocument(DocListCast(field), resolved);
             layout = CollectionView.LayoutString;
diff --git a/src/client/views/GestureOverlay.tsx b/src/client/views/GestureOverlay.tsx
index 491bf18b2..455b3a935 100644
--- a/src/client/views/GestureOverlay.tsx
+++ b/src/client/views/GestureOverlay.tsx
@@ -17,7 +17,7 @@ import { Scripting } from "../util/Scripting";
 import { Transform } from "../util/Transform";
 import { CollectionFreeFormViewChrome } from "./collections/CollectionMenu";
 import "./GestureOverlay.scss";
-import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth, SetActiveArrowStart, SetActiveDash, SetActiveFillColor, SetActiveInkColor, SetActiveInkWidth } from "./InkingStroke";
+import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth, SetActiveArrowStart, SetActiveDash, SetActiveFillColor, SetActiveInkColor, SetActiveInkWidth } from "./InkStroke";
 import { DocumentView } from "./nodes/DocumentView";
 import { RadialMenu } from "./nodes/RadialMenu";
 import HorizontalPalette from "./Palette";
diff --git a/src/client/views/GlobalKeyHandler.ts b/src/client/views/GlobalKeyHandler.ts
index cbaa706e0..c1130ce61 100644
--- a/src/client/views/GlobalKeyHandler.ts
+++ b/src/client/views/GlobalKeyHandler.ts
@@ -116,7 +116,7 @@ export class KeyManager {
             case "escape":
                 DocumentLinksButton.StartLink = undefined;
                 DocumentLinksButton.StartLinkView = undefined;
-                InkStrokeProperties.Instance && (InkStrokeProperties.Instance._controlBtn = false);
+                InkStrokeProperties.Instance && (InkStrokeProperties.Instance._controlButton = false);
                 CurrentUserUtils.SelectedTool = InkTool.None;
                 var doDeselect = true;
                 if (SnappingManager.GetIsDragging()) {
diff --git a/src/client/views/InkControl.tsx b/src/client/views/InkControl.tsx
deleted file mode 100644
index accb16f61..000000000
--- a/src/client/views/InkControl.tsx
+++ /dev/null
@@ -1,101 +0,0 @@
-import React = require("react");
-import { observable, action } from "mobx";
-import { observer } from "mobx-react";
-import { InkStrokeProperties } from "./InkStrokeProperties";
-import { setupMoveUpEvents, emptyFunction } from "../../Utils";
-import { UndoManager } from "../util/UndoManager";
-import { ControlPoint } from "../../fields/InkField";
-import { Transform } from "../util/Transform";
-
-export interface InkControlProps {
-    control: ControlPoint;
-    left: number;
-    top: number;
-    scaleX: number;
-    scaleY: number;
-    strokeWidth: number;
-    ScreenToLocalTransform: () => Transform;
-}
-
-@observer
-export class InkControl extends React.Component<InkControlProps> {
-    @observable private _overControl = false;
-
-    @action
-    onPointerEnter = () => {
-        this._overControl = true;
-    }
-
-    @action
-    onPointerLeave = () => {
-        this._overControl = false;
-    }
-
-    /**
-     * Handles the movement of a selected control point when the user clicks and drags.
-     * @param controlNum The index of the currently selected control point.
-     */
-    @action
-    onControlDown = (e: React.PointerEvent, controlNum: number): void => {
-        if (InkStrokeProperties.Instance) {
-            InkStrokeProperties.Instance.moveControl(0, 0, 1);
-            const controlUndo = UndoManager.StartBatch("DocDecs set radius");
-            const screenScale = this.props.ScreenToLocalTransform().Scale;
-            setupMoveUpEvents(this, e,
-                (e: PointerEvent, down: number[], delta: number[]) => {
-                    InkStrokeProperties.Instance?.moveControl(-delta[0] * screenScale, -delta[1] * screenScale, controlNum);
-                    return false;
-                },
-                () => controlUndo?.end(), emptyFunction);
-        }
-    }
-
-    /**
-     * Deletes the currently selected point.
-     */
-    @action
-    onDelete = (e: KeyboardEvent) => {
-        if (["-", "Backspace", "Delete"].includes(e.key)) {
-            if (InkStrokeProperties.Instance?.deletePoints()) e.stopPropagation();
-        }
-    }
-
-    /**
-     * Changes the current selected control point.
-     */
-    @action
-    changeCurrPoint = (i: number) => {
-        if (InkStrokeProperties.Instance) {
-            InkStrokeProperties.Instance._currPoint = i;
-            document.addEventListener("keydown", this.onDelete, true);
-        }
-    }
- 
-
-    render() {
-        const control = this.props.control;
-        const left = this.props.left;
-        const top = this.props.top;
-        const scaleX = this.props.scaleX;
-        const scaleY = this.props.scaleY;
-        const strokeWidth = this.props.strokeWidth;
-
-        return (
-            <svg height="10" width="10" key={`ctrl${control.I}`}>
-                <rect 
-                    x={(control.X - left - strokeWidth / 2) * scaleX} 
-                    y={(control.Y - top - strokeWidth / 2) * scaleY} 
-                    height={this._overControl ? strokeWidth * 1.5 : strokeWidth} 
-                    width={this._overControl ? strokeWidth * 1.5 : strokeWidth} 
-                    strokeWidth={strokeWidth / 6} stroke="#1F85DE" 
-                    fill={InkStrokeProperties.Instance?._currPoint === control.I ? "#1F85DE" : "white"}
-                    onPointerDown={(e) => { this.changeCurrPoint(control.I); this.onControlDown(e, control.I); }} 
-                    onMouseEnter={this.onPointerEnter} 
-                    onMouseLeave={this.onPointerLeave} 
-                    pointerEvents="all" 
-                    cursor="default"
-                />
-            </svg>
-        )
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/InkControls.tsx b/src/client/views/InkControls.tsx
new file mode 100644
index 000000000..eeddfce4c
--- /dev/null
+++ b/src/client/views/InkControls.tsx
@@ -0,0 +1,118 @@
+import React = require("react");
+import { observable, action } from "mobx";
+import { observer } from "mobx-react";
+import { InkStrokeProperties } from "./InkStrokeProperties";
+import { setupMoveUpEvents, emptyFunction } from "../../Utils";
+import { UndoManager } from "../util/UndoManager";
+import { ControlPoint, InkData, PointData } from "../../fields/InkField";
+import { Transform } from "../util/Transform";
+
+export interface InkControlProps {
+    data: InkData;
+    addedPoints: PointData[];
+    format: number[];
+    ScreenToLocalTransform: () => Transform;
+}
+
+@observer
+export class InkControls extends React.Component<InkControlProps> {
+    // @observable private _controlPoints: ControlPoint[] = [];
+    @observable private _overControl = -1;
+    @observable private _overAddPoint = -1;
+
+    /**
+     * Handles the movement of a selected control point when the user clicks and drags.
+     * @param controlNum The index of the currently selected control point.
+     */
+    @action
+    onControlDown = (e: React.PointerEvent, controlNum: number): void => {
+        if (InkStrokeProperties.Instance) {
+            InkStrokeProperties.Instance.moveControl(0, 0, 1);
+            const controlUndo = UndoManager.StartBatch("DocDecs set radius");
+            const screenScale = this.props.ScreenToLocalTransform().Scale;
+            setupMoveUpEvents(this, e,
+                (e: PointerEvent, down: number[], delta: number[]) => {
+                    InkStrokeProperties.Instance?.moveControl(-delta[0] * screenScale, -delta[1] * screenScale, controlNum);
+                    return false;
+                },
+                () => controlUndo?.end(), emptyFunction);
+        }
+    }
+
+    /**
+     * Deletes the currently selected point.
+     */
+    @action
+    onDelete = (e: KeyboardEvent) => {
+        if (["-", "Backspace", "Delete"].includes(e.key)) {
+            if (InkStrokeProperties.Instance?.deletePoints()) e.stopPropagation();
+        }
+    }
+
+    /**
+     * Changes the current selected control point.
+     */
+    @action
+    changeCurrPoint = (i: number) => {
+        if (InkStrokeProperties.Instance) {
+            InkStrokeProperties.Instance._currentPoint = i;
+            document.addEventListener("keydown", this.onDelete, true);
+        }
+    }
+
+    @action onEnterControl = (i: number) => { this._overControl = i; };
+    @action onLeaveControl = () => { this._overControl = -1; };
+    @action onEnterAddPoint = (i: number) => { this._overAddPoint = i; };
+    @action onLeaveAddPoint = () => { this._overAddPoint = -1; };
+ 
+    render() {
+        const data = this.props.data;
+        const controlPoints: ControlPoint[] = [];
+        if (data.length >= 4) {
+            for (let i = 0; i <= data.length - 4; i += 4) {
+                controlPoints.push({ X: data[i].X, Y: data[i].Y, I: i });
+                controlPoints.push({ X: data[i + 3].X, Y: data[i + 3].Y, I: i + 3 });
+            }
+        }
+        const addedPoints = this.props.addedPoints;
+        const [left, top, scaleX, scaleY, strokeWidth, dotsize] = this.props.format;
+
+        return (
+            <>
+                {addedPoints.map((pts, i) =>
+                    <svg height="10" width="10" key={`add${i}`}>
+                        <circle 
+                            cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} 
+                            cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} 
+                            r={strokeWidth / 2} 
+                            stroke={this._overAddPoint === i ? "#1F85DE" : "transparent"} 
+                            strokeWidth={dotsize / 4} fill={this._overAddPoint === i ? "#1F85DE" : "transparent"}
+                            onPointerDown={() => { InkStrokeProperties.Instance?.addPoints(pts.X, pts.Y, addedPoints, i, controlPoints); }} 
+                            onMouseEnter={() => this.onEnterAddPoint(i)} 
+                            onMouseLeave={this.onLeaveAddPoint} 
+                            pointerEvents="all" 
+                            cursor="all-scroll"
+                        />
+                    </svg>
+                )}
+                {controlPoints.map((control, i) =>
+                    <svg height="10" width="10" key={`ctrl${i}`}>
+                        <rect 
+                            x={(control.X - left - strokeWidth / 2) * scaleX} 
+                            y={(control.Y - top - strokeWidth / 2) * scaleY} 
+                            height={this._overControl === i ? strokeWidth * 1.5 : strokeWidth} 
+                            width={this._overControl === i ? strokeWidth * 1.5 : strokeWidth} 
+                            strokeWidth={strokeWidth / 6} stroke="#1F85DE" 
+                            fill={InkStrokeProperties.Instance?._currentPoint === control.I ? "#1F85DE" : "white"}
+                            onPointerDown={(e) => { this.changeCurrPoint(control.I); this.onControlDown(e, control.I); }} 
+                            onMouseEnter={() => this.onEnterControl(i)} 
+                            onMouseLeave={this.onLeaveControl} 
+                            pointerEvents="all" 
+                            cursor="default"
+                        />
+                    </svg>
+                )}
+            </>
+        );
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/InkHandles.tsx b/src/client/views/InkHandles.tsx
new file mode 100644
index 000000000..c2163c124
--- /dev/null
+++ b/src/client/views/InkHandles.tsx
@@ -0,0 +1,84 @@
+import React = require("react");
+import { observable, action } from "mobx";
+import { observer } from "mobx-react";
+import { InkStrokeProperties } from "./InkStrokeProperties";
+import { setupMoveUpEvents, emptyFunction } from "../../Utils";
+import { UndoManager } from "../util/UndoManager";
+import { InkData, HandlePoint, HandleLine } from "../../fields/InkField";
+import { Transform } from "../util/Transform";
+
+export interface InkControlProps {
+    data: InkData;
+    format: number[];
+    ScreenToLocalTransform: () => Transform;
+}
+
+@observer
+export class InkHandles extends React.Component<InkControlProps> {
+    /**
+     * Handles the movement of a selected handle point when the user clicks and drags.
+     * @param handleNum The index of the currently selected handle point.
+     */
+     onHandleDown = (e: React.PointerEvent, handleNum: number): void => {
+        if (InkStrokeProperties.Instance) {
+            InkStrokeProperties.Instance.moveControl(0, 0, 1);
+            const controlUndo = UndoManager.StartBatch("DocDecs set radius");
+            const screenScale = this.props.ScreenToLocalTransform().Scale;
+            setupMoveUpEvents(this, e, (e: PointerEvent, down: number[], delta: number[]) => {
+                    InkStrokeProperties.Instance?.moveHandle(-delta[0] * screenScale, -delta[1] * screenScale, handleNum);
+                    return false;
+                }, () => controlUndo?.end(), emptyFunction
+            );
+        }
+    }
+ 
+    render() {
+        const formatInstance = InkStrokeProperties.Instance;
+        if (!formatInstance) return (null);
+        const data = this.props.data;
+        const handlePoints: HandlePoint[] = [];
+        const handleLines: HandleLine[] = [];
+        if (data.length >= 4) {
+            // adding first and last (single) handle lines
+            handleLines.push({ X1: data[0].X, Y1: data[0].Y, X2: data[1].X, Y2: data[1].Y, dot1: 0, dot2: 0 });
+            handleLines.push({ X1: data[data.length - 2].X, Y1: data[data.length - 2].Y, X2: data[data.length - 1].X, Y2: data[data.length - 1].Y, dot1: data.length - 1, dot2: data.length - 1 });
+            for (let i = 0; i <= data.length - 4; i += 4) {
+                handlePoints.push({ X: data[i + 1].X, Y: data[i + 1].Y, I: i + 1, dot1: i, dot2: i === 0 ? i : i - 1 });
+                handlePoints.push({ X: data[i + 2].X, Y: data[i + 2].Y, I: i + 2, dot1: i + 3, dot2: i === data.length ? i + 3 : i + 4 });
+            }
+            for (let i = 2; i < data.length - 4; i += 4) {
+                handleLines.push({ X1: data[i].X, Y1: data[i].Y, X2: data[i + 3].X, Y2: data[i + 3].Y, dot1: i + 1, dot2: i + 2 });
+            }
+        }
+        const [left, top, scaleX, scaleY, strokeWidth, dotsize] = this.props.format;
+
+        return (
+            <>
+                {handlePoints.map((pts, i) =>
+                    <svg height="10" width="10" key={`hdl${i}`}>
+                        <circle 
+                            cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} 
+                            cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} 
+                            r={strokeWidth / 2} 
+                            strokeWidth={0} 
+                            fill="#1F85DE"
+                            onPointerDown={(e) => this.onHandleDown(e, pts.I)} 
+                            pointerEvents="all" 
+                            cursor="default" 
+                            display={(pts.dot1 === formatInstance._currentPoint || pts.dot2 === formatInstance._currentPoint) ? "inherit" : "none"} />
+                    </svg>)}
+                {handleLines.map((pts, i) =>
+                    <svg height="100" width="100" key={`line${i}`}>
+                        <line 
+                            x1={(pts.X1 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} 
+                            y1={(pts.Y1 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
+                            x2={(pts.X2 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} 
+                            y2={(pts.Y2 - top - strokeWidth / 2) * scaleY + strokeWidth / 2} 
+                            stroke="#1F85DE" 
+                            strokeWidth={dotsize / 8}
+                            display={(pts.dot1 === formatInstance._currentPoint || pts.dot2 === formatInstance._currentPoint) ? "inherit" : "none"} />
+                    </svg>)}
+            </>
+        );
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/InkStroke.scss b/src/client/views/InkStroke.scss
new file mode 100644
index 000000000..812a79bd5
--- /dev/null
+++ b/src/client/views/InkStroke.scss
@@ -0,0 +1,11 @@
+.inkStroke {
+  mix-blend-mode: multiply;
+  stroke-linejoin: round;
+  stroke-linecap: round;
+  overflow: visible !important;
+  transform-origin: top left;
+
+  svg:not(:root) {
+    overflow: visible !important;
+  }
+}
diff --git a/src/client/views/InkStroke.tsx b/src/client/views/InkStroke.tsx
new file mode 100644
index 000000000..9ca8bdbea
--- /dev/null
+++ b/src/client/views/InkStroke.tsx
@@ -0,0 +1,187 @@
+import React = require("react");
+import { action, observable } from "mobx";
+import { observer } from "mobx-react";
+import { Doc } from "../../fields/Doc";
+import { documentSchema } from "../../fields/documentSchemas";
+import { InkData, InkField, InkTool, ControlPoint, HandlePoint, HandleLine } from "../../fields/InkField";
+import { makeInterface } from "../../fields/Schema";
+import { Cast, StrCast } from "../../fields/Types";
+import { TraceMobx } from "../../fields/util";
+import { setupMoveUpEvents, emptyFunction, returnFalse } from "../../Utils";
+import { CognitiveServices } from "../cognitive_services/CognitiveServices";
+import { InteractionUtils } from "../util/InteractionUtils";
+import { Scripting } from "../util/Scripting";
+import { UndoManager } from "../util/UndoManager";
+import { ContextMenu } from "./ContextMenu";
+import { ViewBoxBaseComponent } from "./DocComponent";
+import "./InkStroke.scss";
+import { FieldView, FieldViewProps } from "./nodes/FieldView";
+import { InkStrokeProperties } from "./InkStrokeProperties";
+import { CurrentUserUtils } from "../util/CurrentUserUtils";
+import { InkControls } from "./InkControls";
+import { InkHandles } from "./InkHandles";
+
+type InkDocument = makeInterface<[typeof documentSchema]>;
+const InkDocument = makeInterface(documentSchema);
+
+@observer
+export class InkStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocument>(InkDocument) {
+    static readonly MaskDim = 50000;
+    @observable private _properties?: InkStrokeProperties;
+
+    constructor(props: FieldViewProps & InkDocument) {
+        super(props);
+
+        this._properties = InkStrokeProperties.Instance;
+    }
+
+    public static LayoutString(fieldStr: string) { 
+        return FieldView.LayoutString(InkStroke, fieldStr); 
+    }
+
+    analyzeStrokes() {
+        const data: InkData = Cast(this.dataDoc[this.fieldKey], InkField)?.inkData ?? [];
+        CognitiveServices.Inking.Appliers.ConcatenateHandwriting(this.dataDoc, ["inkAnalysis", "handwriting"], [data]);
+    }
+
+    @action
+    public static toggleMask = (inkDoc: Doc) => {
+        inkDoc.isInkMask = !inkDoc.isInkMask;
+        inkDoc._backgroundColor = inkDoc.isInkMask ? "rgba(0,0,0,0.7)" : undefined;
+        inkDoc.mixBlendMode = inkDoc.isInkMask ? "hard-light" : undefined;
+        inkDoc.color = "#9b9b9bff";
+        inkDoc._stayInCollection = inkDoc.isInkMask ? true : undefined;
+    }
+
+    /**
+     * Handles the movement of the entire ink object when the user clicks and drags.
+     * @param e React Pointer Event.
+     */
+    onPointerDown = (e: React.PointerEvent) => {
+        if (this.props.isSelected(true)) {
+            setupMoveUpEvents(this, e, returnFalse, emptyFunction, 
+                action((e: PointerEvent, doubleTap: boolean | undefined) =>
+                doubleTap && this._properties && (this._properties._controlButton = true))
+            );
+        }
+    }
+
+    render() {
+        TraceMobx();
+
+        const data: InkData = Cast(this.dataDoc[this.fieldKey], InkField)?.inkData ?? [];
+        const strokeWidth = Number(this.layoutDoc.strokeWidth);
+        const lineTop = Math.min(...data.map(p => p.Y));
+        const lineBottom = Math.max(...data.map(p => p.Y));
+        const lineLeft = Math.min(...data.map(p => p.X));
+        const lineRight = Math.max(...data.map(p => p.X));
+        const left = lineLeft - strokeWidth / 2;
+        const top = lineTop - strokeWidth / 2;
+        const right = lineRight + strokeWidth / 2;
+        const bottom = lineBottom + strokeWidth / 2;
+        const width = Math.max(1, right - left);
+        const height = Math.max(1, bottom - top);
+        const scaleX = width === strokeWidth ? 1 : (this.props.PanelWidth() - strokeWidth) / (width - strokeWidth);
+        const scaleY = height === strokeWidth ? 1 : (this.props.PanelHeight() - strokeWidth) / (height - strokeWidth);
+        const strokeColor = StrCast(this.layoutDoc.color, "");
+        const dotsize = Math.max(width * scaleX, height * scaleY) / 40;
+
+        // Visually renders the polygonal line made by the user.
+        const inkLine = InteractionUtils.CreatePolyline(data, left, top, strokeColor, strokeWidth, strokeWidth, 
+            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"), 
+            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker), 
+            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", 
+            this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1, 
+            false);
+        const selectedLine = InteractionUtils.CreatePolyline(
+            data, lineLeft - strokeWidth * 3, lineTop - strokeWidth * 3, "#1F85DE", strokeWidth / 6, 
+            strokeWidth / 6,StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
+            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
+            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", 
+            this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1, 
+            false);
+        // Invisible polygonal line that enables the ink to be selected by the user.
+        const clickableLine = InteractionUtils.CreatePolyline(data, left, top, 
+            this.props.isSelected() && strokeWidth > 5 ? strokeColor : "transparent", strokeWidth, 
+            strokeWidth + 15, StrCast(this.layoutDoc.strokeBezier), 
+            StrCast(this.layoutDoc.fillColor, "none"), "none", "none", undefined, scaleX, scaleY, "", 
+            this.props.layerProvider?.(this.props.Document) === false ? "none" : "visiblepainted", false, true);
+        const addedPoints = InteractionUtils.CreatePoints(data, left, top, strokeColor, strokeWidth, strokeWidth,
+            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
+            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
+            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", 
+            this.props.isSelected() && strokeWidth <= 5, false);
+
+        return (
+            <svg className="inkStroke"
+                style={{
+                    pointerEvents: this.props.Document.isInkMask && this.props.layerProvider?.(this.props.Document) !== false ? "all" : "none",
+                    transform: this.props.Document.isInkMask ? `translate(${InkStroke.MaskDim / 2}px, ${InkStroke.MaskDim / 2}px)` : undefined,
+                    mixBlendMode: this.layoutDoc.tool === InkTool.Highlighter ? "multiply" : "unset",
+                    overflow: "visible",
+                }}
+                onPointerDown={this.onPointerDown}
+                onContextMenu={() => {
+                    const cm = ContextMenu.Instance;
+                    if (cm) {
+                        !Doc.UserDoc().noviceMode && cm.addItem({ description: "Recognize Writing", event: this.analyzeStrokes, icon: "paint-brush" });
+                        cm.addItem({ description: "Toggle Mask", event: () => InkStroke.toggleMask(this.rootDoc), icon: "paint-brush" });
+                        cm.addItem({ description: "Edit Points", event: action(() => {if (this._properties) { this._properties._controlButton = !this._properties._controlButton; }} ), icon: "paint-brush" });
+                    }
+                }}
+            >
+                
+                {clickableLine}
+                {inkLine}
+                {this.props.isSelected() ? selectedLine : ""}
+                {this.props.isSelected() && this._properties?._controlButton ? 
+                    <>
+                        <InkControls 
+                            data={data} 
+                            addedPoints={addedPoints} 
+                            format={[left, top, scaleX, scaleY, strokeWidth, dotsize]} 
+                            ScreenToLocalTransform={this.props.ScreenToLocalTransform} />
+                        <InkHandles 
+                            data={data} 
+                            format={[left, top, scaleX, scaleY, strokeWidth, dotsize]} 
+                            ScreenToLocalTransform={this.props.ScreenToLocalTransform} /> 
+                    </> : ""}
+            </svg>
+        );
+    }
+}
+
+
+export function SetActiveInkWidth(width: string): void { !isNaN(parseInt(width)) && ActiveInkPen() && (ActiveInkPen().activeInkWidth = width); }
+export function SetActiveBezierApprox(bezier: string): void { ActiveInkPen() && (ActiveInkPen().activeInkBezier = isNaN(parseInt(bezier)) ? "" : bezier); }
+export function SetActiveInkColor(value: string) { ActiveInkPen() && (ActiveInkPen().activeInkColor = value); }
+export function SetActiveFillColor(value: string) { ActiveInkPen() && (ActiveInkPen().activeFillColor = value); }
+export function SetActiveArrowStart(value: string) { ActiveInkPen() && (ActiveInkPen().activeArrowStart = value); }
+export function SetActiveArrowEnd(value: string) { ActiveInkPen() && (ActiveInkPen().activeArrowEnd = value); }
+export function SetActiveDash(dash: string): void { !isNaN(parseInt(dash)) && ActiveInkPen() && (ActiveInkPen().activeDash = dash); }
+export function ActiveInkPen(): Doc { return Doc.UserDoc(); }
+export function ActiveInkColor(): string { return StrCast(ActiveInkPen()?.activeInkColor, "black"); }
+export function ActiveFillColor(): string { return StrCast(ActiveInkPen()?.activeFillColor, ""); }
+export function ActiveArrowStart(): string { return StrCast(ActiveInkPen()?.activeArrowStart, ""); }
+export function ActiveArrowEnd(): string { return StrCast(ActiveInkPen()?.activeArrowEnd, ""); }
+export function ActiveDash(): string { return StrCast(ActiveInkPen()?.activeDash, "0"); }
+export function ActiveInkWidth(): string { return StrCast(ActiveInkPen()?.activeInkWidth, "1"); }
+export function ActiveInkBezierApprox(): string { return StrCast(ActiveInkPen()?.activeInkBezier); }
+Scripting.addGlobal(function activateBrush(pen: any, width: any, color: any, fill: any, arrowStart: any, arrowEnd: any, dash: any) {
+    CurrentUserUtils.SelectedTool = pen ? InkTool.Highlighter : InkTool.None;
+    SetActiveInkWidth(width);
+    SetActiveInkColor(color);
+    SetActiveFillColor(fill);
+    SetActiveArrowStart(arrowStart);
+    SetActiveArrowEnd(arrowEnd);
+    SetActiveDash(dash);
+});
+Scripting.addGlobal(function activateEraser(pen: any) { return CurrentUserUtils.SelectedTool = pen ? InkTool.Eraser : InkTool.None; });
+Scripting.addGlobal(function activateStamp(pen: any) { return CurrentUserUtils.SelectedTool = pen ? InkTool.Stamp : InkTool.None; });
+Scripting.addGlobal(function deactivateInk() { return CurrentUserUtils.SelectedTool = InkTool.None; });
+Scripting.addGlobal(function setInkWidth(width: any) { return SetActiveInkWidth(width); });
+Scripting.addGlobal(function setInkColor(color: any) { return SetActiveInkColor(color); });
+Scripting.addGlobal(function setFillColor(fill: any) { return SetActiveFillColor(fill); });
+Scripting.addGlobal(function setActiveArrowStart(arrowStart: any) { return SetActiveArrowStart(arrowStart); });
+Scripting.addGlobal(function setActiveArrowEnd(arrowEnd: any) { return SetActiveArrowStart(arrowEnd); });
+Scripting.addGlobal(function setActiveDash(dash: any) { return SetActiveDash(dash); });
diff --git a/src/client/views/InkStrokeProperties.ts b/src/client/views/InkStrokeProperties.ts
index 720a89334..a5c028730 100644
--- a/src/client/views/InkStrokeProperties.ts
+++ b/src/client/views/InkStrokeProperties.ts
@@ -1,5 +1,4 @@
 import { action, computed, observable } from "mobx";
-import { ColorState } from 'react-color';
 import { Doc, Field, Opt } from "../../fields/Doc";
 import { Document } from "../../fields/documentSchemas";
 import { InkField, InkData, PointData } from "../../fields/InkField";
@@ -11,80 +10,62 @@ import { undoBatch } from "../util/UndoManager";
 export class InkStrokeProperties {
     static Instance: InkStrokeProperties | undefined;
 
-    private _lastFill = "#D0021B";
-    private _lastLine = "#D0021B";
-    private _lastDash = "2";
-
     @observable _lock = false;
-    @observable _controlBtn = false;
-    @observable _currPoint = -1;
+    @observable _controlButton = false;
+    @observable _currentPoint = -1;
 
     constructor() {
         InkStrokeProperties.Instance = this;
     }
 
+    @computed get selectedInk() {
+        const inks = SelectionManager.Views().filter(i => Document(i.rootDoc).type === DocumentType.INK);
+        return inks.length ? inks : undefined;
+    }
+
     getField(key: string) {
         return this.selectedInk?.reduce((p, i) =>
             (p === undefined || (p && p === i.rootDoc[key])) && i.rootDoc[key] !== "0" ? Field.toString(i.rootDoc[key] as Field) : "", undefined as Opt<string>);
     }
 
-    @computed get selectedInk() {
-        const inks = SelectionManager.Views().filter(i => Document(i.rootDoc).type === DocumentType.INK);
-        return inks.length ? inks : undefined;
+    /**
+     * Helper function that enables other functions to be applied to a particular ink instance.
+     * @param func The inputted function.
+     * @param requireCurrPoint Indicates whether the current selected point is needed.
+     */
+     applyFunction = (func: (doc: Doc, ink: InkData, ptsXscale: number, ptsYscale: number) => { X: number, Y: number }[] | undefined, requireCurrPoint: boolean = false) => {
+        var appliedFunc = false;
+        this.selectedInk?.forEach(action(inkView => {
+            if (this.selectedInk?.length === 1 && (!requireCurrPoint || this._currentPoint !== -1)) {
+                const doc = Document(inkView.rootDoc);
+                if (doc.type === DocumentType.INK && doc.width && doc.height) {
+                    const ink = Cast(doc.data, InkField)?.inkData;
+                    if (ink) {
+                        const oldXrange = (xs => ({ coord: NumCast(doc.x), min: Math.min(...xs), max: Math.max(...xs) }))(ink.map(p => p.X));
+                        const oldYrange = (ys => ({ coord: NumCast(doc.y), min: Math.min(...ys), max: Math.max(...ys) }))(ink.map(p => p.Y));
+                        const ptsXscale = NumCast(doc._width) / (oldXrange.max - oldXrange.min);
+                        const ptsYscale = NumCast(doc._height) / (oldYrange.max - oldYrange.min);
+                        const newPoints = func(doc, ink, ptsXscale, ptsYscale);
+                        if (newPoints) {
+                            const newXrange = (xs => ({ min: Math.min(...xs), max: Math.max(...xs) }))(newPoints.map(p => p.X));
+                            const newYrange = (ys => ({ min: Math.min(...ys), max: Math.max(...ys) }))(newPoints.map(p => p.Y));
+                            doc._width = (newXrange.max - newXrange.min) * ptsXscale;
+                            doc._height = (newYrange.max - newYrange.min) * ptsYscale;
+                            doc.x = (oldXrange.coord + (newXrange.min - oldXrange.min) * ptsXscale);
+                            doc.y = (oldYrange.coord + (newYrange.min - oldYrange.min) * ptsYscale);
+                            Doc.GetProto(doc).data = new InkField(newPoints);
+                            appliedFunc = true;
+                        }
+                    }
+                }
+            }
+        }));
+        return appliedFunc;
     }
 
-    // @computed get unFilled() { return this.selectedInk?.reduce((p, i) => p && !i.rootDoc.fillColor ? true : false, true) || false; }
-    // @computed get unStrokd() { return this.selectedInk?.reduce((p, i) => p && !i.rootDoc.color ? true : false, true) || false; }
-    // @computed get solidFil() { return this.selectedInk?.reduce((p, i) => p && i.rootDoc.fillColor ? true : false, true) || false; }
-    // @computed get solidStk() { return this.selectedInk?.reduce((p, i) => p && i.rootDoc.color && (!i.rootDoc.strokeDash || i.rootDoc.strokeDash === "0") ? true : false, true) || false; }
-    // @computed get dashdStk() { return !this.unStrokd && this.getField("strokeDash") || ""; }
-    // @computed get colorFil() { const ccol = this.getField("fillColor") || ""; ccol && (this._lastFill = ccol); return ccol; }
-    // @computed get colorStk() { const ccol = this.getField("color") || ""; ccol && (this._lastLine = ccol); return ccol; }
-    // @computed get widthStk() { return this.getField("strokeWidth") || "1"; }
-    // @computed get markHead() { return this.getField("strokeStartMarker") || ""; }
-    // @computed get markTail() { return this.getField("strokeEndMarker") || ""; }
-    // @computed get shapeHgt() { return this.getField("_height"); }
-    // @computed get shapeWid() { return this.getField("_width"); }
-    // @computed get shapeXps() { return this.getField("x"); }
-    // @computed get shapeYps() { return this.getField("y"); }
-    // @computed get shapeRot() { return this.getField("rotation"); }
-    // set unFilled(value) { this.colorFil = value ? "" : this._lastFill; }
-    // set solidFil(value) { this.unFilled = !value; }
-    // set colorFil(value) { value && (this._lastFill = value); this.selectedInk?.forEach(i => i.rootDoc.fillColor = value ? value : undefined); }
-    // set colorStk(value) { value && (this._lastLine = value); this.selectedInk?.forEach(i => i.rootDoc.color = value ? value : undefined); }
-    // set markHead(value) { this.selectedInk?.forEach(i => i.rootDoc.strokeStartMarker = value); }
-    // set markTail(value) { this.selectedInk?.forEach(i => i.rootDoc.strokeEndMarker = value); }
-    // set unStrokd(value) { this.colorStk = value ? "" : this._lastLine; }
-    // set solidStk(value) { this.dashdStk = ""; this.unStrokd = !value; }
-    // set dashdStk(value) {
-    //     value && (this._lastDash = value) && (this.unStrokd = false);
-    //     this.selectedInk?.forEach(i => i.rootDoc.strokeDash = value ? this._lastDash : undefined);
-    // }
-    // set shapeXps(value) { this.selectedInk?.forEach(i => i.rootDoc.x = Number(value)); }
-    // set shapeYps(value) { this.selectedInk?.forEach(i => i.rootDoc.y = Number(value)); }
-    // set shapeRot(value) { this.selectedInk?.forEach(i => i.rootDoc.rotation = Number(value)); }
-    // set widthStk(value) { this.selectedInk?.forEach(i => i.rootDoc.strokeWidth = Number(value)); }
-    // set shapeWid(value) {
-    //     this.selectedInk?.filter(i => i.rootDoc._width && i.rootDoc._height).forEach(i => {
-    //         const oldWidth = NumCast(i.rootDoc._width);
-    //         i.rootDoc._width = Number(value);
-    //         this._lock && (i.rootDoc._height = (i.rootDoc._width * NumCast(i.rootDoc._height)) / oldWidth);
-    //     });
-    // }
-    // set shapeHgt(value) {
-    //     this.selectedInk?.filter(i => i.rootDoc._width && i.rootDoc._height).forEach(i => {
-    //         const oldHeight = NumCast(i.rootDoc._height);
-    //         i.rootDoc._height = Number(value);
-    //         this._lock && (i.rootDoc._width = (i.rootDoc._height * NumCast(i.rootDoc._width)) / oldHeight);
-    //     });
-    // }
-
     /**
      * Adds a new control point to the ink instance when editing its format.
-     * @param x The x-coordinate of the current new point.
-     * @param y The y-coordinate of the current new point.
-     * @param pts The list containing all of the points to be added in PointData form.
-     * @param index The index of the current new point.
+     * @param index The index of the new point.
      * @param control The list of all control points of the ink.
      */
     @undoBatch
@@ -114,7 +95,7 @@ export class InkStrokeProperties {
                         for (var i = spNum; i < ink.length; i++) {
                             newPoints.push({ X: ink[i].X, Y: ink[i].Y });
                         }
-                        this._currPoint = -1;
+                        this._currentPoint = -1;
                         Doc.GetProto(doc).data = new InkField(newPoints);
                     }
                 }
@@ -122,42 +103,6 @@ export class InkStrokeProperties {
         }));
     }
 
-    /**
-     * Helper function that enables other functions to be applied to a particular ink instance.
-     * @param func The inputted function.
-     * @param requireCurrPoint Indicates whether the current selected point is needed.
-     * @returns The applied function.
-     */
-    applyFunction = (func: (doc: Doc, ink: InkData, ptsXscale: number, ptsYscale: number) => { X: number, Y: number }[] | undefined, requireCurrPoint: boolean = false) => {
-        var appliedFunc = false;
-        this.selectedInk?.forEach(action(inkView => {
-            if (this.selectedInk?.length === 1 && (!requireCurrPoint || this._currPoint !== -1)) {
-                const doc = Document(inkView.rootDoc);
-                if (doc.type === DocumentType.INK && doc.width && doc.height) {
-                    const ink = Cast(doc.data, InkField)?.inkData;
-                    if (ink) {
-                        const oldXrange = (xs => ({ coord: NumCast(doc.x), min: Math.min(...xs), max: Math.max(...xs) }))(ink.map(p => p.X));
-                        const oldYrange = (ys => ({ coord: NumCast(doc.y), min: Math.min(...ys), max: Math.max(...ys) }))(ink.map(p => p.Y));
-                        const ptsXscale = NumCast(doc._width) / (oldXrange.max - oldXrange.min);
-                        const ptsYscale = NumCast(doc._height) / (oldYrange.max - oldYrange.min);
-                        const newPoints = func(doc, ink, ptsXscale, ptsYscale);
-                        if (newPoints) {
-                            const newXrange = (xs => ({ min: Math.min(...xs), max: Math.max(...xs) }))(newPoints.map(p => p.X));
-                            const newYrange = (ys => ({ min: Math.min(...ys), max: Math.max(...ys) }))(newPoints.map(p => p.Y));
-                            doc._width = (newXrange.max - newXrange.min) * ptsXscale;
-                            doc._height = (newYrange.max - newYrange.min) * ptsYscale;
-                            doc.x = (oldXrange.coord + (newXrange.min - oldXrange.min) * ptsXscale);
-                            doc.y = (oldYrange.coord + (newYrange.min - oldYrange.min) * ptsYscale);
-                            Doc.GetProto(doc).data = new InkField(newPoints);
-                            appliedFunc = true;
-                        }
-                    }
-                }
-            }
-        }));
-        return appliedFunc;
-    }
-
     /**
      * Deletes the points of the current ink instance.
      * @returns The changed x- and y-coordinates of the control points.
@@ -165,14 +110,14 @@ export class InkStrokeProperties {
     @undoBatch
     @action
     deletePoints = () => this.applyFunction((doc: Doc, ink: InkData) => {
-        var newPoints: { X: number, Y: number }[] = [];
-        const toRemove = Math.floor(((this._currPoint + 2) / 4));
-        for (var i = 0; i < ink.length; i++) {
+        const newPoints: { X: number, Y: number }[] = [];
+        const toRemove = Math.floor(((this._currentPoint + 2) / 4));
+        for (let i = 0; i < ink.length; i++) {
             if (Math.floor((i + 2) / 4) !== toRemove && (toRemove !== 0 || i > 3)) {
                 newPoints.push({ X: ink[i].X, Y: ink[i].Y });
             }
         }
-        this._currPoint = -1;
+        this._currentPoint = -1;
         if (newPoints.length < 4) return undefined;
         if (newPoints.length === 4) {
             const newerPoints: { X: number, Y: number }[] = [];
@@ -183,7 +128,7 @@ export class InkStrokeProperties {
             return newerPoints;
         }
         return newPoints;
-    }, true);
+    }, true)
 
     /**
      * Rotates the points of the current ink instance by a certain angle degree.
@@ -193,7 +138,7 @@ export class InkStrokeProperties {
     @undoBatch
     @action
     rotateInk = (angle: number) => {
-        this.applyFunction((doc: Doc, ink: InkData, ptsXscale: number, ptsYscale: number) => {
+        this.applyFunction((doc: Doc, ink: InkData, xScale: number, yScale: number) => {
             const oldXrange = (xs => ({ coord: NumCast(doc.x), min: Math.min(...xs), max: Math.max(...xs) }))(ink.map(p => p.X));
             const oldYrange = (ys => ({ coord: NumCast(doc.y), min: Math.min(...ys), max: Math.max(...ys) }))(ink.map(p => p.Y));
             const centerPoint = { X: (oldXrange.min + oldXrange.max) / 2, Y: (oldYrange.min + oldYrange.max) / 2 };
@@ -234,7 +179,7 @@ export class InkStrokeProperties {
                 }
             }
             return newPoints;
-        });
+        })
 
     /**
      * Rotates the target point about the origin point for a given angle (radians).
@@ -247,7 +192,7 @@ export class InkStrokeProperties {
         const newY = Math.sin(angle) * target.X + Math.cos(angle) * target.Y;
         target.X = newX + origin.X;
         target.Y = newY + origin.Y;
-        return target
+        return target;
     }
 
     /**
@@ -277,54 +222,20 @@ export class InkStrokeProperties {
     @action
     moveHandle = (deltaX: number, deltaY: number, handleIndex: number) =>
         this.applyFunction((doc: Doc, ink: InkData, xScale: number, yScale: number) => {
-            const newPoints: { X: number, Y: number }[] = [];
             const order = handleIndex % 4;
-            let newHandlePoint = { X: 0, Y: 0 };
-
-            for (var i = 0; i < ink.length; i++) {
-                if (handleIndex === i) {
-                    newHandlePoint = { X: ink[i].X - deltaX / xScale, Y: ink[i].Y - deltaY / yScale };
-                    newPoints.push({ X: newHandlePoint.X, Y: newHandlePoint.Y });
-                } else {
-                    newPoints.push({ X: ink[i].X, Y: ink[i].Y });
-                }
-            }
-
+            const oldHandlePoint = ink[handleIndex];
+            const newHandlePoint = { X: ink[handleIndex].X - deltaX / xScale, Y: ink[handleIndex].Y - deltaY / yScale };
+            ink[handleIndex] = newHandlePoint;
+            
+            // Rotating opposite handle (first and final control point only have one handle).
             if (handleIndex !== 1 && handleIndex !== ink.length - 2) {
-                const oldHandlePoint = ink[handleIndex];
                 let oppositeHandlePoint = order === 1 ? ink[handleIndex - 3] : ink[handleIndex + 3];
                 const controlPoint = order === 1 ? ink[handleIndex - 1] : ink[handleIndex + 1];
                 const angle = this.angleChange(oldHandlePoint, newHandlePoint, controlPoint);
                 oppositeHandlePoint = this.rotatePoint(oppositeHandlePoint, controlPoint, angle);
-                order === 1 ? newPoints[handleIndex - 3] = oppositeHandlePoint : newPoints[handleIndex + 3] = oppositeHandlePoint;
+                order === 1 ? ink[handleIndex - 3] = oppositeHandlePoint : ink[handleIndex + 3] = oppositeHandlePoint;
             }
 
-            return newPoints;
-        });
-
-    // /**
-    //  * Changes the color of the border of the ink instance.
-    //  * @param color The new hex value to change the border to.
-    //  * @returns true.
-    //  */
-    // @undoBatch
-    // @action
-    // switchStk = (color: ColorState) => {
-    //     const val = String(color.hex);
-    //     this.colorStk = val;
-    //     return true;
-    // }
-
-    // /**
-    //  * Changes the color of the fill of the ink instance.
-    //  * @param color The new hex value to change the fill to.
-    //  * @returns true.
-    //  */
-    // @undoBatch
-    // @action
-    // switchFil = (color: ColorState) => {
-    //     const val = String(color.hex);
-    //     this.colorFil = val;
-    //     return true;
-    // }
+            return ink;
+        })
 }
\ No newline at end of file
diff --git a/src/client/views/InkingStroke.scss b/src/client/views/InkingStroke.scss
deleted file mode 100644
index f67b1779d..000000000
--- a/src/client/views/InkingStroke.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-.inkingStroke {
-  mix-blend-mode: multiply;
-  stroke-linejoin: round;
-  stroke-linecap: round;
-  overflow: visible !important;
-  transform-origin: top left;
-
-  svg:not(:root) {
-    overflow: visible !important;
-  }
-}
diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx
deleted file mode 100644
index b2ef76882..000000000
--- a/src/client/views/InkingStroke.tsx
+++ /dev/null
@@ -1,271 +0,0 @@
-import { action, observable } from "mobx";
-import { observer } from "mobx-react";
-import { Doc } from "../../fields/Doc";
-import { documentSchema } from "../../fields/documentSchemas";
-import { InkData, InkField, InkTool, ControlPoint, HandlePoint, HandleLine } from "../../fields/InkField";
-import { makeInterface } from "../../fields/Schema";
-import { Cast, StrCast } from "../../fields/Types";
-import { TraceMobx } from "../../fields/util";
-import { setupMoveUpEvents, emptyFunction, returnFalse } from "../../Utils";
-import { CognitiveServices } from "../cognitive_services/CognitiveServices";
-import { InteractionUtils } from "../util/InteractionUtils";
-import { Scripting } from "../util/Scripting";
-import { UndoManager } from "../util/UndoManager";
-import { ContextMenu } from "./ContextMenu";
-import { ViewBoxBaseComponent } from "./DocComponent";
-import "./InkingStroke.scss";
-import { FieldView, FieldViewProps } from "./nodes/FieldView";
-import React = require("react");
-import { InkStrokeProperties } from "./InkStrokeProperties";
-import { CurrentUserUtils } from "../util/CurrentUserUtils";
-import { InkControl } from "./InkControl";
-
-type InkDocument = makeInterface<[typeof documentSchema]>;
-const InkDocument = makeInterface(documentSchema);
-
-@observer
-export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocument>(InkDocument) {
-    private _controlUndo?: UndoManager.Batch;
-    @observable private _overAddPoint = -1;
-
-    static readonly MaskDim = 50000;
-
-    public static LayoutString(fieldStr: string) { return FieldView.LayoutString(InkingStroke, fieldStr); }
-
-    analyzeStrokes = () => {
-        const data: InkData = Cast(this.dataDoc[this.fieldKey], InkField)?.inkData ?? [];
-        CognitiveServices.Inking.Appliers.ConcatenateHandwriting(this.dataDoc, ["inkAnalysis", "handwriting"], [data]);
-    }
-
-    @action
-    onPointerEnter = (i: number) => {
-        this._overAddPoint = i;
-    }
-
-    @action
-    onPointerLeave = () => {
-        this._overAddPoint = -1;
-    }
-
-
-    @action
-    public static toggleMask = (inkDoc: Doc) => {
-        inkDoc.isInkMask = !inkDoc.isInkMask;
-        inkDoc._backgroundColor = inkDoc.isInkMask ? "rgba(0,0,0,0.7)" : undefined;
-        inkDoc.mixBlendMode = inkDoc.isInkMask ? "hard-light" : undefined;
-        inkDoc.color = "#9b9b9bff";
-        inkDoc._stayInCollection = inkDoc.isInkMask ? true : undefined;
-    };
-
-    /**
-     * Handles the movement of a selected control point when the user clicks and drags.
-     * @param controlNum The index of the currently selected control point.
-     */
-    @action
-    onControlDown = (e: React.PointerEvent, controlNum: number): void => {
-        if (InkStrokeProperties.Instance) {
-            InkStrokeProperties.Instance.moveControl(0, 0, 1);
-            const controlUndo = UndoManager.StartBatch("DocDecs set radius");
-            const screenScale = this.props.ScreenToLocalTransform().Scale;
-            setupMoveUpEvents(this, e,
-                (e: PointerEvent, down: number[], delta: number[]) => {
-                    InkStrokeProperties.Instance?.moveControl(-delta[0] * screenScale, -delta[1] * screenScale, controlNum);
-                    return false;
-                },
-                () => controlUndo?.end(), emptyFunction);
-        }
-    }
-
-    /**
-     * Handles the movement of a selected handle point when the user clicks and drags.
-     * @param controlNum The index of the currently selected handle point.
-     */
-    onHandleDown = (e: React.PointerEvent, handleNum: number): void => {
-        if (InkStrokeProperties.Instance) {
-            InkStrokeProperties.Instance.moveControl(0, 0, 1);
-            const controlUndo = UndoManager.StartBatch("DocDecs set radius");
-            const screenScale = this.props.ScreenToLocalTransform().Scale;
-            setupMoveUpEvents(this, e,
-                (e: PointerEvent, down: number[], delta: number[]) => {
-                    InkStrokeProperties.Instance?.moveHandle(-delta[0] * screenScale, -delta[1] * screenScale, handleNum);
-                    return false;
-                },
-                () => controlUndo?.end(), emptyFunction);
-        }
-    }
-
-    /**
-     * Handles the movement of the entire ink object when the user clicks and drags.
-     * @param e React Pointer Event.
-     */
-    onPointerDown = (e: React.PointerEvent) => {
-        if (this.props.isSelected(true)) {
-            setupMoveUpEvents(this, e, returnFalse, emptyFunction, action((e: PointerEvent, doubleTap: boolean | undefined) =>
-                doubleTap && InkStrokeProperties.Instance && (InkStrokeProperties.Instance._controlBtn = true)));
-        }
-    }
-
-    render() {
-        TraceMobx();
-        const formatInstance = InkStrokeProperties.Instance;
-        if (!formatInstance) return (null);
-        const data: InkData = Cast(this.dataDoc[this.fieldKey], InkField)?.inkData ?? [];
-        const strokeWidth = Number(this.layoutDoc.strokeWidth);
-        const xs = data.map(p => p.X);
-        const ys = data.map(p => p.Y);
-        const lineTop = Math.min(...ys);
-        const lineBot = Math.max(...ys);
-        const lineLft = Math.min(...xs);
-        const lineRgt = Math.max(...xs);
-        const left = lineLft - strokeWidth / 2;
-        const top = lineTop - strokeWidth / 2;
-        const right = lineRgt + strokeWidth / 2;
-        const bottom = lineBot + strokeWidth / 2;
-        const width = Math.max(1, right - left);
-        const height = Math.max(1, bottom - top);
-        const scaleX = width === strokeWidth ? 1 : (this.props.PanelWidth() - strokeWidth) / (width - strokeWidth);
-        const scaleY = height === strokeWidth ? 1 : (this.props.PanelHeight() - strokeWidth) / (height - strokeWidth);
-        const strokeColor = StrCast(this.layoutDoc.color, "");
-        const dotsize = Math.max(width * scaleX, height * scaleY) / 40;
-
-        // Visually renders the polygonal line made by the user.
-        const points = InteractionUtils.CreatePolyline(data, left, top, strokeColor, strokeWidth, strokeWidth,
-            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
-            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
-            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5 && lineBot - lineTop > 1 && lineRgt - lineLft > 1, false);
-        
-        const selectedLine = InteractionUtils.CreatePolyline(data, lineLft - strokeWidth * 3, lineTop - strokeWidth * 3, "#1F85DE", strokeWidth / 6, strokeWidth / 6,
-            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
-            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
-            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5 && lineBot - lineTop > 1 && lineRgt - lineLft > 1, false);
-
-        // Invisible polygonal line that enables the ink to be selected by the user.
-        const hpoints = InteractionUtils.CreatePolyline(data, left, top,
-            this.props.isSelected() && strokeWidth > 5 ? strokeColor : "transparent", strokeWidth, (strokeWidth + 15),
-            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
-            "none", "none", undefined, scaleX, scaleY, "", this.props.layerProvider?.(this.props.Document) === false ? "none" : "visiblepainted", false, true);
-
-        const apoints = InteractionUtils.CreatePoints(data, left, top, strokeColor, strokeWidth, strokeWidth,
-            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
-            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
-            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5, false);
-
-        const controlPoints: ControlPoint[] = [];
-        const handlePoints: HandlePoint[] = [];
-        const handleLine: HandleLine[] = [];
-        // check the purpose of this conditional
-        if (data.length >= 4) {
-
-            // create separate functions for these            
-            for (var i = 0; i <= data.length - 4; i += 4) {
-                controlPoints.push({ X: data[i].X, Y: data[i].Y, I: i });
-                controlPoints.push({ X: data[i + 3].X, Y: data[i + 3].Y, I: i + 3 });
-                handlePoints.push({ X: data[i + 1].X, Y: data[i + 1].Y, I: i + 1, dot1: i, dot2: i === 0 ? i : i - 1 });
-                handlePoints.push({ X: data[i + 2].X, Y: data[i + 2].Y, I: i + 2, dot1: i + 3, dot2: i === data.length ? i + 3 : i + 4 });
-            }
-
-            // first (single) handle line 
-            handleLine.push({ X1: data[0].X, Y1: data[0].Y, X2: data[1].X, Y2: data[1].Y, dot1: 0, dot2: 0 });
-            for (var i = 2; i < data.length - 4; i += 4) {
-
-                handleLine.push({ X1: data[i].X, Y1: data[i].Y, X2: data[i + 3].X, Y2: data[i + 3].Y, dot1: i + 1, dot2: i + 2 });
-
-            }
-            // last (single) handle line
-            handleLine.push({ X1: data[data.length - 2].X, Y1: data[data.length - 2].Y, X2: data[data.length - 1].X, Y2: data[data.length - 1].Y, dot1: data.length - 1, dot2: data.length - 1 });
-
-            for (var i = 0; i <= data.length - 4; i += 4) {
-                handlePoints.push({ X: data[i + 1].X, Y: data[i + 1].Y, I: i + 1, dot1: i, dot2: i === 0 ? i : i - 1 });
-                handlePoints.push({ X: data[i + 2].X, Y: data[i + 2].Y, I: i + 2, dot1: i + 3, dot2: i === data.length ? i + 3 : i + 4 });
-            }
-        }
-
-        // Additional points (controls) added by the user via click when editing the ink's format.
-        const addpoints = apoints.map((pts, i) =>
-            <svg height="10" width="10" key={`add${i}`}>
-                <circle cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} r={strokeWidth / 2} stroke={this._overAddPoint === i ? "#1F85DE" : "invisible"} strokeWidth={dotsize / 4} fill={this._overAddPoint === i ? "#1F85DE" : "invisible"}
-                    onPointerDown={(e) => { formatInstance.addPoints(pts.X, pts.Y, apoints, i, controlPoints); }} onMouseEnter={() => this.onPointerEnter(i)} onMouseLeave={this.onPointerLeave} pointerEvents="all" cursor="all-scroll"
-                />
-            </svg>);
-        // Blue circles that allow the user to edit the curvature of the line using the selected control point as the anchor.
-        const handles = handlePoints.map((pts, i) =>
-            <svg height="10" width="10" key={`hdl${i}`}>
-                <circle cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} r={strokeWidth / 2} strokeWidth={0} fill="#1F85DE"
-                    onPointerDown={(e) => this.onHandleDown(e, pts.I)} pointerEvents="all" cursor="default" display={(pts.dot1 === formatInstance._currPoint || pts.dot2 === formatInstance._currPoint) ? "inherit" : "none"} />
-            </svg>);
-        // Control points of the ink (blue outlined squares) that are made visible to user when editing its format.
-        const controls = controlPoints.map((pts, i) => <InkControl control={pts} left={left} top={top} scaleX={scaleX} scaleY={scaleY} strokeWidth={strokeWidth} ScreenToLocalTransform={this.props.ScreenToLocalTransform} /> );
-        // Set of two blue lines (each with a handle at the end) that are rendered perpendicular to the current selected point while editing.
-        const handleLines = handleLine.map((pts, i) =>
-            <svg height="100" width="100" key={`line${i}`}>
-                <line x1={(pts.X1 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} y1={(pts.Y1 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
-                    x2={(pts.X2 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} y2={(pts.Y2 - top - strokeWidth / 2) * scaleY + strokeWidth / 2} stroke="#1F85DE" strokeWidth={dotsize / 10}
-                    display={(pts.dot1 === formatInstance._currPoint || pts.dot2 === formatInstance._currPoint) ? "inherit" : "none"} />
-            </svg>);
-
-        return (
-            <svg className="inkingStroke"
-                style={{
-                    pointerEvents: this.props.Document.isInkMask && this.props.layerProvider?.(this.props.Document) !== false ? "all" : "none",
-                    transform: this.props.Document.isInkMask ? `translate(${InkingStroke.MaskDim / 2}px, ${InkingStroke.MaskDim / 2}px)` : undefined,
-                    mixBlendMode: this.layoutDoc.tool === InkTool.Highlighter ? "multiply" : "unset",
-                    overflow: "visible",
-                }}
-                onPointerDown={this.onPointerDown}
-                onContextMenu={() => {
-                    const cm = ContextMenu.Instance;
-                    if (cm) {
-                        !Doc.UserDoc().noviceMode && cm.addItem({ description: "Recognize Writing", event: this.analyzeStrokes, icon: "paint-brush" });
-                        cm.addItem({ description: "Toggle Mask", event: () => InkingStroke.toggleMask(this.rootDoc), icon: "paint-brush" });
-                        cm.addItem({ description: "Edit Points", event: action(() => formatInstance._controlBtn = !formatInstance._controlBtn), icon: "paint-brush" });
-                        //cm.addItem({ description: "Format Shape...", event: this.formatShape, icon: "paint-brush" });
-                    }
-                }}
-            ><defs>
-                </defs>
-                {hpoints}
-                {points}
-                {formatInstance._controlBtn && this.props.isSelected() ? addpoints : ""}
-                {formatInstance._controlBtn && this.props.isSelected() ? handleLines : ""}
-                {formatInstance._controlBtn && this.props.isSelected() ? handles : ""}
-                {this.props.isSelected() ? selectedLine : ""}
-                {formatInstance._controlBtn && this.props.isSelected() ? controls : ""}
-            </svg>
-        );
-    }
-}
-
-
-export function SetActiveInkWidth(width: string): void { !isNaN(parseInt(width)) && ActiveInkPen() && (ActiveInkPen().activeInkWidth = width); }
-export function SetActiveBezierApprox(bezier: string): void { ActiveInkPen() && (ActiveInkPen().activeInkBezier = isNaN(parseInt(bezier)) ? "" : bezier); }
-export function SetActiveInkColor(value: string) { ActiveInkPen() && (ActiveInkPen().activeInkColor = value); }
-export function SetActiveFillColor(value: string) { ActiveInkPen() && (ActiveInkPen().activeFillColor = value); }
-export function SetActiveArrowStart(value: string) { ActiveInkPen() && (ActiveInkPen().activeArrowStart = value); }
-export function SetActiveArrowEnd(value: string) { ActiveInkPen() && (ActiveInkPen().activeArrowEnd = value); }
-export function SetActiveDash(dash: string): void { !isNaN(parseInt(dash)) && ActiveInkPen() && (ActiveInkPen().activeDash = dash); }
-export function ActiveInkPen(): Doc { return Doc.UserDoc(); }
-export function ActiveInkColor(): string { return StrCast(ActiveInkPen()?.activeInkColor, "black"); }
-export function ActiveFillColor(): string { return StrCast(ActiveInkPen()?.activeFillColor, ""); }
-export function ActiveArrowStart(): string { return StrCast(ActiveInkPen()?.activeArrowStart, ""); }
-export function ActiveArrowEnd(): string { return StrCast(ActiveInkPen()?.activeArrowEnd, ""); }
-export function ActiveDash(): string { return StrCast(ActiveInkPen()?.activeDash, "0"); }
-export function ActiveInkWidth(): string { return StrCast(ActiveInkPen()?.activeInkWidth, "1"); }
-export function ActiveInkBezierApprox(): string { return StrCast(ActiveInkPen()?.activeInkBezier); }
-Scripting.addGlobal(function activateBrush(pen: any, width: any, color: any, fill: any, arrowStart: any, arrowEnd: any, dash: any) {
-    CurrentUserUtils.SelectedTool = pen ? InkTool.Highlighter : InkTool.None;
-    SetActiveInkWidth(width);
-    SetActiveInkColor(color);
-    SetActiveFillColor(fill);
-    SetActiveArrowStart(arrowStart);
-    SetActiveArrowEnd(arrowEnd);
-    SetActiveDash(dash);
-});
-Scripting.addGlobal(function activateEraser(pen: any) { return CurrentUserUtils.SelectedTool = pen ? InkTool.Eraser : InkTool.None; });
-Scripting.addGlobal(function activateStamp(pen: any) { return CurrentUserUtils.SelectedTool = pen ? InkTool.Stamp : InkTool.None; });
-Scripting.addGlobal(function deactivateInk() { return CurrentUserUtils.SelectedTool = InkTool.None; });
-Scripting.addGlobal(function setInkWidth(width: any) { return SetActiveInkWidth(width); });
-Scripting.addGlobal(function setInkColor(color: any) { return SetActiveInkColor(color); });
-Scripting.addGlobal(function setFillColor(fill: any) { return SetActiveFillColor(fill); });
-Scripting.addGlobal(function setActiveArrowStart(arrowStart: any) { return SetActiveArrowStart(arrowStart); });
-Scripting.addGlobal(function setActiveArrowEnd(arrowEnd: any) { return SetActiveArrowStart(arrowEnd); });
-Scripting.addGlobal(function setActiveDash(dash: any) { return SetActiveDash(dash); });
diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx
index 5c41a96d0..920244463 100644
--- a/src/client/views/PropertiesButtons.tsx
+++ b/src/client/views/PropertiesButtons.tsx
@@ -11,7 +11,7 @@ import { DocumentType } from '../documents/DocumentTypes';
 import { SelectionManager } from '../util/SelectionManager';
 import { undoBatch } from '../util/UndoManager';
 import { CollectionViewType } from './collections/CollectionView';
-import { InkingStroke } from './InkingStroke';
+import { InkStroke } from './InkStroke';
 import { DocumentView } from './nodes/DocumentView';
 import './PropertiesButtons.scss';
 import React = require("react");
@@ -56,7 +56,7 @@ export class PropertiesButtons extends React.Component<{}, {}> {
         return this.propertyToggleBtn("Dictate", "_showAudio", on => `${on ? "Hide" : "Show"} dictation/recording controls`, on => "microphone");
     }
     @computed get maskButton() {
-        return this.propertyToggleBtn("Mask", "isInkMask", on => on ? "Make plain ink" : "Make highlight mask", on => "paint-brush", (dv, doc) => InkingStroke.toggleMask(dv?.layoutDoc || doc));
+        return this.propertyToggleBtn("Mask", "isInkMask", on => on ? "Make plain ink" : "Make highlight mask", on => "paint-brush", (dv, doc) => InkStroke.toggleMask(dv?.layoutDoc || doc));
     }
     @computed get clustersButton() {
         return this.propertyToggleBtn("Clusters", "_useClusters", on => `${on ? "Hide" : "Show"} clusters`, on => "braille");
diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx
index d09d949ff..4df3e4f00 100644
--- a/src/client/views/PropertiesView.tsx
+++ b/src/client/views/PropertiesView.tsx
@@ -86,7 +86,7 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
     @observable openSlideOptions: boolean = false;
 
     @observable inOptions: boolean = false;
-    @observable _controlBtn: boolean = false;
+    @observable _controlButton: boolean = false;
     @observable _lock: boolean = false;
 
     componentDidMount() {
@@ -540,7 +540,7 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
         const formatInstance = InkStrokeProperties.Instance;
         return !formatInstance ? (null) : <div className="inking-button">
             <Tooltip title={<div className="dash-tooltip">{"Edit points"}</div>}>
-                <div className="inking-button-points" onPointerDown={action(() => formatInstance._controlBtn = !formatInstance._controlBtn)} style={{ backgroundColor: formatInstance._controlBtn ? "black" : "" }}>
+                <div className="inking-button-points" onPointerDown={action(() => formatInstance._controlButton = !formatInstance._controlButton)} style={{ backgroundColor: formatInstance._controlButton ? "black" : "" }}>
                     <FontAwesomeIcon icon="bezier-curve" color="white" size="lg" />
                 </div>
             </Tooltip>
diff --git a/src/client/views/collections/CollectionMenu.tsx b/src/client/views/collections/CollectionMenu.tsx
index 6e6fabd0d..65061d260 100644
--- a/src/client/views/collections/CollectionMenu.tsx
+++ b/src/client/views/collections/CollectionMenu.tsx
@@ -25,7 +25,7 @@ import { undoBatch } from "../../util/UndoManager";
 import { AntimodeMenu, AntimodeMenuProps } from "../AntimodeMenu";
 import { EditableView } from "../EditableView";
 import { GestureOverlay } from "../GestureOverlay";
-import { ActiveFillColor, ActiveInkColor, SetActiveArrowEnd, SetActiveArrowStart, SetActiveBezierApprox, SetActiveFillColor, SetActiveInkColor, SetActiveInkWidth, ActiveArrowStart, ActiveArrowEnd } from "../InkingStroke";
+import { ActiveFillColor, ActiveInkColor, SetActiveArrowEnd, SetActiveArrowStart, SetActiveBezierApprox, SetActiveFillColor, SetActiveInkColor, SetActiveInkWidth, ActiveArrowStart, ActiveArrowEnd } from "../InkStroke";
 import { CollectionFreeFormDocumentView } from "../nodes/CollectionFreeFormDocumentView";
 import { DocumentView } from "../nodes/DocumentView";
 import { RichTextMenu } from "../nodes/formattedText/RichTextMenu";
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index accb80c5a..9e81a6cda 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -32,7 +32,7 @@ import { COLLECTION_BORDER_WIDTH } from "../../../views/globalCssVariables.scss"
 import { Timeline } from "../../animationtimeline/Timeline";
 import { ContextMenu } from "../../ContextMenu";
 import { DocumentDecorations } from "../../DocumentDecorations";
-import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth } from "../../InkingStroke";
+import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth } from "../../InkStroke";
 import { LightboxView } from "../../LightboxView";
 import { CollectionFreeFormDocumentView } from "../../nodes/CollectionFreeFormDocumentView";
 import { DocFocusOptions, DocumentView, DocumentViewProps, ViewAdjustment, ViewSpecPrefix } from "../../nodes/DocumentView";
diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
index 092823603..744a9c5de 100644
--- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
+++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
@@ -13,7 +13,7 @@ import { SelectionManager } from "../../util/SelectionManager";
 import { Transform } from "../../util/Transform";
 import { CollectionFreeFormView } from "../collections/collectionFreeForm/CollectionFreeFormView";
 import { DocComponent } from "../DocComponent";
-import { InkingStroke } from "../InkingStroke";
+import { InkStroke } from "../InkStroke";
 import { StyleProp } from "../StyleProvider";
 import "./CollectionFreeFormDocumentView.scss";
 import { DocumentView, DocumentViewProps } from "./DocumentView";
@@ -38,7 +38,7 @@ export class CollectionFreeFormDocumentView extends DocComponent<CollectionFreeF
     @observable _animPos: number[] | undefined = undefined;
     @observable _contentView: DocumentView | undefined | null;
     get displayName() { return "CollectionFreeFormDocumentView(" + this.rootDoc.title + ")"; } // this makes mobx trace() statements more descriptive
-    get maskCentering() { return this.props.Document.isInkMask ? InkingStroke.MaskDim / 2 : 0; }
+    get maskCentering() { return this.props.Document.isInkMask ? InkStroke.MaskDim / 2 : 0; }
     get transform() { return `translate(${this.X - this.maskCentering}px, ${this.Y - this.maskCentering}px) rotate(${this.props.jitterRotation}deg)`; }
     get X() { return this.dataProvider ? this.dataProvider.x : (this.Document.x || 0); }
     get Y() { return this.dataProvider ? this.dataProvider.y : (this.Document.y || 0); }
diff --git a/src/client/views/nodes/ColorBox.tsx b/src/client/views/nodes/ColorBox.tsx
index 8da5cd1b1..2d466763b 100644
--- a/src/client/views/nodes/ColorBox.tsx
+++ b/src/client/views/nodes/ColorBox.tsx
@@ -12,7 +12,7 @@ import { CurrentUserUtils } from "../../util/CurrentUserUtils";
 import { SelectionManager } from "../../util/SelectionManager";
 import { undoBatch } from "../../util/UndoManager";
 import { ViewBoxBaseComponent } from "../DocComponent";
-import { ActiveInkColor, ActiveInkWidth, SetActiveInkColor, SetActiveInkWidth } from "../InkingStroke";
+import { ActiveInkColor, ActiveInkWidth, SetActiveInkColor, SetActiveInkWidth } from "../InkStroke";
 import "./ColorBox.scss";
 import { FieldView, FieldViewProps } from './FieldView';
 import { RichTextMenu } from "./formattedText/RichTextMenu";
diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx
index f0a54e4ac..5da3a52d5 100644
--- a/src/client/views/nodes/DocumentContentsView.tsx
+++ b/src/client/views/nodes/DocumentContentsView.tsx
@@ -10,7 +10,7 @@ import { CollectionDockingView } from "../collections/CollectionDockingView";
 import { CollectionFreeFormView } from "../collections/collectionFreeForm/CollectionFreeFormView";
 import { CollectionSchemaView } from "../collections/CollectionSchemaView";
 import { CollectionView } from "../collections/CollectionView";
-import { InkingStroke } from "../InkingStroke";
+import { InkStroke } from "../InkStroke";
 import { PresElementBox } from "../presentationview/PresElementBox";
 import { SearchBox } from "../search/SearchBox";
 import { DashWebRTCVideo } from "../webcam/DashWebRTCVideo";
@@ -224,7 +224,7 @@ export class DocumentContentsView extends React.Component<DocumentViewProps & Fo
                     FormattedTextBox, ImageBox, DirectoryImportBox, FontIconBox, LabelBox, EquationBox, SliderBox, FieldView,
                     CollectionFreeFormView, CollectionDockingView, CollectionSchemaView, CollectionView, WebBox, KeyValueBox,
                     PDFBox, VideoBox, AudioBox, PresBox, YoutubeBox, PresElementBox, SearchBox, FilterBox, FunctionPlotBox,
-                    ColorBox, DashWebRTCVideo, LinkAnchorBox, InkingStroke, LinkBox, ScriptingBox,
+                    ColorBox, DashWebRTCVideo, LinkAnchorBox, InkStroke, LinkBox, ScriptingBox,
                     ScreenshotBox,
                     HTMLtag, ComparisonBox
                 }}
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index b861669f8..924b0e7d3 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -34,7 +34,7 @@ import { ContextMenu } from "../ContextMenu";
 import { ContextMenuProps } from '../ContextMenuItem';
 import { DocComponent } from "../DocComponent";
 import { EditableView } from '../EditableView';
-import { InkingStroke } from "../InkingStroke";
+import { InkStroke } from "../InkStroke";
 import { LightboxView } from "../LightboxView";
 import { StyleLayers, StyleProp } from "../StyleProvider";
 import { CollectionFreeFormDocumentView } from "./CollectionFreeFormDocumentView";
@@ -1138,8 +1138,8 @@ export class DocumentView extends React.Component<DocumentViewProps> {
 
     render() {
         TraceMobx();
-        const xshift = () => (this.props.Document.isInkMask ? InkingStroke.MaskDim : Math.abs(this.Xshift) <= 0.001 ? this.props.PanelWidth() : undefined);
-        const yshift = () => (this.props.Document.isInkMask ? InkingStroke.MaskDim : Math.abs(this.Yshift) <= 0.001 ? this.props.PanelHeight() : undefined);
+        const xshift = () => (this.props.Document.isInkMask ? InkStroke.MaskDim : Math.abs(this.Xshift) <= 0.001 ? this.props.PanelWidth() : undefined);
+        const yshift = () => (this.props.Document.isInkMask ? InkStroke.MaskDim : Math.abs(this.Yshift) <= 0.001 ? this.props.PanelHeight() : undefined);
         return (<div className="contentFittingDocumentView">
             {!this.props.Document || !this.props.PanelWidth() ? (null) : (
                 <div className="contentFittingDocumentView-previewDoc" ref={this.ContentRef}
-- 
cgit v1.2.3-70-g09d2


From 5ab81f49a11bd8a74725228a887a90c88a3848ff Mon Sep 17 00:00:00 2001
From: vkalev <vjk1883@gmail.com>
Date: Tue, 6 Jul 2021 14:27:29 -0500
Subject: added breaking of tangent handle lines by holding 'Alt' key when
 moving

---
 src/client/views/InkHandles.tsx         | 32 +++++++++++++++++++++++++++-----
 src/client/views/InkStrokeProperties.ts |  6 +++---
 src/fields/InkField.ts                  |  2 ++
 3 files changed, 32 insertions(+), 8 deletions(-)

(limited to 'src')

diff --git a/src/client/views/InkHandles.tsx b/src/client/views/InkHandles.tsx
index c2163c124..993e427b3 100644
--- a/src/client/views/InkHandles.tsx
+++ b/src/client/views/InkHandles.tsx
@@ -15,6 +15,8 @@ export interface InkControlProps {
 
 @observer
 export class InkHandles extends React.Component<InkControlProps> {
+    @observable private _brokenIndices: number[] = [];
+
     /**
      * Handles the movement of a selected handle point when the user clicks and drags.
      * @param handleNum The index of the currently selected handle point.
@@ -24,13 +26,25 @@ export class InkHandles extends React.Component<InkControlProps> {
             InkStrokeProperties.Instance.moveControl(0, 0, 1);
             const controlUndo = UndoManager.StartBatch("DocDecs set radius");
             const screenScale = this.props.ScreenToLocalTransform().Scale;
+            document.addEventListener("keydown", (e: KeyboardEvent) => this.onBreakTangent(e, handleNum), true);
             setupMoveUpEvents(this, e, (e: PointerEvent, down: number[], delta: number[]) => {
-                    InkStrokeProperties.Instance?.moveHandle(-delta[0] * screenScale, -delta[1] * screenScale, handleNum);
+                    InkStrokeProperties.Instance?.moveHandle(-delta[0] * screenScale, -delta[1] * screenScale, handleNum, this._brokenIndices);
                     return false;
                 }, () => controlUndo?.end(), emptyFunction
             );
         }
     }
+
+    @action
+    onBreakTangent = (e: KeyboardEvent, handleIndex: number) => {
+        if (["Alt"].includes(e.key)) {
+            const order = handleIndex % 4;
+            const oppositeHandleIndex = order === 1 ? handleIndex - 3 : handleIndex + 3;
+            if (!this._brokenIndices.includes(handleIndex) && !this._brokenIndices.includes(oppositeHandleIndex)) {
+                this._brokenIndices.push(handleIndex, oppositeHandleIndex);
+            }
+        }
+    }
  
     render() {
         const formatInstance = InkStrokeProperties.Instance;
@@ -39,15 +53,15 @@ export class InkHandles extends React.Component<InkControlProps> {
         const handlePoints: HandlePoint[] = [];
         const handleLines: HandleLine[] = [];
         if (data.length >= 4) {
-            // adding first and last (single) handle lines
-            handleLines.push({ X1: data[0].X, Y1: data[0].Y, X2: data[1].X, Y2: data[1].Y, dot1: 0, dot2: 0 });
-            handleLines.push({ X1: data[data.length - 2].X, Y1: data[data.length - 2].Y, X2: data[data.length - 1].X, Y2: data[data.length - 1].Y, dot1: data.length - 1, dot2: data.length - 1 });
             for (let i = 0; i <= data.length - 4; i += 4) {
                 handlePoints.push({ X: data[i + 1].X, Y: data[i + 1].Y, I: i + 1, dot1: i, dot2: i === 0 ? i : i - 1 });
                 handlePoints.push({ X: data[i + 2].X, Y: data[i + 2].Y, I: i + 2, dot1: i + 3, dot2: i === data.length ? i + 3 : i + 4 });
             }
+            // adding first and last (single) handle lines
+            handleLines.push({ X1: data[0].X, Y1: data[0].Y, X2: data[0].X, Y2: data[0].Y, X3: data[1].X, Y3: data[1].Y, dot1: 0, dot2: 0 });
+            handleLines.push({ X1: data[data.length - 2].X, Y1: data[data.length - 2].Y, X2: data[data.length - 1].X, Y2: data[data.length - 1].Y, X3: data[data.length - 1].X, Y3: data[data.length - 1].Y, dot1: data.length - 1, dot2: data.length - 1 });
             for (let i = 2; i < data.length - 4; i += 4) {
-                handleLines.push({ X1: data[i].X, Y1: data[i].Y, X2: data[i + 3].X, Y2: data[i + 3].Y, dot1: i + 1, dot2: i + 2 });
+                handleLines.push({ X1: data[i].X, Y1: data[i].Y, X2: data[i + 1].X, Y2: data[i + 1].Y, X3: data[i + 3].X, Y3: data[i + 3].Y, dot1: i + 1, dot2: i + 2 });
             }
         }
         const [left, top, scaleX, scaleY, strokeWidth, dotsize] = this.props.format;
@@ -77,6 +91,14 @@ export class InkHandles extends React.Component<InkControlProps> {
                             stroke="#1F85DE" 
                             strokeWidth={dotsize / 8}
                             display={(pts.dot1 === formatInstance._currentPoint || pts.dot2 === formatInstance._currentPoint) ? "inherit" : "none"} />
+                        <line 
+                            x1={(pts.X2 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} 
+                            y1={(pts.Y2 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
+                            x2={(pts.X3 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} 
+                            y2={(pts.Y3 - top - strokeWidth / 2) * scaleY + strokeWidth / 2} 
+                            stroke="#1F85DE" 
+                            strokeWidth={dotsize / 8}
+                            display={(pts.dot1 === formatInstance._currentPoint || pts.dot2 === formatInstance._currentPoint) ? "inherit" : "none"} />
                     </svg>)}
             </>
         );
diff --git a/src/client/views/InkStrokeProperties.ts b/src/client/views/InkStrokeProperties.ts
index a5c028730..812e8ff6e 100644
--- a/src/client/views/InkStrokeProperties.ts
+++ b/src/client/views/InkStrokeProperties.ts
@@ -220,15 +220,15 @@ export class InkStrokeProperties {
      */
     @undoBatch
     @action
-    moveHandle = (deltaX: number, deltaY: number, handleIndex: number) =>
+    moveHandle = (deltaX: number, deltaY: number, handleIndex: number, brokenIndices: number[]) =>
         this.applyFunction((doc: Doc, ink: InkData, xScale: number, yScale: number) => {
             const order = handleIndex % 4;
             const oldHandlePoint = ink[handleIndex];
             const newHandlePoint = { X: ink[handleIndex].X - deltaX / xScale, Y: ink[handleIndex].Y - deltaY / yScale };
             ink[handleIndex] = newHandlePoint;
             
-            // Rotating opposite handle (first and final control point only have one handle).
-            if (handleIndex !== 1 && handleIndex !== ink.length - 2) {
+            // Rotate opposite handle if user hasn't held 'Alt' key or not first/final control (which have only 1 handle).
+            if (!brokenIndices.includes(handleIndex) && handleIndex !== 1 && handleIndex !== ink.length - 2) {
                 let oppositeHandlePoint = order === 1 ? ink[handleIndex - 3] : ink[handleIndex + 3];
                 const controlPoint = order === 1 ? ink[handleIndex - 1] : ink[handleIndex + 1];
                 const angle = this.angleChange(oldHandlePoint, newHandlePoint, controlPoint);
diff --git a/src/fields/InkField.ts b/src/fields/InkField.ts
index c158dac42..485376a34 100644
--- a/src/fields/InkField.ts
+++ b/src/fields/InkField.ts
@@ -42,6 +42,8 @@ export interface HandleLine {
     Y1: number;
     X2: number;
     Y2: number;
+    X3: number;
+    Y3: number;
     dot1: number;
     dot2: number;
 }
-- 
cgit v1.2.3-70-g09d2


From 7f42c98318899a51cb64080fc4f4e315e43bb150 Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Tue, 6 Jul 2021 23:47:38 -0400
Subject: reoganization of schema view files, partial

---
 .idea/.gitignore                                   |   3 +
 .idea/Dash-Web.iml                                 |   9 +
 .idea/modules.xml                                  |   8 +
 .idea/vcs.xml                                      |   6 +
 .../views/collections/CollectionSchemaCells.tsx    | 584 -------------------
 .../views/collections/CollectionSchemaHeaders.tsx  | 518 -----------------
 .../CollectionSchemaMovableTableHOC.tsx            | 261 ---------
 .../views/collections/CollectionSchemaView.scss    | 641 ---------------------
 .../views/collections/CollectionSchemaView.tsx     | 575 ------------------
 src/client/views/collections/SchemaTable.tsx       | 599 -------------------
 .../schemaView/CollectionSchemaCells.tsx           | 584 +++++++++++++++++++
 .../schemaView/CollectionSchemaHeaders.tsx         | 518 +++++++++++++++++
 .../schemaView/CollectionSchemaMovableTableHOC.tsx | 261 +++++++++
 .../schemaView/CollectionSchemaView.scss           | 552 ++++++++++++++++++
 .../schemaView/CollectionSchemaView.tsx            | 575 ++++++++++++++++++
 .../views/collections/schemaView/SchemaTable.tsx   | 599 +++++++++++++++++++
 src/client/views/nodes/DocumentContentsView.tsx    |   2 +-
 17 files changed, 3116 insertions(+), 3179 deletions(-)
 create mode 100644 .idea/.gitignore
 create mode 100644 .idea/Dash-Web.iml
 create mode 100644 .idea/modules.xml
 create mode 100644 .idea/vcs.xml
 delete mode 100644 src/client/views/collections/CollectionSchemaCells.tsx
 delete mode 100644 src/client/views/collections/CollectionSchemaHeaders.tsx
 delete mode 100644 src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
 delete mode 100644 src/client/views/collections/CollectionSchemaView.scss
 delete mode 100644 src/client/views/collections/CollectionSchemaView.tsx
 delete mode 100644 src/client/views/collections/SchemaTable.tsx
 create mode 100644 src/client/views/collections/schemaView/CollectionSchemaCells.tsx
 create mode 100644 src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
 create mode 100644 src/client/views/collections/schemaView/CollectionSchemaMovableTableHOC.tsx
 create mode 100644 src/client/views/collections/schemaView/CollectionSchemaView.scss
 create mode 100644 src/client/views/collections/schemaView/CollectionSchemaView.tsx
 create mode 100644 src/client/views/collections/schemaView/SchemaTable.tsx

(limited to 'src')

diff --git a/.idea/.gitignore b/.idea/.gitignore
new file mode 100644
index 000000000..26d33521a
--- /dev/null
+++ b/.idea/.gitignore
@@ -0,0 +1,3 @@
+# Default ignored files
+/shelf/
+/workspace.xml
diff --git a/.idea/Dash-Web.iml b/.idea/Dash-Web.iml
new file mode 100644
index 000000000..d6ebd4805
--- /dev/null
+++ b/.idea/Dash-Web.iml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="JAVA_MODULE" version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
\ No newline at end of file
diff --git a/.idea/modules.xml b/.idea/modules.xml
new file mode 100644
index 000000000..35c51c015
--- /dev/null
+++ b/.idea/modules.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/Dash-Web.iml" filepath="$PROJECT_DIR$/.idea/Dash-Web.iml" />
+    </modules>
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
new file mode 100644
index 000000000..35eb1ddfb
--- /dev/null
+++ b/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
deleted file mode 100644
index 3fb9910b5..000000000
--- a/src/client/views/collections/CollectionSchemaCells.tsx
+++ /dev/null
@@ -1,584 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action, computed, observable } from "mobx";
-import { observer } from "mobx-react";
-import DatePicker from "react-datepicker";
-import "react-datepicker/dist/react-datepicker.css";
-import { CellInfo } from "react-table";
-import "react-table/react-table.css";
-import { DateField } from "../../../fields/DateField";
-import { Doc, DocListCast, Field, Opt } from "../../../fields/Doc";
-import { Id } from "../../../fields/FieldSymbols";
-import { List } from "../../../fields/List";
-import { SchemaHeaderField } from "../../../fields/SchemaHeaderField";
-import { ComputedField } from "../../../fields/ScriptField";
-import { BoolCast, Cast, DateCast, FieldValue, NumCast, StrCast } from "../../../fields/Types";
-import { ImageField } from "../../../fields/URLField";
-import { Utils, emptyFunction } from "../../../Utils";
-import { Docs } from "../../documents/Documents";
-import { DocumentType } from "../../documents/DocumentTypes";
-import { DocumentManager } from "../../util/DocumentManager";
-import { DragManager } from "../../util/DragManager";
-import { KeyCodes } from "../../util/KeyCodes";
-import { CompileScript } from "../../util/Scripting";
-import { SearchUtil } from "../../util/SearchUtil";
-import { SnappingManager } from "../../util/SnappingManager";
-import { undoBatch } from "../../util/UndoManager";
-import '../DocumentDecorations.scss';
-import { EditableView } from "../EditableView";
-import { MAX_ROW_HEIGHT } from '../globalCssVariables.scss';
-import { DocumentIconContainer } from "../nodes/DocumentIcon";
-import { OverlayView } from "../OverlayView";
-import "./CollectionSchemaView.scss";
-import { CollectionView } from "./CollectionView";
-const path = require('path');
-
-export interface CellProps {
-    row: number;
-    col: number;
-    rowProps: CellInfo;
-    CollectionView: Opt<CollectionView>;
-    ContainingCollection: Opt<CollectionView>;
-    Document: Doc;
-    fieldKey: string;
-    renderDepth: number;
-    addDocTab: (document: Doc, where: string) => boolean;
-    pinToPres: (document: Doc) => void;
-    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined,
-        addDocument: (document: Doc | Doc[]) => boolean) => boolean;
-    isFocused: boolean;
-    changeFocusedCellByIndex: (row: number, col: number) => void;
-    setIsEditing: (isEditing: boolean) => void;
-    isEditable: boolean;
-    setPreviewDoc: (doc: Doc) => void;
-    setComputed: (script: string, doc: Doc, field: string, row: number, col: number) => boolean;
-    getField: (row: number, col?: number) => void;
-    showDoc: (doc: Doc | undefined, dataDoc?: any, screenX?: number, screenY?: number) => void;
-}
-
-@observer
-export class CollectionSchemaCell extends React.Component<CellProps> {
-    public static resolvedFieldKey(column: string, rowDoc: Doc) {
-        const fieldKey = column;
-        if (fieldKey.startsWith("*")) {
-            const rootKey = fieldKey.substring(1);
-            const allKeys = [...Array.from(Object.keys(rowDoc)), ...Array.from(Object.keys(Doc.GetProto(rowDoc)))];
-            const matchedKeys = allKeys.filter(key => key.includes(rootKey));
-            if (matchedKeys.length) return matchedKeys[0];
-        }
-        return fieldKey;
-    }
-    @observable protected _isEditing: boolean = false;
-    protected _focusRef = React.createRef<HTMLDivElement>();
-    protected _rowDoc = this.props.rowProps.original;
-    protected _rowDataDoc = Doc.GetProto(this.props.rowProps.original);
-    protected _dropDisposer?: DragManager.DragDropDisposer;
-    @observable contents: string = "";
-
-    componentDidMount() { document.addEventListener("keydown", this.onKeyDown); }
-    componentWillUnmount() { document.removeEventListener("keydown", this.onKeyDown); }
-
-    @action
-    onKeyDown = (e: KeyboardEvent): void => {
-        if (this.props.isFocused && this.props.isEditable && e.keyCode === KeyCodes.ENTER) {
-            document.removeEventListener("keydown", this.onKeyDown);
-            this._isEditing = true;
-            this.props.setIsEditing(true);
-        }
-    }
-
-    @action
-    isEditingCallback = (isEditing: boolean): void => {
-        document.removeEventListener("keydown", this.onKeyDown);
-        isEditing && document.addEventListener("keydown", this.onKeyDown);
-        this._isEditing = isEditing;
-        this.props.setIsEditing(isEditing);
-        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
-    }
-
-    @action
-    onPointerDown = async (e: React.PointerEvent): Promise<void> => {
-        this.onItemDown(e);
-        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
-        this.props.setPreviewDoc(this.props.rowProps.original);
-
-        let url: string;
-        if (url = StrCast(this.props.rowProps.row.href)) {
-            try {
-                new URL(url);
-                const temp = window.open(url)!;
-                temp.blur();
-                window.focus();
-            } catch { }
-        }
-
-        const doc = Cast(this._rowDoc[this.renderFieldKey], Doc, null);
-        doc && this.props.setPreviewDoc(doc);
-    }
-
-    @undoBatch
-    applyToDoc = (doc: Doc, row: number, col: number, run: (args?: { [name: string]: any }) => any) => {
-        const res = run({ this: doc, $r: row, $c: col, $: (r: number = 0, c: number = 0) => this.props.getField(r + row, c + col) });
-        if (!res.success) return false;
-        doc[this.renderFieldKey] = res.result;
-        return true;
-    }
-
-    private drop = (e: Event, de: DragManager.DropEvent) => {
-        if (de.complete.docDragData) {
-            if (de.complete.docDragData.draggedDocuments.length === 1) {
-                this._rowDataDoc[this.renderFieldKey] = de.complete.docDragData.draggedDocuments[0];
-            }
-            else {
-                const coll = Docs.Create.SchemaDocument([new SchemaHeaderField("title", "#f1efeb")], de.complete.docDragData.draggedDocuments, {});
-                this._rowDataDoc[this.renderFieldKey] = coll;
-            }
-            e.stopPropagation();
-        }
-    }
-
-    protected dropRef = (ele: HTMLElement | null) => {
-        this._dropDisposer?.();
-        ele && (this._dropDisposer = DragManager.MakeDropTarget(ele, this.drop.bind(this)));
-    }
-
-    returnHighlights(contents: string, positions?: number[]) {
-        if (positions) {
-            const results = [];
-            StrCast(this.props.Document._searchString);
-            const length = StrCast(this.props.Document._searchString).length;
-            const color = contents ? "black" : "grey";
-
-            results.push(<span key="-1" style={{ color }}>{contents?.slice(0, positions[0])}</span>);
-            positions.forEach((num, cur) => {
-                results.push(<span key={"start" + cur} style={{ backgroundColor: "#FFFF00", color }}>{contents?.slice(num, num + length)}</span>);
-                let end = 0;
-                cur === positions.length - 1 ? end = contents.length : end = positions[cur + 1];
-                results.push(<span key={"end" + cur} style={{ color }}>{contents?.slice(num + length, end)}</span>);
-            }
-            );
-            return results;
-        }
-        return <span style={{ color: contents ? "black" : "grey" }}>{contents ? contents?.valueOf() : "undefined"}</span>;
-    }
-
-    @computed get renderFieldKey() { return CollectionSchemaCell.resolvedFieldKey(this.props.rowProps.column.id!, this.props.rowProps.original); }
-    onItemDown = async (e: React.PointerEvent) => {
-        if (this.props.Document._searchDoc) {
-            const aliasdoc = await SearchUtil.GetAliasesOfDocument(this._rowDataDoc);
-            const targetContext = aliasdoc.length <= 0 ? undefined : Cast(aliasdoc[0].context, Doc, null);
-            DocumentManager.Instance.jumpToDocument(this._rowDoc, false, emptyFunction, targetContext,
-                undefined, undefined, undefined, () => this.props.setPreviewDoc(this._rowDoc));
-        }
-    }
-    renderCellWithType(type: string | undefined) {
-        const dragRef: React.RefObject<HTMLDivElement> = React.createRef();
-
-        const fieldKey = this.renderFieldKey;
-        const field = this._rowDoc[fieldKey];
-
-        const onPointerEnter = (e: React.PointerEvent): void => {
-            if (e.buttons === 1 && SnappingManager.GetIsDragging() && (type === "document" || type === undefined)) {
-                dragRef.current!.className = "collectionSchemaView-cellContainer doc-drag-over";
-            }
-        };
-        const onPointerLeave = (e: React.PointerEvent): void => {
-            dragRef.current!.className = "collectionSchemaView-cellContainer";
-        };
-
-        let contents = Field.toString(field as Field);
-        contents = contents === "" ? "--" : contents;
-
-        let className = "collectionSchemaView-cellWrapper";
-        if (this._isEditing) className += " editing";
-        if (this.props.isFocused && this.props.isEditable) className += " focused";
-        if (this.props.isFocused && !this.props.isEditable) className += " inactive";
-
-        const positions = [];
-        if (StrCast(this.props.Document._searchString).toLowerCase() !== "") {
-            let term = (field instanceof Promise) ? "...promise pending..." : contents.toLowerCase();
-            const search = StrCast(this.props.Document._searchString).toLowerCase();
-            let start = term.indexOf(search);
-            let tally = 0;
-            if (start !== -1) {
-                positions.push(start);
-            }
-            while (start < contents?.length && start !== -1) {
-                term = term.slice(start + search.length + 1);
-                tally += start + search.length + 1;
-                start = term.indexOf(search);
-                positions.push(tally + start);
-            }
-            if (positions.length > 1) {
-                positions.pop();
-            }
-        }
-        const placeholder = type === "number" ? "0" : contents === "" ? "--" : "undefined";
-        return (
-            <div className="collectionSchemaView-cellContainer" style={{ cursor: field instanceof Doc ? "grab" : "auto" }}
-                ref={dragRef} onPointerDown={this.onPointerDown} onClick={action(e => this._isEditing = true)} onPointerEnter={onPointerEnter} onPointerLeave={onPointerLeave}>
-                <div className={className} ref={this._focusRef} tabIndex={-1}>
-                    <div className="collectionSchemaView-cellContents" ref={type === undefined || type === "document" ? this.dropRef : null}>
-                        {!this.props.Document._searchDoc ?
-                            <EditableView
-                                editing={this._isEditing}
-                                isEditingCallback={this.isEditingCallback}
-                                display={"inline"}
-                                contents={contents}
-                                height={"auto"}
-                                maxHeight={Number(MAX_ROW_HEIGHT)}
-                                placeholder={placeholder}
-                                GetValue={() => {
-                                    const cfield = ComputedField.WithoutComputed(() => FieldValue(field));
-                                    const cscript = cfield instanceof ComputedField ? cfield.script.originalScript : undefined;
-                                    const cfinalScript = cscript?.split("return")[cscript.split("return").length - 1];
-                                    return cscript ? (cfinalScript?.endsWith(";") ? `:=${cfinalScript?.substring(0, cfinalScript.length - 2)}` : cfinalScript) :
-                                        Field.IsField(cfield) ? Field.toScriptString(cfield) : "";
-                                }}
-                                SetValue={action((value: string) => {
-                                    // sets what is displayed after the user makes an input
-                                    let retVal = false;
-                                    if (value.startsWith(":=") || value.startsWith("=:=")) {
-                                        // decides how to compute a value when given either of the above strings
-                                        const script = value.substring(value.startsWith("=:=") ? 3 : 2);
-                                        retVal = this.props.setComputed(script, value.startsWith(":=") ? this._rowDataDoc : this._rowDoc, this.renderFieldKey, this.props.row, this.props.col);
-                                    } else {
-                                        // check if the input is a number
-                                        let inputIsNum = true;
-                                        for (let s of value) {
-                                            if (isNaN(parseInt(s))) {
-                                                inputIsNum = false;
-                                            }
-                                        }
-                                        // check if the input is a boolean
-                                        let inputIsBool: boolean = value == "false" || value == "true";
-                                        // what to do in the case 
-                                        if (!inputIsNum && !inputIsBool && !value.startsWith("=")) {
-                                            // if it's not a number, it's a string, and should be processed as such
-                                            // strips the string of quotes when it is edited to prevent quotes form being added to the text automatically 
-                                            // after each edit
-                                            let valueSansQuotes = value;
-                                            if (this._isEditing) {
-                                                const vsqLength = valueSansQuotes.length;
-                                                // get rid of outer quotes
-                                                valueSansQuotes = valueSansQuotes.substring(value.startsWith("\"") ? 1 : 0,
-                                                    valueSansQuotes.charAt(vsqLength - 1) == "\"" ? vsqLength - 1 : vsqLength);
-                                            }
-                                            let inputAsString = '"';
-                                            // escape any quotes in the string
-                                            for (const i of valueSansQuotes) {
-                                                if (i == '"') {
-                                                    inputAsString += '\\"';
-                                                } else {
-                                                    inputAsString += i;
-                                                }
-                                            }
-                                            // add a closing quote
-                                            inputAsString += '"';
-                                            //two options here: we can strip off outer quotes or we can figure out what's going on with the script
-                                            const script = CompileScript(inputAsString, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            const changeMade = inputAsString.length !== value.length || inputAsString.length - 2 !== value.length
-                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
-                                            // handle numbers and expressions
-                                        } else if (inputIsNum || value.startsWith("=")) {
-                                            //TODO: make accept numbers
-                                            const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
-                                            // if commas are not stripped, the parser only considers the numbers after the last comma
-                                            let inputSansCommas = "";
-                                            for (let s of inputscript) {
-                                                if (!(s == ",")) {
-                                                    inputSansCommas += s;
-                                                }
-                                            }
-                                            const script = CompileScript(inputSansCommas, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
-                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
-                                            // handle booleans
-                                        } else if (inputIsBool) {
-                                            const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
-                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
-                                        }
-                                    }
-                                    if (retVal) {
-                                        this._isEditing = false; // need to set this here. otherwise, the assignment of the field will invalidate & cause render() to be called with the wrong value for 'editing'
-                                        this.props.setIsEditing(false);
-                                    }
-                                    return retVal;
-                                })}
-                                OnFillDown={async (value: string) => {
-                                    const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                    script.compiled && DocListCast(this.props.Document[this.props.fieldKey]).
-                                        forEach((doc, i) => value.startsWith(":=") ?
-                                            this.props.setComputed(value.substring(2), Doc.GetProto(doc), this.renderFieldKey, i, this.props.col) :
-                                            this.applyToDoc(Doc.GetProto(doc), i, this.props.col, script.run));
-                                }}
-                            />
-                            :
-                            this.returnHighlights(contents, positions)
-                        }
-                    </div >
-                </div>
-            </div>
-        );
-    }
-
-    render() { return this.renderCellWithType(undefined); }
-}
-
-@observer
-export class CollectionSchemaNumberCell extends CollectionSchemaCell { render() { return this.renderCellWithType("number"); } }
-
-@observer
-export class CollectionSchemaBooleanCell extends CollectionSchemaCell { render() { return this.renderCellWithType("boolean"); } }
-
-@observer
-export class CollectionSchemaStringCell extends CollectionSchemaCell { render() { return this.renderCellWithType("string"); } }
-
-@observer
-export class CollectionSchemaDateCell extends CollectionSchemaCell {
-    @computed get _date(): Opt<DateField> { return this._rowDoc[this.renderFieldKey] instanceof DateField ? DateCast(this._rowDoc[this.renderFieldKey]) : undefined; }
-
-    @action
-    handleChange = (date: any) => {
-        // const script = CompileScript(date.toString(), { requiredType: "Date", addReturn: true, params: { this: Doc.name } });
-        // if (script.compiled) {
-        //     this.applyToDoc(this._document, this.props.row, this.props.col, script.run);
-        // } else {
-        // ^ DateCast is always undefined for some reason, but that is what the field should be set to
-        this._rowDoc[this.renderFieldKey] = new DateField(date as Date);
-        //}
-    }
-
-    render() {
-        return !this.props.isFocused ? <span onPointerDown={this.onPointerDown}>{this._date ? Field.toString(this._date as Field) : "--"}</span> :
-            <DatePicker
-                selected={this._date?.date || new Date}
-                onSelect={date => this.handleChange(date)}
-                onChange={date => this.handleChange(date)}
-            />;
-    }
-}
-
-@observer
-export class CollectionSchemaDocCell extends CollectionSchemaCell {
-
-    _overlayDisposer?: () => void;
-
-    @computed get _doc() { return FieldValue(Cast(this._rowDoc[this.renderFieldKey], Doc)); }
-
-    @action
-    onSetValue = (value: string) => {
-        this._doc && (Doc.GetProto(this._doc).title = value);
-
-        const script = CompileScript(value, {
-            addReturn: true,
-            typecheck: false,
-            transformer: DocumentIconContainer.getTransformer()
-        });
-
-        const results = script.compiled && script.run();
-        if (results && results.success) {
-            this._rowDoc[this.renderFieldKey] = results.result;
-            return true;
-        }
-        return false;
-    }
-
-    componentWillUnmount() { this.onBlur(); }
-
-    onBlur = () => { this._overlayDisposer?.(); };
-    onFocus = () => {
-        this.onBlur();
-        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
-    }
-
-    @action
-    isEditingCallback = (isEditing: boolean): void => {
-        document.removeEventListener("keydown", this.onKeyDown);
-        isEditing && document.addEventListener("keydown", this.onKeyDown);
-        this._isEditing = isEditing;
-        this.props.setIsEditing(isEditing);
-        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
-    }
-
-    render() {
-        return !this._doc ? this.renderCellWithType("document") :
-            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1}
-                onPointerDown={this.onPointerDown}
-            >
-                <div className="collectionSchemaView-cellContents-document"
-                    style={{ padding: "5.9px" }}
-                    ref={this.dropRef}
-                    onFocus={this.onFocus}
-                    onBlur={this.onBlur}
-                >
-                    <EditableView
-                        editing={this._isEditing}
-                        isEditingCallback={this.isEditingCallback}
-                        display={"inline"}
-                        contents={this._doc.title || "--"}
-                        height={"auto"}
-                        maxHeight={Number(MAX_ROW_HEIGHT)}
-                        GetValue={() => StrCast(this._doc?.title)}
-                        SetValue={action((value: string) => {
-                            this.onSetValue(value);
-                            return true;
-                        })}
-                    />
-                </div >
-                <div onClick={() => this._doc && this.props.addDocTab(this._doc, "add:right")} className="collectionSchemaView-cellContents-docButton">
-                    <FontAwesomeIcon icon="external-link-alt" size="lg" />
-                </div>
-            </div>;
-    }
-}
-
-@observer
-export class CollectionSchemaImageCell extends CollectionSchemaCell {
-
-    choosePath(url: URL) {
-        if (url.protocol === "data") return url.href;
-        if (url.href.indexOf(window.location.origin) === -1) return Utils.CorsProxy(url.href);
-        if (!/\.(png|jpg|jpeg|gif|webp)$/.test(url.href.toLowerCase())) return url.href;//Why is this here
-
-        const ext = path.extname(url.href);
-        return url.href.replace(ext, "_o" + path.extname(url.href));
-    }
-
-    render() {
-        const field = Cast(this._rowDoc[this.renderFieldKey], ImageField, null); // retrieve the primary image URL that is being rendered from the data doc
-        const alts = DocListCast(this._rowDoc[this.renderFieldKey + "-alternates"]); // retrieve alternate documents that may be rendered as alternate images
-        const altpaths = alts.map(doc => Cast(doc[Doc.LayoutFieldKey(doc)], ImageField, null)?.url).filter(url => url).map(url => this.choosePath(url)); // access the primary layout data of the alternate documents
-        const paths = field ? [this.choosePath(field.url), ...altpaths] : altpaths;
-        const url = paths.length ? paths : [Utils.CorsProxy("http://www.cs.brown.edu/~bcz/noImage.png")];
-
-        const aspect = Doc.NativeAspect(this._rowDoc);
-        let width = Math.min(75, this.props.rowProps.width);
-        const height = Math.min(75, width / aspect);
-        width = height * aspect;
-
-        const reference = React.createRef<HTMLDivElement>();
-        return <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-            <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
-                <img src={url[0]}
-                    width={paths.length ? width : "20px"}
-                    height={paths.length ? height : "20px"} />
-            </div >
-        </div>;
-    }
-}
-
-
-@observer
-export class CollectionSchemaListCell extends CollectionSchemaCell {
-    _overlayDisposer?: () => void;
-
-    @computed get _field() { return this._rowDoc[this.renderFieldKey]; }
-    @computed get _optionsList() { return this._field as List<any>; }
-    @observable private _opened = false;
-    @observable private _text = "select an item";
-    @observable private _selectedNum = 0;
-
-    @action
-    onSetValue = (value: string) => {
-        // change if its a document
-        this._optionsList[this._selectedNum] = this._text = value;
-
-        (this._field as List<any>).splice(this._selectedNum, 1, value);
-    }
-
-    @action
-    onSelected = (element: string, index: number) => {
-        this._text = element;
-        this._selectedNum = index;
-    }
-
-    onFocus = () => {
-        this._overlayDisposer?.();
-        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
-    }
-
-    render() {
-        const link = false;
-        const reference = React.createRef<HTMLDivElement>();
-
-        if (this._optionsList?.length) {
-            const options = !this._opened ? (null) :
-                <div>
-                    {this._optionsList.map((element, index) => {
-                        const val = Field.toString(element);
-                        return <div className="collectionSchemaView-dropdownOption" key={index} style={{ padding: "6px" }} onPointerDown={(e) => this.onSelected(StrCast(element), index)} >
-                            {val}
-                        </div>;
-                    })}
-                </div>;
-
-            const plainText = <div style={{ padding: "5.9px" }}>{this._text}</div>;
-            const textarea = <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} style={{ padding: "5.9px" }} ref={this.dropRef} >
-                <EditableView
-                    editing={this._isEditing}
-                    isEditingCallback={this.isEditingCallback}
-                    display={"inline"}
-                    contents={this._text}
-                    height={"auto"}
-                    maxHeight={Number(MAX_ROW_HEIGHT)}
-                    GetValue={() => this._text}
-                    SetValue={action((value: string) => {
-                        // add special for params 
-                        this.onSetValue(value);
-                        return true;
-                    })}
-                />
-            </div >;
-
-            //☰
-            return (
-                <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-                    <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
-                        <div className="collectionSchemaView-dropDownWrapper">
-                            <button type="button" className="collectionSchemaView-dropdownButton" style={{ right: "length", position: "relative" }}
-                                onClick={action(e => this._opened = !this._opened)} >
-                                <FontAwesomeIcon icon={this._opened ? "caret-up" : "caret-down"} size="sm" />
-                            </button>
-                            <div className="collectionSchemaView-dropdownText"> {link ? plainText : textarea} </div>
-                        </div>
-                        {options}
-                    </div >
-                </div>
-            );
-        }
-        return this.renderCellWithType("list");
-    }
-}
-
-
-@observer
-export class CollectionSchemaCheckboxCell extends CollectionSchemaCell {
-    @computed get _isChecked() { return BoolCast(this._rowDoc[this.renderFieldKey]); }
-
-    render() {
-        const reference = React.createRef<HTMLDivElement>();
-        return (
-            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-                <input type="checkbox" checked={this._isChecked} onChange={e => this._rowDoc[this.renderFieldKey] = e.target.checked} />
-            </div>
-        );
-    }
-}
-
-
-@observer
-export class CollectionSchemaButtons extends CollectionSchemaCell {
-    render() {
-        return !this.props.Document._searchDoc || ![DocumentType.PDF, DocumentType.RTF].includes(StrCast(this._rowDoc.type) as DocumentType) ? <></> :
-            <div style={{ paddingTop: 8, paddingLeft: 3 }} >
-                <button style={{ padding: 2, left: 77 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, true)}>
-                    <FontAwesomeIcon icon="arrow-up" size="sm" />
-                </button>
-                <button style={{ padding: 2 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, false)} >
-                    <FontAwesomeIcon icon="arrow-down" size="sm" />
-                </button>
-            </div>;
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/CollectionSchemaHeaders.tsx b/src/client/views/collections/CollectionSchemaHeaders.tsx
deleted file mode 100644
index 3b52e6408..000000000
--- a/src/client/views/collections/CollectionSchemaHeaders.tsx
+++ /dev/null
@@ -1,518 +0,0 @@
-import React = require("react");
-import { IconProp, library } from "@fortawesome/fontawesome-svg-core";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action, computed, observable, runInAction } from "mobx";
-import { observer } from "mobx-react";
-import { Doc, DocListCast, Opt } from "../../../fields/Doc";
-import { listSpec } from "../../../fields/Schema";
-import { PastelSchemaPalette, SchemaHeaderField } from "../../../fields/SchemaHeaderField";
-import { ScriptField } from "../../../fields/ScriptField";
-import { Cast, StrCast } from "../../../fields/Types";
-import { undoBatch } from "../../util/UndoManager";
-import { SearchBox } from "../search/SearchBox";
-import { ColumnType } from "./CollectionSchemaView";
-import "./CollectionSchemaView.scss";
-import { CollectionView } from "./CollectionView";
-
-const higflyout = require("@hig/flyout");
-export const { anchorPoints } = higflyout;
-export const Flyout = higflyout.default;
-
-
-export interface AddColumnHeaderProps {
-    createColumn: () => void;
-}
-
-@observer
-export class CollectionSchemaAddColumnHeader extends React.Component<AddColumnHeaderProps> {
-    render() {
-        return (
-            <button className="add-column" onClick={() => this.props.createColumn()}><FontAwesomeIcon icon="plus" size="sm" /></button>
-        );
-    }
-}
-
-
-export interface ColumnMenuProps {
-    columnField: SchemaHeaderField;
-    // keyValue: string;
-    possibleKeys: string[];
-    existingKeys: string[];
-    // keyType: ColumnType;
-    typeConst: boolean;
-    menuButtonContent: JSX.Element;
-    addNew: boolean;
-    onSelect: (oldKey: string, newKey: string, addnew: boolean) => void;
-    setIsEditing: (isEditing: boolean) => void;
-    deleteColumn: (column: string) => void;
-    onlyShowOptions: boolean;
-    setColumnType: (column: SchemaHeaderField, type: ColumnType) => void;
-    setColumnSort: (column: SchemaHeaderField, desc: boolean | undefined) => void;
-    anchorPoint?: any;
-    setColumnColor: (column: SchemaHeaderField, color: string) => void;
-}
-@observer
-export class CollectionSchemaColumnMenu extends React.Component<ColumnMenuProps> {
-    @observable private _isOpen: boolean = false;
-    @observable private _node: HTMLDivElement | null = null;
-
-    componentDidMount() { document.addEventListener("pointerdown", this.detectClick); }
-
-    componentWillUnmount() { document.removeEventListener("pointerdown", this.detectClick); }
-
-    @action
-    detectClick = (e: PointerEvent) => {
-        !this._node?.contains(e.target as Node) && this.props.setIsEditing(this._isOpen = false);
-    }
-
-    @action
-    toggleIsOpen = (): void => {
-        this.props.setIsEditing(this._isOpen = !this._isOpen);
-    }
-
-    changeColumnType = (type: ColumnType) => {
-        this.props.setColumnType(this.props.columnField, type);
-    }
-
-    changeColumnSort = (desc: boolean | undefined) => {
-        this.props.setColumnSort(this.props.columnField, desc);
-    }
-
-    changeColumnColor = (color: string) => {
-        this.props.setColumnColor(this.props.columnField, color);
-    }
-
-    @action
-    setNode = (node: HTMLDivElement): void => {
-        if (node) {
-            this._node = node;
-        }
-    }
-
-    renderTypes = () => {
-        if (this.props.typeConst) return (null);
-
-        const type = this.props.columnField.type;
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Column type:</label>
-                <div className="columnMenu-types">
-                    <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Any)}>
-                        <FontAwesomeIcon icon={"align-justify"} size="sm" />
-                        Any
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Number)}>
-                        <FontAwesomeIcon icon={"hashtag"} size="sm" />
-                        Number
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.String)}>
-                        <FontAwesomeIcon icon={"font"} size="sm" />
-                        Text
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Boolean)}>
-                        <FontAwesomeIcon icon={"check-square"} size="sm" />
-                        Checkbox
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.List)}>
-                        <FontAwesomeIcon icon={"list-ul"} size="sm" />
-                        List
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Doc)}>
-                        <FontAwesomeIcon icon={"file"} size="sm" />
-                        Document
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Image)}>
-                        <FontAwesomeIcon icon={"image"} size="sm" />
-                        Image
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Date)}>
-                        <FontAwesomeIcon icon={"calendar"} size="sm" />
-                        Date
-                    </div>
-                </div>
-            </div >
-        );
-    }
-
-    renderSorting = () => {
-        const sort = this.props.columnField.desc;
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Sort by:</label>
-                <div className="columnMenu-sort">
-                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.changeColumnSort(true)}>
-                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
-                        Sort descending
-                    </div>
-                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.changeColumnSort(false)}>
-                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
-                        Sort ascending
-                    </div>
-                    <div className="columnMenu-option" onClick={() => this.changeColumnSort(undefined)}>
-                        <FontAwesomeIcon icon="times" size="sm" />
-                        Clear sorting
-                    </div>
-                </div>
-            </div>
-        );
-    }
-
-    renderColors = () => {
-        const selected = this.props.columnField.color;
-
-        const pink = PastelSchemaPalette.get("pink2");
-        const purple = PastelSchemaPalette.get("purple2");
-        const blue = PastelSchemaPalette.get("bluegreen1");
-        const yellow = PastelSchemaPalette.get("yellow4");
-        const red = PastelSchemaPalette.get("red2");
-        const gray = "#f1efeb";
-
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Color:</label>
-                <div className="columnMenu-colors">
-                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.changeColumnColor(pink!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.changeColumnColor(purple!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.changeColumnColor(blue!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.changeColumnColor(yellow!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.changeColumnColor(red!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.changeColumnColor(gray)}></div>
-                </div>
-            </div>
-        );
-    }
-
-    renderContent = () => {
-        return (
-            <div className="collectionSchema-header-menuOptions">
-                {this.props.onlyShowOptions ? <></> :
-                    <>
-                        {this.renderTypes()}
-                        {this.renderSorting()}
-                        {this.renderColors()}
-                        <div className="collectionSchema-headerMenu-group">
-                            <button onClick={() => this.props.deleteColumn(this.props.columnField.heading)}>Delete Column</button>
-                        </div>
-                    </>
-                }
-            </div>
-        );
-    }
-
-    render() {
-        return (
-            <div className="collectionSchema-header-menu" ref={this.setNode}>
-                <Flyout anchorPoint={this.props.anchorPoint ? this.props.anchorPoint : anchorPoints.TOP_CENTER} content={this.renderContent()}>
-                    <div className="collectionSchema-header-toggler" onClick={() => this.toggleIsOpen()}>{this.props.menuButtonContent}</div>
-                </ Flyout >
-            </div>
-        );
-    }
-}
-
-
-export interface KeysDropdownProps {
-    keyValue: string;
-    possibleKeys: string[];
-    existingKeys: string[];
-    canAddNew: boolean;
-    addNew: boolean;
-    onSelect: (oldKey: string, newKey: string, addnew: boolean, filter?: string) => void;
-    setIsEditing: (isEditing: boolean) => void;
-    width?: string;
-    docs?: Doc[];
-    Document: Doc;
-    dataDoc: Doc | undefined;
-    fieldKey: string;
-    ContainingCollectionDoc: Doc | undefined;
-    ContainingCollectionView: Opt<CollectionView>;
-    active?: (outsideReaction?: boolean) => boolean;
-    openHeader: (column: any, screenx: number, screeny: number) => void;
-    col: SchemaHeaderField;
-    icon: IconProp;
-}
-@observer
-export class KeysDropdown extends React.Component<KeysDropdownProps> {
-    @observable private _key: string = this.props.keyValue;
-    @observable private _searchTerm: string = this.props.keyValue;
-    @observable private _isOpen: boolean = false;
-    @observable private _node: HTMLDivElement | null = null;
-    @observable private _inputRef: React.RefObject<HTMLInputElement> = React.createRef();
-
-    @action setSearchTerm = (value: string): void => { this._searchTerm = value; };
-    @action setKey = (key: string): void => { this._key = key; };
-    @action setIsOpen = (isOpen: boolean): void => { this._isOpen = isOpen; };
-
-    @action
-    onSelect = (key: string): void => {
-        this.props.onSelect(this._key, key, this.props.addNew);
-        this.setKey(key);
-        this._isOpen = false;
-        this.props.setIsEditing(false);
-    }
-
-    @action
-    setNode = (node: HTMLDivElement): void => {
-        if (node) {
-            this._node = node;
-        }
-    }
-
-    componentDidMount() {
-        document.addEventListener("pointerdown", this.detectClick);
-        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
-        if (filters?.some(filter => filter.split(":")[0] === this._key)) {
-            runInAction(() => this.closeResultsVisibility = "contents");
-        }
-    }
-
-    @action
-    detectClick = (e: PointerEvent): void => {
-        if (this._node && this._node.contains(e.target as Node)) {
-        } else {
-            this._isOpen = false;
-            this.props.setIsEditing(false);
-        }
-    }
-
-    private tempfilter: string = "";
-    @undoBatch
-    onKeyDown = (e: React.KeyboardEvent): void => {
-        if (e.key === "Enter") {
-            if (this._searchTerm.includes(":")) {
-                const colpos = this._searchTerm.indexOf(":");
-                const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
-                if (temp === "") {
-                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
-                    this.updateFilter();
-                }
-                else {
-                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
-                    this.tempfilter = temp;
-                    Doc.setDocFilter(this.props.Document, this._key, temp, "check");
-                    this.props.col.setColor("green");
-                    this.closeResultsVisibility = "contents";
-                }
-            }
-            else {
-                Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
-                this.updateFilter();
-                if (this.showKeys.length) {
-                    this.onSelect(this.showKeys[0]);
-                } else if (this._searchTerm !== "" && this.props.canAddNew) {
-                    this.setSearchTerm(this._searchTerm || this._key);
-                    this.onSelect(this._searchTerm);
-                }
-            }
-        }
-    }
-
-    onChange = (val: string): void => {
-        this.setSearchTerm(val);
-    }
-
-    @action
-    onFocus = (e: React.FocusEvent): void => {
-        this._isOpen = true;
-        this.props.setIsEditing(true);
-    }
-
-    @computed get showKeys() {
-        const whitelistKeys = ["context", "author", "*lastModified", "text", "data", "tags", "creationDate"];
-        const keyOptions = this._searchTerm === "" ? this.props.possibleKeys : this.props.possibleKeys.filter(key => key.toUpperCase().indexOf(this._searchTerm.toUpperCase()) > -1);
-        const showKeys = new Set<string>();
-        [...keyOptions, ...whitelistKeys].forEach(key => (!Doc.UserDoc().noviceMode ||
-            whitelistKeys.includes(key)
-            || ((!key.startsWith("_") && key[0] === key[0].toUpperCase()) || key[0] === "#")) ? showKeys.add(key) : null);
-        return Array.from(showKeys.keys()).filter(key => !this._searchTerm || key.includes(this._searchTerm));
-    }
-    @action
-    renderOptions = (): JSX.Element[] | JSX.Element => {
-        if (!this._isOpen) {
-            this.defaultMenuHeight = 0;
-            return <></>;
-        }
-        const options = this.showKeys.map(key => {
-            return <div key={key} className="key-option" style={{
-                border: "1px solid lightgray",
-                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
-            }}
-                onPointerDown={e => {
-                    e.stopPropagation();
-                }}
-                onClick={() => {
-                    this.onSelect(key);
-                    this.setSearchTerm("");
-                }}>{key}</div>;
-        });
-
-        // if search term does not already exist as a group type, give option to create new group type
-
-        if (this._key !== this._searchTerm.slice(0, this._key.length)) {
-            if (this._searchTerm !== "" && this.props.canAddNew) {
-                options.push(<div key={""} className="key-option" style={{
-                    border: "1px solid lightgray", width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
-                }}
-                    onClick={() => { this.onSelect(this._searchTerm); this.setSearchTerm(""); }}>
-                    Create "{this._searchTerm}" key</div>);
-            }
-        }
-
-        if (options.length === 0) {
-            this.defaultMenuHeight = 0;
-        }
-        else {
-            if (this.props.docs) {
-                const panesize = this.props.docs.length * 30;
-                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-            else {
-                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-        }
-        return options;
-    }
-
-    docSafe: Doc[] = [];
-
-    @action
-    renderFilterOptions = (): JSX.Element[] | JSX.Element => {
-        if (!this._isOpen || !this.props.dataDoc) {
-            this.defaultMenuHeight = 0;
-            return <></>;
-        }
-        const keyOptions: string[] = [];
-        const colpos = this._searchTerm.indexOf(":");
-        const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
-        if (this.docSafe.length === 0) {
-            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
-        }
-        const docs = this.docSafe;
-        docs.forEach((doc) => {
-            const key = StrCast(doc[this._key]);
-            if (keyOptions.includes(key) === false && key.includes(temp) && key !== "") {
-                keyOptions.push(key);
-            }
-        });
-
-        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
-        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
-            this.props.col.setColor("rgb(241, 239, 235)");
-            this.closeResultsVisibility = "none";
-        }
-        for (let i = 0; i < (filters?.length ?? 0) - 1; i++) {
-            if (filters![i] === this.props.col.heading && keyOptions.includes(filters![i].split(":")[1]) === false) {
-                keyOptions.push(filters![i + 1]);
-            }
-        }
-        const options = keyOptions.map(key => {
-            let bool = false;
-            if (filters !== undefined) {
-                const ind = filters.findIndex(filter => filter.split(":")[0] === key);
-                const fields = ind === -1 ? undefined : filters[ind].split(":");
-                bool = fields ? fields[1] === "check" : false;
-            }
-            return <div key={key} className="key-option" style={{
-                border: "1px solid lightgray", paddingLeft: 5, textAlign: "left",
-                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white", backgroundColor: "white",
-            }}
-            >
-                <input type="checkbox"
-                    onPointerDown={e => e.stopPropagation()}
-                    onClick={e => e.stopPropagation()}
-                    onChange={(e) => {
-                        e.target.checked === true ? Doc.setDocFilter(this.props.Document, this._key, key, "check") : Doc.setDocFilter(this.props.Document, this._key, key, "remove");
-                        e.target.checked === true ? this.closeResultsVisibility = "contents" : console.log("");
-                        e.target.checked === true ? this.props.col.setColor("green") : this.updateFilter();
-                        e.target.checked === true && SearchBox.Instance.filter === true ? Doc.setDocFilter(docs[0], this._key, key, "check") : Doc.setDocFilter(docs[0], this._key, key, "remove");
-                    }}
-                    checked={bool}
-                />
-                <span style={{ paddingLeft: 4 }}>
-                    {key}
-                </span>
-
-            </div>;
-        });
-        if (options.length === 0) {
-            this.defaultMenuHeight = 0;
-        }
-        else {
-            if (this.props.docs) {
-                const panesize = this.props.docs.length * 30;
-                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-            else {
-                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-
-        }
-        return options;
-    }
-
-    @observable defaultMenuHeight = 0;
-
-
-    updateFilter() {
-        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
-        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
-            this.props.col.setColor("rgb(241, 239, 235)");
-            this.closeResultsVisibility = "none";
-        }
-    }
-
-    @computed get scriptField() {
-        const scriptText = "setDocFilter(containingTreeView, heading, this.title, checked)";
-        const script = ScriptField.MakeScript(scriptText, { this: Doc.name, heading: "string", checked: "string", containingTreeView: Doc.name });
-        return script ? () => script : undefined;
-    }
-    filterBackground = () => "rgba(105, 105, 105, 0.432)";
-    @observable filterOpen: boolean | undefined = undefined;
-    closeResultsVisibility: string = "none";
-
-    removeFilters = (e: React.PointerEvent): void => {
-        const keyOptions: string[] = [];
-        if (this.docSafe.length === 0 && this.props.dataDoc) {
-            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
-        }
-        const docs = this.docSafe;
-        docs.forEach((doc) => {
-            const key = StrCast(doc[this._key]);
-            if (keyOptions.includes(key) === false) {
-                keyOptions.push(key);
-            }
-        });
-
-        Doc.setDocFilter(this.props.Document, this._key, "", "remove");
-        this.props.col.setColor("rgb(241, 239, 235)");
-        this.closeResultsVisibility = "none";
-    }
-    render() {
-        return (
-            <div style={{ display: "flex" }} ref={this.setNode}>
-                <FontAwesomeIcon onClick={e => { this.props.openHeader(this.props.col, e.clientX, e.clientY); e.stopPropagation(); }} icon={this.props.icon} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} />
-
-                {/* <FontAwesomeIcon icon={fa.faSearchMinus} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} onClick={e => {
-                    runInAction(() => { this._isOpen === undefined ? this._isOpen = true : this._isOpen = !this._isOpen })
-                }} /> */}
-
-                <div className="keys-dropdown" style={{ zIndex: 1, width: this.props.width, maxWidth: this.props.width }}>
-                    <input className="keys-search" style={{ width: "100%" }}
-                        ref={this._inputRef} type="text" value={this._searchTerm} placeholder="Column key" onKeyDown={this.onKeyDown}
-                        onChange={e => this.onChange(e.target.value)}
-                        onClick={(e) => { e.stopPropagation(); this._inputRef.current?.focus(); }}
-                        onFocus={this.onFocus} ></input>
-                    <div style={{ display: this.closeResultsVisibility }}>
-                        <FontAwesomeIcon onPointerDown={this.removeFilters} icon={"times-circle"} size="lg"
-                            style={{ cursor: "hand", color: "grey", padding: 2, left: -20, top: -1, height: 15, position: "relative" }} />
-                    </div>
-                    {!this._isOpen ? (null) : <div className="keys-options-wrapper" style={{
-                        width: this.props.width, maxWidth: this.props.width, height: "auto",
-                    }}>
-                        {this._searchTerm.includes(":") ? this.renderFilterOptions() : this.renderOptions()}
-                    </div>}
-                </div >
-            </div>
-        );
-    }
-}
diff --git a/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx b/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
deleted file mode 100644
index 149677976..000000000
--- a/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
+++ /dev/null
@@ -1,261 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action } from "mobx";
-import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
-import { Doc } from "../../../fields/Doc";
-import { SchemaHeaderField } from "../../../fields/SchemaHeaderField";
-import { Cast, FieldValue, StrCast } from "../../../fields/Types";
-import { DocumentManager } from "../../util/DocumentManager";
-import { DragManager, dropActionType, SetupDrag } from "../../util/DragManager";
-import { SnappingManager } from "../../util/SnappingManager";
-import { Transform } from "../../util/Transform";
-import { undoBatch } from "../../util/UndoManager";
-import { ContextMenu } from "../ContextMenu";
-import "./CollectionSchemaView.scss";
-
-export interface MovableColumnProps {
-    columnRenderer: TableCellRenderer;
-    columnValue: SchemaHeaderField;
-    allColumns: SchemaHeaderField[];
-    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columns: SchemaHeaderField[]) => void;
-    ScreenToLocalTransform: () => Transform;
-}
-export class MovableColumn extends React.Component<MovableColumnProps> {
-    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
-    private _colDropDisposer?: DragManager.DragDropDisposer;
-    private _startDragPosition: { x: number, y: number } = { x: 0, y: 0 };
-    private _sensitivity: number = 16;
-    private _dragRef: React.RefObject<HTMLDivElement> = React.createRef();
-
-    onPointerEnter = (e: React.PointerEvent): void => {
-        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
-            this._header!.current!.className = "collectionSchema-col-wrapper";
-            document.addEventListener("pointermove", this.onDragMove, true);
-        }
-    }
-    onPointerLeave = (e: React.PointerEvent): void => {
-        this._header!.current!.className = "collectionSchema-col-wrapper";
-        document.removeEventListener("pointermove", this.onDragMove, true);
-        !e.buttons && document.removeEventListener("pointermove", this.onPointerMove);
-    }
-    onDragMove = (e: PointerEvent): void => {
-        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
-        const before = x[0] < bounds[0];
-        this._header!.current!.className = "collectionSchema-col-wrapper";
-        if (before) this._header!.current!.className += " col-before";
-        if (!before) this._header!.current!.className += " col-after";
-        e.stopPropagation();
-    }
-
-    createColDropTarget = (ele: HTMLDivElement) => {
-        this._colDropDisposer?.();
-        if (ele) {
-            this._colDropDisposer = DragManager.MakeDropTarget(ele, this.colDrop.bind(this));
-        }
-    }
-
-    colDrop = (e: Event, de: DragManager.DropEvent) => {
-        document.removeEventListener("pointermove", this.onDragMove, true);
-        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
-        const before = x[0] < bounds[0];
-        const colDragData = de.complete.columnDragData;
-        if (colDragData) {
-            e.stopPropagation();
-            this.props.reorderColumns(colDragData.colKey, this.props.columnValue, before, this.props.allColumns);
-            return true;
-        }
-        return false;
-    }
-
-    onPointerMove = (e: PointerEvent) => {
-        const onRowMove = (e: PointerEvent) => {
-            e.stopPropagation();
-            e.preventDefault();
-
-            document.removeEventListener("pointermove", onRowMove);
-            document.removeEventListener('pointerup', onRowUp);
-            const dragData = new DragManager.ColumnDragData(this.props.columnValue);
-            DragManager.StartColumnDrag(this._dragRef.current!, dragData, e.x, e.y);
-        };
-        const onRowUp = (): void => {
-            document.removeEventListener("pointermove", onRowMove);
-            document.removeEventListener('pointerup', onRowUp);
-        };
-        if (e.buttons === 1) {
-            const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX - this._startDragPosition.x, e.clientY - this._startDragPosition.y);
-            if (Math.abs(dx) + Math.abs(dy) > this._sensitivity) {
-                document.removeEventListener("pointermove", this.onPointerMove);
-                e.stopPropagation();
-
-                document.addEventListener("pointermove", onRowMove);
-                document.addEventListener("pointerup", onRowUp);
-            }
-        }
-    }
-
-    onPointerUp = (e: React.PointerEvent) => {
-        document.removeEventListener("pointermove", this.onPointerMove);
-    }
-
-    @action
-    onPointerDown = (e: React.PointerEvent, ref: React.RefObject<HTMLDivElement>) => {
-        this._dragRef = ref;
-        const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX, e.clientY);
-        if (!(e.target as any)?.tagName.includes("INPUT")) {
-            this._startDragPosition = { x: dx, y: dy };
-            document.addEventListener("pointermove", this.onPointerMove);
-        }
-    }
-
-
-    render() {
-        const reference = React.createRef<HTMLDivElement>();
-
-        return (
-            <div className="collectionSchema-col" ref={this.createColDropTarget}>
-                <div className="collectionSchema-col-wrapper" ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
-                    <div className="col-dragger" ref={reference} onPointerDown={e => this.onPointerDown(e, reference)} onPointerUp={this.onPointerUp}>
-                        {this.props.columnRenderer}
-                    </div>
-                </div>
-            </div>
-        );
-    }
-}
-
-export interface MovableRowProps {
-    rowInfo: RowInfo;
-    ScreenToLocalTransform: () => Transform;
-    addDoc: (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => boolean;
-    removeDoc: (doc: Doc | Doc[]) => boolean;
-    rowFocused: boolean;
-    textWrapRow: (doc: Doc) => void;
-    rowWrapped: boolean;
-    dropAction: string;
-    addDocTab: any;
-}
-
-export class MovableRow extends React.Component<MovableRowProps> {
-    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
-    private _rowDropDisposer?: DragManager.DragDropDisposer;
-
-    // Event listeners are only necessary when the user is hovering over the table
-    // Create one when the mouse starts hovering...
-    onPointerEnter = (e: React.PointerEvent): void => {
-        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
-            this._header!.current!.className = "collectionSchema-row-wrapper";
-            document.addEventListener("pointermove", this.onDragMove, true);
-        }
-    }
-    // ... and delete it when the mouse leaves
-    onPointerLeave = (e: React.PointerEvent): void => {
-        this._header!.current!.className = "collectionSchema-row-wrapper";
-        document.removeEventListener("pointermove", this.onDragMove, true);
-    }
-    // The method for the event listener, reorders columns when dragged to their new locations.
-    onDragMove = (e: PointerEvent): void => {
-        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
-        const before = x[1] < bounds[1];
-        this._header!.current!.className = "collectionSchema-row-wrapper";
-        if (before) this._header!.current!.className += " row-above";
-        if (!before) this._header!.current!.className += " row-below";
-        e.stopPropagation();
-    }
-    componentWillUnmount() {
-
-        this._rowDropDisposer?.();
-    }
-    //
-    createRowDropTarget = (ele: HTMLDivElement) => {
-        this._rowDropDisposer?.();
-        if (ele) {
-            this._rowDropDisposer = DragManager.MakeDropTarget(ele, this.rowDrop.bind(this));
-        }
-    }
-    // Controls what hppens when a row is dragged and dropped
-    rowDrop = (e: Event, de: DragManager.DropEvent) => {
-        this.onPointerLeave(e as any);
-        const rowDoc = FieldValue(Cast(this.props.rowInfo.original, Doc));
-        if (!rowDoc) return false;
-
-        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
-        const before = x[1] < bounds[1];
-
-        const docDragData = de.complete.docDragData;
-        if (docDragData) {
-            e.stopPropagation();
-            if (docDragData.draggedDocuments[0] === rowDoc) return true;
-            const addDocument = (doc: Doc | Doc[]) => this.props.addDoc(doc, rowDoc, before);
-            const movedDocs = docDragData.draggedDocuments;
-            return (docDragData.dropAction || docDragData.userDropAction) ?
-                docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before) || added, false)
-                : (docDragData.moveDocument) ?
-                    movedDocs.reduce((added: boolean, d) => docDragData.moveDocument?.(d, rowDoc, addDocument) || added, false)
-                    : docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before), false);
-        }
-        return false;
-    }
-
-    onRowContextMenu = (e: React.MouseEvent): void => {
-        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
-        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
-    }
-
-    @undoBatch
-    @action
-    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
-        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
-        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
-    }
-
-    @action
-    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
-        console.log("yes");
-        if (e.key === "Backspace" || e.key === "Delete") {
-            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
-        }
-    }
-
-    render() {
-        const { children = null, rowInfo } = this.props;
-
-        if (!rowInfo) {
-            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
-        }
-
-        const { original } = rowInfo;
-        const doc = FieldValue(Cast(original, Doc));
-
-        if (!doc) return (null);
-
-        const reference = React.createRef<HTMLDivElement>();
-        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
-
-        let className = "collectionSchema-row";
-        if (this.props.rowFocused) className += " row-focused";
-        if (this.props.rowWrapped) className += " row-wrapped";
-
-        return (
-            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
-                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
-                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
-                        <div className="row-dragger">
-                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
-                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
-                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
-                        </div>
-                        {children}
-                    </ReactTableDefaults.TrComponent>
-                </div>
-            </div>
-        );
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/CollectionSchemaView.scss b/src/client/views/collections/CollectionSchemaView.scss
deleted file mode 100644
index 2bdd280ec..000000000
--- a/src/client/views/collections/CollectionSchemaView.scss
+++ /dev/null
@@ -1,641 +0,0 @@
-@import "../globalCssVariables";
-
-.collectionSchemaView-container {
-    border-width: $COLLECTION_BORDER_WIDTH;
-    border-color: $intermediate-color;
-    border-style: solid;
-    border-radius: $border-radius;
-    box-sizing: border-box;
-    position: relative;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    margin-top: 0;
-    transition: top 0.5s;
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: nowrap;
-    touch-action: none;
-
-    div {
-        touch-action: none;
-    }
-
-
-    .collectionSchemaView-tableContainer {
-        width: 100%;
-        height: 100%;
-    }
-
-    .collectionSchemaView-dividerDragger {
-        position: relative;
-        height: 100%;
-        width: $SCHEMA_DIVIDER_WIDTH;
-        z-index: 20;
-        right: 0;
-        top: 0;
-        background: gray;
-        cursor: col-resize;
-    }
-
-    // .documentView-node:first-child {
-    //     background: $light-color;
-    // }
-}
-
-.collectionSchemaView-searchContainer {
-    border-width: $COLLECTION_BORDER_WIDTH;
-    border-color: $intermediate-color;
-    border-style: solid;
-    border-radius: $border-radius;
-    box-sizing: border-box;
-    position: relative;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    margin-top: 0;
-    transition: top 0.5s;
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: nowrap;
-    touch-action: none;
-    padding: 2px;
-
-    div {
-        touch-action: none;
-    }
-
-
-    .collectionSchemaView-tableContainer {
-        width: 100%;
-        height: 100%;
-    }
-
-    .collectionSchemaView-dividerDragger {
-        position: relative;
-        height: 100%;
-        width: 20px;
-        z-index: 20;
-        right: 0;
-        top: 0;
-        background: gray;
-        cursor: col-resize;
-    }
-
-    // .documentView-node:first-child {
-    //     background: $light-color;
-    // }
-}
-
-.ReactTable {
-    width: 100%;
-    background: white;
-    box-sizing: border-box;
-    border: none !important;
-    float: none !important;
-
-    .rt-table {
-        height: 100%;
-        display: -webkit-inline-box;
-        direction: ltr;
-        overflow: visible;
-    }
-    .rt-noData {
-        display: none;
-    }
-
-    .rt-thead {
-        width: 100%;
-        z-index: 100;
-        overflow-y: visible;
-
-        &.-header {
-            font-size: 12px;
-            height: 30px;
-            box-shadow: none;
-            z-index: 100;
-            overflow-y: visible;
-        }
-
-        .rt-resizable-header-content {
-            height: 100%;
-            overflow: visible;
-        }
-
-        .rt-th {
-            padding: 0;
-            border: solid lightgray;
-            border-width: 0 1px;
-            border-bottom: 2px solid lightgray;
-        }
-    }
-
-    .rt-th {
-        font-size: 13px;
-        text-align: center;
-
-        &:last-child {
-            overflow: visible;
-        }
-    }
-
-    .rt-tbody {
-        width: 100%;
-        direction: rtl;
-        overflow: visible;
-
-        .rt-td {
-            border-right: 1px solid rgba(0, 0, 0, 0.2);
-        }
-    }
-
-    .rt-tr-group {
-        direction: ltr;
-        flex: 0 1 auto;
-        min-height: 30px;
-        border: 0 !important;
-    }
-
-    .rt-tr {
-        width: 100%;
-        min-height: 30px;
-    }
-
-    .rt-td {
-        padding: 0;
-        font-size: 13px;
-        text-align: center;
-        white-space: nowrap;
-        display: flex;
-        align-items: center;
-
-        .imageBox-cont {
-            position: relative;
-            max-height: 100%;
-        }
-
-        .imageBox-cont img {
-            object-fit: contain;
-            max-width: 100%;
-            height: 100%;
-        }
-
-        .videoBox-cont {
-            object-fit: contain;
-            width: auto;
-            height: 100%;
-        }
-    }
-    .rt-td.rt-expandable {
-        display: flex;
-        align-items: center;
-        height: inherit;
-    }
-
-    .rt-resizer {
-        width: 8px;
-        right: -4px;
-    }
-
-    .rt-resizable-header {
-        padding: 0;
-        height: 30px;
-    }
-
-    .rt-resizable-header:last-child {
-        overflow: visible;
-
-        .rt-resizer {
-            width: 5px !important;
-        }
-    }
-}
-
-.documentView-node-topmost {
-    text-align: left;
-    transform-origin: center top;
-    display: inline-block;
-}
-
-.collectionSchema-col {
-    height: 100%;
-}
-
-
-.collectionSchema-header-menu {
-    height: auto;
-    z-index: 100;
-    position: absolute;
-    background: white;
-    padding: 5px;
-    position: fixed;
-    background: white;
-    border: black 1px solid;
-
-    .collectionSchema-header-toggler {
-        z-index: 100;
-        width: 100%;
-        height: 100%;
-        padding: 4px;
-        letter-spacing: 2px;
-        text-transform: uppercase;
-
-        svg {
-            margin-right: 4px;
-        }
-    }
-}
-
-.collectionSchemaView-header {
-    height: 100%;
-    color: gray;
-    z-index: 100;
-    overflow-y: visible;
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: wrap;
-}
-
-button.add-column {
-    width: 28px;
-}
-
-.collectionSchema-header-menuOptions {
-    color: black;
-    width: 180px;
-    text-align: left;
-
-    .collectionSchema-headerMenu-group {
-        padding: 7px 0;
-        border-bottom: 1px solid lightgray;
-        cursor: pointer;
-
-        &:first-child {
-            padding-top: 0;
-        }
-
-        &:last-child {
-            border: none;
-            text-align: center;
-            padding: 12px 0 0 0;
-        }
-    }
-
-    label {
-        color: $main-accent;
-        font-weight: normal;
-        letter-spacing: 2px;
-        text-transform: uppercase;
-    }
-
-    input {
-        color: black;
-        width: 100%;
-    }
-
-    .columnMenu-option {
-        cursor: pointer;
-        padding: 3px;
-        background-color: white;
-        transition: background-color 0.2s;
-
-        &:hover {
-            background-color: $light-color-secondary;
-        }
-
-        &.active {
-            font-weight: bold;
-            border: 2px solid $light-color-secondary;
-        }
-
-        svg {
-            color: gray;
-            margin-right: 5px;
-            width: 10px;
-        }
-    }
-
-    .keys-dropdown {
-        position: relative;
-        //width: 100%;
-        background-color: white;
-
-        input {
-            border: 2px solid $light-color-secondary;
-            padding: 3px;
-            height: 28px;
-            font-weight: bold;
-            letter-spacing: "2px";
-            text-transform: "uppercase";
-
-            &:focus {
-                font-weight: normal;
-            }
-        }
-
-        .keys-options-wrapper {
-            width: 100%;
-            max-height: 150px;
-            overflow-y: scroll;
-            position: absolute;
-            top: 28px;
-            box-shadow: 0 10px 16px rgba(0, 0, 0, 0.1);
-            background-color: white;
-
-            .key-option {
-                background-color: white;
-                border: 1px solid lightgray;
-                padding: 2px 3px;
-
-                &:not(:first-child) {
-                    border-top: 0;
-                }
-
-                &:hover {
-                    background-color: $light-color-secondary;
-                }
-            }
-        }
-    }
-
-    .columnMenu-colors {
-        display: flex;
-        justify-content: space-between;
-        flex-wrap: wrap;
-
-        .columnMenu-colorPicker {
-            cursor: pointer;
-            width: 20px;
-            height: 20px;
-            border-radius: 10px;
-
-            &.active {
-                border: 2px solid white;
-                box-shadow: 0 0 0 2px lightgray;
-            }
-        }
-    }
-}
-
-.collectionSchema-row {
-    height: 100%;
-    background-color: white;
-
-    &.row-focused .rt-td {
-        background-color: #bfffc0; //$light-color-secondary;
-    }
-
-    &.row-wrapped {
-        .rt-td {
-            white-space: normal;
-        }
-    }
-
-    .row-dragger {
-        display: flex;
-        justify-content: space-around;
-        //flex: 50 0 auto;
-        width: 0;
-        max-width: 50px;
-        //height: 100%;
-        min-height: 30px;
-        align-items: center;
-        color: lightgray;
-        background-color: white;
-        transition: color 0.1s ease;
-
-        .row-option {
-            // padding: 5px;
-            cursor: pointer;
-            position: absolute;
-            transition: color 0.1s ease;
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-            z-index: 2;
-
-            &:hover {
-                color: gray;
-            }
-        }
-    }
-
-    .collectionSchema-row-wrapper {
-
-        &.row-above {
-            border-top: 1px solid red;
-        }
-
-        &.row-below {
-            border-bottom: 1px solid red;
-        }
-
-        &.row-inside {
-            border: 1px solid red;
-        }
-
-        .row-dragging {
-            background-color: blue;
-        }
-    }
-}
-
-.collectionSchemaView-cellContainer {
-    width: 100%;
-    height: unset;
-}
-
-.collectionSchemaView-cellWrapper {
-    height: 100%;
-    padding: 4px;
-    text-align: left;
-    padding-left: 19px;
-
-    position: relative;
-
-    &:focus {
-        outline: none;
-    }
-
-    &.editing {
-        padding: 0;
-
-        input {
-            outline: 0;
-            border: none;
-            background-color: rgb(255, 217, 217);
-            width: 100%;
-            height: 100%;
-            padding: 2px 3px;
-            min-height: 26px;
-        }
-    }
-
-    &.focused {
-
-        &.inactive {
-            border: none;
-        }
-    }
-
-    p {
-        width: 100%;
-        height: 100%;
-    }
-
-    &:hover .collectionSchemaView-cellContents-docExpander {
-        display: block;
-    }
-
-
-    .collectionSchemaView-cellContents-document {
-        display: inline-block;
-    }
-
-    .collectionSchemaView-cellContents-docButton {
-        float: right;
-        width: "15px";
-        height: "15px";
-    }
-
-    .collectionSchemaView-dropdownWrapper {
-
-        border: grey;
-        border-style: solid;
-        border-width: 1px;
-        height: 30px;
-
-        .collectionSchemaView-dropdownButton {
-
-            //display: inline-block;
-            float: left;
-            height: 100%;
-
-
-        }
-
-        .collectionSchemaView-dropdownText {
-            display: inline-block;
-            //float: right;
-            height: 100%;
-            display: "flex";
-            font-size: 13;
-            justify-content: "center";
-            align-items: "center";
-        }
-
-    }
-
-    .collectionSchemaView-dropdownContainer {
-        position: absolute;
-        border: 1px solid rgba(0, 0, 0, 0.04);
-        box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14);
-
-        .collectionSchemaView-dropdownOption:hover {
-            background-color: rgba(0, 0, 0, 0.14);
-            cursor: pointer;
-        }
-    }
-}
-
-.collectionSchemaView-cellContents-docExpander {
-    height: 30px;
-    width: 30px;
-    display: none;
-    position: absolute;
-    top: 0;
-    right: 0;
-    background-color: lightgray;
-
-}
-
-.doc-drag-over {
-    background-color: red;
-}
-
-.collectionSchemaView-toolbar {
-    z-index: 100;
-}
-
-.collectionSchemaView-toolbar {
-    height: 30px;
-    display: flex;
-    justify-content: flex-end;
-    padding: 0 10px;
-    border-bottom: 2px solid gray;
-
-    .collectionSchemaView-toolbar-item {
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-    }
-}
-
-#preview-schema-checkbox-div {
-    margin-left: 20px;
-    font-size: 12px;
-}
-
-.collectionSchemaView-table {
-    width: 100%;
-    height: 100%;
-    overflow: auto;
-    padding: 3px;
-}
-
-.rt-td.rt-expandable {
-    overflow: visible;
-    position: relative;
-    height:100%;
-    z-index: 1;
-}
-.reactTable-sub {
-    background-color: rgb(252, 252, 252);
-    width: 100%;
-
-    .rt-thead {
-        display: none;
-    }
-
-    .row-dragger {
-        background-color: rgb(252, 252, 252);
-    }
-
-    .rt-table {
-        background-color: rgb(252, 252, 252);
-    }
-
-    .collectionSchemaView-table {
-        width: 100%; 
-        border: solid 1px;
-        overflow: visible;
-        padding: 0px;
-    }
-}
-
-.collectionSchemaView-expander {
-    height: 100%;
-    min-height: 30px;
-    position: absolute;
-    color: gray;
-    width: 20;
-    height: auto;
-    left: 55;
-
-    svg {
-        position: absolute;
-        top: 50%;
-        left: 10;
-        transform: translate(-50%, -50%);
-    }
-}
-
-.collectionSchemaView-addRow {
-    color: gray;
-    letter-spacing: 2px;
-    text-transform: uppercase;
-    cursor: pointer;
-    font-size: 10.5px;
-    margin-left: 50px;
-    margin-top: 10px;
-}
\ No newline at end of file
diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx
deleted file mode 100644
index b33c437a9..000000000
--- a/src/client/views/collections/CollectionSchemaView.tsx
+++ /dev/null
@@ -1,575 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { action, computed, observable, untracked } from "mobx";
-import { observer } from "mobx-react";
-import Measure from "react-measure";
-import { Resize } from "react-table";
-import "react-table/react-table.css";
-import { Doc, Opt } from "../../../fields/Doc";
-import { List } from "../../../fields/List";
-import { listSpec } from "../../../fields/Schema";
-import { PastelSchemaPalette, SchemaHeaderField } from "../../../fields/SchemaHeaderField";
-import { Cast, NumCast } from "../../../fields/Types";
-import { TraceMobx } from "../../../fields/util";
-import { emptyFunction, emptyPath, returnFalse, setupMoveUpEvents, returnEmptyDoclist, returnTrue } from "../../../Utils";
-import { SelectionManager } from "../../util/SelectionManager";
-import { SnappingManager } from "../../util/SnappingManager";
-import { Transform } from "../../util/Transform";
-import { undoBatch } from "../../util/UndoManager";
-import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../views/globalCssVariables.scss';
-import { ContextMenu } from "../ContextMenu";
-import { ContextMenuProps } from "../ContextMenuItem";
-import '../DocumentDecorations.scss';
-import { DocumentView } from "../nodes/DocumentView";
-import { DefaultStyleProvider } from "../StyleProvider";
-import "./CollectionSchemaView.scss";
-import { CollectionSubView } from "./CollectionSubView";
-import { SchemaTable } from "./SchemaTable";
-import { DocUtils } from "../../documents/Documents";
-// bcz: need to add drag and drop of rows and columns.  This seems like it might work for rows: https://codesandbox.io/s/l94mn1q657
-
-export enum ColumnType {
-    Any,
-    Number,
-    String,
-    Boolean,
-    Doc,
-    Image,
-    List,
-    Date
-}
-// this map should be used for keys that should have a const type of value
-const columnTypes: Map<string, ColumnType> = new Map([
-    ["title", ColumnType.String],
-    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
-    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
-    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
-]);
-
-@observer
-export class CollectionSchemaView extends CollectionSubView(doc => doc) {
-    private _previewCont?: HTMLDivElement;
-
-    @observable _previewDoc: Doc | undefined = undefined;
-    @observable _focusedTable: Doc = this.props.Document;
-    @observable _col: any = "";
-    @observable _menuWidth = 0;
-    @observable _headerOpen = false;
-    @observable _headerIsEditing = false;
-    @observable _menuHeight = 0;
-    @observable _pointerX = 0;
-    @observable _pointerY = 0;
-    @observable _openTypes: boolean = false;
-
-    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
-    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
-    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
-    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
-    @computed get scale() { return this.props.ScreenToLocalTransform().Scale; }
-    @computed get columns() { return Cast(this.props.Document._schemaHeaders, listSpec(SchemaHeaderField), []); }
-    set columns(columns: SchemaHeaderField[]) { this.props.Document._schemaHeaders = new List<SchemaHeaderField>(columns); }
-
-    @computed get menuCoordinates() {
-        let searchx = 0;
-        let searchy = 0;
-        if (this.props.Document._searchDoc) {
-            const el = document.getElementsByClassName("collectionSchemaView-searchContainer")[0];
-            if (el !== undefined) {
-                const rect = el.getBoundingClientRect();
-                searchx = rect.x;
-                searchy = rect.y;
-            }
-        }
-        const x = Math.max(0, Math.min(document.body.clientWidth - this._menuWidth, this._pointerX)) - searchx;
-        const y = Math.max(0, Math.min(document.body.clientHeight - this._menuHeight, this._pointerY)) - searchy;
-        return this.props.ScreenToLocalTransform().transformPoint(x, y);
-    }
-
-    get documentKeys() {
-        const docs = this.childDocs;
-        const keys: { [key: string]: boolean } = {};
-        // bcz: ugh.  this is untracked since otherwise a large collection of documents will blast the server for all their fields.
-        //  then as each document's fields come back, we update the documents _proxies.  Each time we do this, the whole schema will be
-        //  invalidated and re-rendered.   This workaround will inquire all of the document fields before the options button is clicked.
-        //  then by the time the options button is clicked, all of the fields should be in place.  If a new field is added while this menu
-        //  is displayed (unlikely) it won't show up until something else changes.
-        //TODO Types
-        untracked(() => docs.map(doc => Doc.GetAllPrototypes(doc).map(proto => Object.keys(proto).forEach(key => keys[key] = false))));
-
-        this.columns.forEach(key => keys[key.heading] = true);
-        return Array.from(Object.keys(keys));
-    }
-
-    @action setHeaderIsEditing = (isEditing: boolean) => this._headerIsEditing = isEditing;
-
-    @undoBatch
-    setColumnType = action((columnField: SchemaHeaderField, type: ColumnType): void => {
-        this._openTypes = false;
-        if (columnTypes.get(columnField.heading)) return;
-
-        const columns = this.columns;
-        const index = columns.indexOf(columnField);
-        if (index > -1) {
-            columnField.setType(NumCast(type));
-            columns[index] = columnField;
-            this.columns = columns;
-        }
-    });
-
-    @undoBatch
-    setColumnColor = (columnField: SchemaHeaderField, color: string): void => {
-        const columns = this.columns;
-        const index = columns.indexOf(columnField);
-        if (index > -1) {
-            columnField.setColor(color);
-            columns[index] = columnField;
-            this.columns = columns; // need to set the columns to trigger rerender
-        }
-    }
-
-    @undoBatch
-    @action
-    setColumnSort = (columnField: SchemaHeaderField, descending: boolean | undefined) => {
-        const columns = this.columns;
-        columns.forEach(col => col.setDesc(undefined));
-
-        const index = columns.findIndex(c => c.heading === columnField.heading);
-        const column = columns[index];
-        column.setDesc(descending);
-        columns[index] = column;
-        this.columns = columns;
-    }
-
-    renderTypes = (col: any) => {
-        if (columnTypes.get(col.heading)) return (null);
-
-        const type = col.type;
-
-        const anyType = <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Any)}>
-            <FontAwesomeIcon icon={"align-justify"} size="sm" />
-                Any
-            </div>;
-
-        const numType = <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Number)}>
-            <FontAwesomeIcon icon={"hashtag"} size="sm" />
-                Number
-            </div>;
-
-        const textType = <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.String)}>
-            <FontAwesomeIcon icon={"font"} size="sm" />
-            Text
-            </div>;
-
-        const boolType = <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Boolean)}>
-            <FontAwesomeIcon icon={"check-square"} size="sm" />
-            Checkbox
-            </div>;
-
-        const listType = <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.List)}>
-            <FontAwesomeIcon icon={"list-ul"} size="sm" />
-            List
-            </div>;
-
-        const docType = <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Doc)}>
-            <FontAwesomeIcon icon={"file"} size="sm" />
-            Document
-            </div>;
-
-        const imageType = <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Image)}>
-            <FontAwesomeIcon icon={"image"} size="sm" />
-            Image
-            </div>;
-
-        const dateType = <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Date)}>
-            <FontAwesomeIcon icon={"calendar"} size="sm" />
-                Date
-                </div>;
-
-
-        const allColumnTypes = <div className="columnMenu-types">
-            {anyType}
-            {numType}
-            {textType}
-            {boolType}
-            {listType}
-            {docType}
-            {imageType}
-            {dateType}
-        </div>;
-
-        const justColType = type === ColumnType.Any ? anyType : type === ColumnType.Number ? numType :
-            type === ColumnType.String ? textType : type === ColumnType.Boolean ? boolType :
-                type === ColumnType.List ? listType : type === ColumnType.Doc ? docType :
-                    type === ColumnType.Date ? dateType : imageType;
-
-        return (
-            <div className="collectionSchema-headerMenu-group" onClick={action(() => this._openTypes = !this._openTypes)}>
-                <div>
-                    <label style={{ cursor: "pointer" }}>Column type:</label>
-                    <FontAwesomeIcon icon={"caret-down"} size="lg" style={{ float: "right", transform: `rotate(${this._openTypes ? "180deg" : 0})`, transition: "0.2s all ease" }} />
-                </div>
-                {this._openTypes ? allColumnTypes : justColType}
-            </div >
-        );
-    }
-
-    renderSorting = (col: any) => {
-        const sort = col.desc;
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Sort by:</label>
-                <div className="columnMenu-sort">
-                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.setColumnSort(col, true)}>
-                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
-                        Sort descending
-                    </div>
-                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.setColumnSort(col, false)}>
-                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
-                        Sort ascending
-                    </div>
-                    <div className="columnMenu-option" onClick={() => this.setColumnSort(col, undefined)}>
-                        <FontAwesomeIcon icon="times" size="sm" />
-                        Clear sorting
-                    </div>
-                </div>
-            </div>
-        );
-    }
-
-    renderColors = (col: any) => {
-        const selected = col.color;
-
-        const pink = PastelSchemaPalette.get("pink2");
-        const purple = PastelSchemaPalette.get("purple2");
-        const blue = PastelSchemaPalette.get("bluegreen1");
-        const yellow = PastelSchemaPalette.get("yellow4");
-        const red = PastelSchemaPalette.get("red2");
-        const gray = "#f1efeb";
-
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Color:</label>
-                <div className="columnMenu-colors">
-                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.setColumnColor(col, pink!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.setColumnColor(col, purple!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.setColumnColor(col, blue!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.setColumnColor(col, yellow!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.setColumnColor(col, red!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.setColumnColor(col, gray)}></div>
-                </div>
-            </div>
-        );
-    }
-
-    @undoBatch
-    @action
-    changeColumns = (oldKey: string, newKey: string, addNew: boolean, filter?: string) => {
-        const columns = this.columns;
-        if (columns === undefined) {
-            this.columns = new List<SchemaHeaderField>([new SchemaHeaderField(newKey, "f1efeb")]);
-        } else {
-            if (addNew) {
-                columns.push(new SchemaHeaderField(newKey, "f1efeb"));
-                this.columns = columns;
-            } else {
-                const index = columns.map(c => c.heading).indexOf(oldKey);
-                if (index > -1) {
-                    const column = columns[index];
-                    column.setHeading(newKey);
-                    columns[index] = column;
-                    this.columns = columns;
-                    if (filter) {
-                        Doc.setDocFilter(this.props.Document, newKey, filter, "match");
-                    }
-                    else {
-                        this.props.Document._docFilters = undefined;
-                    }
-                }
-            }
-        }
-    }
-
-    @action
-    openHeader = (col: any, screenx: number, screeny: number) => {
-        this._col = col;
-        this._headerOpen = true;
-        this._pointerX = screenx;
-        this._pointerY = screeny;
-    }
-
-    @action
-    closeHeader = () => { this._headerOpen = false; }
-
-    @undoBatch
-    @action
-    deleteColumn = (key: string) => {
-        const columns = this.columns;
-        if (columns === undefined) {
-            this.columns = new List<SchemaHeaderField>([]);
-        } else {
-            const index = columns.map(c => c.heading).indexOf(key);
-            if (index > -1) {
-                columns.splice(index, 1);
-                this.columns = columns;
-            }
-        }
-        this.closeHeader();
-    }
-
-    getPreviewTransform = (): Transform => {
-        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - NumCast(COLLECTION_BORDER_WIDTH) - this.tableWidth, - this.borderWidth);
-    }
-
-    @action
-    onHeaderClick = (e: React.PointerEvent) => {
-        e.stopPropagation();
-    }
-
-    @action
-    onWheel(e: React.WheelEvent) {
-        const scale = this.props.ScreenToLocalTransform().Scale;
-        this.props.isContentActive(true) && e.stopPropagation();
-    }
-
-    @computed get renderMenuContent() {
-        TraceMobx();
-        return <div className="collectionSchema-header-menuOptions">
-            {this.renderTypes(this._col)}
-            {this.renderColors(this._col)}
-            <div className="collectionSchema-headerMenu-group">
-                <button onClick={() => { this.deleteColumn(this._col.heading); }}
-                >Delete Column</button>
-            </div>
-        </div>;
-    }
-
-    private createTarget = (ele: HTMLDivElement) => {
-        this._previewCont = ele;
-        super.CreateDropTarget(ele);
-    }
-
-    isFocused = (doc: Doc, outsideReaction: boolean): boolean => this.props.isSelected(outsideReaction) && doc === this._focusedTable;
-
-    @action setFocused = (doc: Doc) => this._focusedTable = doc;
-
-    @action setPreviewDoc = (doc: Opt<Doc>) => {
-        SelectionManager.SelectSchemaView(this, doc);
-        this._previewDoc = doc;
-    }
-
-    //toggles preview side-panel of schema
-    @action
-    toggleExpander = () => {
-        this.props.Document.schemaPreviewWidth = this.previewWidth() === 0 ? Math.min(this.tableWidth / 3, 200) : 0;
-    }
-
-    onDividerDown = (e: React.PointerEvent) => {
-        setupMoveUpEvents(this, e, this.onDividerMove, emptyFunction, this.toggleExpander);
-    }
-    @action
-    onDividerMove = (e: PointerEvent, down: number[], delta: number[]) => {
-        const nativeWidth = this._previewCont!.getBoundingClientRect();
-        const minWidth = 40;
-        const maxWidth = 1000;
-        const movedWidth = this.props.ScreenToLocalTransform().transformDirection(nativeWidth.right - e.clientX, 0)[0];
-        const width = movedWidth < minWidth ? minWidth : movedWidth > maxWidth ? maxWidth : movedWidth;
-        this.props.Document.schemaPreviewWidth = width;
-        return false;
-    }
-
-    onPointerDown = (e: React.PointerEvent): void => {
-        if (e.button === 0 && !e.altKey && !e.ctrlKey && !e.metaKey) {
-            if (this.props.isSelected(true)) e.stopPropagation();
-            else this.props.select(false);
-        }
-    }
-
-    @computed
-    get previewDocument(): Doc | undefined { return this._previewDoc; }
-
-    @computed
-    get dividerDragger() {
-        return this.previewWidth() === 0 ? (null) :
-            <div className="collectionSchemaView-dividerDragger" onPointerDown={this.onDividerDown} >
-                <div className="collectionSchemaView-dividerDragger" />
-            </div>;
-    }
-
-    @computed
-    get previewPanel() {
-        return <div ref={this.createTarget} style={{ width: `${this.previewWidth()}px` }}>
-            {!this.previewDocument ? (null) :
-                <DocumentView
-                    Document={this.previewDocument}
-                    DataDoc={undefined}
-                    fitContentsToDoc={returnTrue}
-                    freezeDimensions={true}
-                    dontCenter={"y"}
-                    focus={DocUtils.DefaultFocus}
-                    renderDepth={this.props.renderDepth}
-                    rootSelected={this.rootSelected}
-                    PanelWidth={this.previewWidth}
-                    PanelHeight={this.previewHeight}
-                    isContentActive={returnTrue}
-                    isDocumentActive={returnFalse}
-                    ScreenToLocalTransform={this.getPreviewTransform}
-                    docFilters={this.docFilters}
-                    docRangeFilters={this.docRangeFilters}
-                    searchFilterDocs={this.searchFilterDocs}
-                    styleProvider={DefaultStyleProvider}
-                    layerProvider={undefined}
-                    docViewPath={returnEmptyDoclist}
-                    ContainingCollectionDoc={this.props.CollectionView?.props.Document}
-                    ContainingCollectionView={this.props.CollectionView}
-                    moveDocument={this.props.moveDocument}
-                    addDocument={this.props.addDocument}
-                    removeDocument={this.props.removeDocument}
-                    whenChildContentsActiveChanged={this.props.whenChildContentsActiveChanged}
-                    addDocTab={this.props.addDocTab}
-                    pinToPres={this.props.pinToPres}
-                    bringToFront={returnFalse}
-                />}
-        </div>;
-    }
-
-    @computed
-    get schemaTable() {
-        return <SchemaTable
-            Document={this.props.Document}
-            PanelHeight={this.props.PanelHeight}
-            PanelWidth={this.props.PanelWidth}
-            childDocs={this.childDocs}
-            CollectionView={this.props.CollectionView}
-            ContainingCollectionView={this.props.ContainingCollectionView}
-            ContainingCollectionDoc={this.props.ContainingCollectionDoc}
-            fieldKey={this.props.fieldKey}
-            renderDepth={this.props.renderDepth}
-            moveDocument={this.props.moveDocument}
-            ScreenToLocalTransform={this.props.ScreenToLocalTransform}
-            active={this.props.isContentActive}
-            onDrop={this.onExternalDrop}
-            addDocTab={this.props.addDocTab}
-            pinToPres={this.props.pinToPres}
-            isSelected={this.props.isSelected}
-            isFocused={this.isFocused}
-            setFocused={this.setFocused}
-            setPreviewDoc={this.setPreviewDoc}
-            deleteDocument={this.props.removeDocument}
-            addDocument={this.props.addDocument}
-            dataDoc={this.props.DataDoc}
-            columns={this.columns}
-            documentKeys={this.documentKeys}
-            headerIsEditing={this._headerIsEditing}
-            openHeader={this.openHeader}
-            onClick={this.onTableClick}
-            onPointerDown={emptyFunction}
-            onResizedChange={this.onResizedChange}
-            setColumns={this.setColumns}
-            reorderColumns={this.reorderColumns}
-            changeColumns={this.changeColumns}
-            setHeaderIsEditing={this.setHeaderIsEditing}
-            changeColumnSort={this.setColumnSort}
-        />;
-    }
-
-    @computed
-    public get schemaToolbar() {
-        return <div className="collectionSchemaView-toolbar">
-            <div className="collectionSchemaView-toolbar-item">
-                <div id="preview-schema-checkbox-div">
-                    <input type="checkbox" key={"Show Preview"} checked={this.previewWidth() !== 0} onChange={this.toggleExpander} />
-                    Show Preview
-                </div>
-            </div>
-        </div>;
-    }
-
-    onSpecificMenu = (e: React.MouseEvent) => {
-        if ((e.target as any)?.className?.includes?.("collectionSchemaView-cell") || (e.target instanceof HTMLSpanElement)) {
-            const cm = ContextMenu.Instance;
-            const options = cm.findByDescription("Options...");
-            const optionItems: ContextMenuProps[] = options && "subitems" in options ? options.subitems : [];
-            optionItems.push({ description: "remove", event: () => this._previewDoc && this.props.removeDocument?.(this._previewDoc), icon: "trash" });
-            !options && cm.addItem({ description: "Options...", subitems: optionItems, icon: "compass" });
-            cm.displayMenu(e.clientX, e.clientY);
-            (e.nativeEvent as any).SchemaHandled = true; // not sure why this is needed, but if you right-click quickly on a cell, the Document/Collection contextMenu handlers still fire without this.
-            e.stopPropagation();
-        }
-    }
-
-    @action
-    onTableClick = (e: React.MouseEvent): void => {
-        if (!(e.target as any)?.className?.includes?.("collectionSchemaView-cell") && !(e.target instanceof HTMLSpanElement)) {
-            this.setPreviewDoc(undefined);
-        } else {
-            e.stopPropagation();
-        }
-        this.setFocused(this.props.Document);
-        this.closeHeader();
-    }
-
-    onResizedChange = (newResized: Resize[], event: any) => {
-        const columns = this.columns;
-        newResized.forEach(resized => {
-            const index = columns.findIndex(c => c.heading === resized.id);
-            const column = columns[index];
-            column.setWidth(resized.value);
-            columns[index] = column;
-        });
-        this.columns = columns;
-    }
-
-    @action
-    setColumns = (columns: SchemaHeaderField[]) => this.columns = columns
-
-    @undoBatch
-    reorderColumns = (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => {
-        const columns = [...columnsValues];
-        const oldIndex = columns.indexOf(toMove);
-        const relIndex = columns.indexOf(relativeTo);
-        const newIndex = (oldIndex > relIndex && !before) ? relIndex + 1 : (oldIndex < relIndex && before) ? relIndex - 1 : relIndex;
-
-        if (oldIndex === newIndex) return;
-
-        columns.splice(newIndex, 0, columns.splice(oldIndex, 1)[0]);
-        this.columns = columns;
-    }
-
-    onZoomMenu = (e: React.WheelEvent) => this.props.isContentActive(true) && e.stopPropagation();
-
-    render() {
-        TraceMobx();
-        if (!this.props.isContentActive()) setTimeout(() => this.closeHeader(), 0);
-        const menuContent = this.renderMenuContent;
-        const menu = <div className="collectionSchema-header-menu"
-            onWheel={e => this.onZoomMenu(e)}
-            onPointerDown={e => this.onHeaderClick(e)}
-            style={{ transform: `translate(${(this.menuCoordinates[0])}px, ${(this.menuCoordinates[1])}px)` }}>
-            <Measure offset onResize={action((r: any) => {
-                const dim = this.props.ScreenToLocalTransform().inverse().transformDirection(r.offset.width, r.offset.height);
-                this._menuWidth = dim[0]; this._menuHeight = dim[1];
-            })}>
-                {({ measureRef }) => <div ref={measureRef}> {menuContent} </div>}
-            </Measure>
-        </div>;
-        return <div className={"collectionSchemaView" + (this.props.Document._searchDoc ? "-searchContainer" : "-container")}
-            style={{
-                overflow: this.props.scrollOverflow === true ? "scroll" : undefined, backgroundColor: "white",
-                pointerEvents: this.props.Document._searchDoc !== undefined && !this.props.isContentActive() && !SnappingManager.GetIsDragging() ? "none" : undefined,
-                width: name === "collectionSchemaView-searchContainer" ? "auto" : this.props.PanelWidth() || "100%", height: this.props.PanelHeight() || "100%", position: "relative",
-            }}  >
-            <div className="collectionSchemaView-tableContainer"
-                style={{ width: `calc(100% - ${this.previewWidth()}px)` }}
-                onContextMenu={this.onSpecificMenu}
-                onPointerDown={this.onPointerDown}
-                onWheel={e => this.props.isContentActive(true) && e.stopPropagation()}
-                onDrop={e => this.onExternalDrop(e, {})}
-                ref={this.createTarget}>
-                {this.schemaTable}
-            </div>
-            {this.dividerDragger}
-            {!this.previewWidth() ? (null) : this.previewPanel}
-            {this._headerOpen && this.props.isContentActive() ? menu : null}
-        </div>;
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/SchemaTable.tsx b/src/client/views/collections/SchemaTable.tsx
deleted file mode 100644
index 0c69ee030..000000000
--- a/src/client/views/collections/SchemaTable.tsx
+++ /dev/null
@@ -1,599 +0,0 @@
-import React = require("react");
-import { IconProp } from '@fortawesome/fontawesome-svg-core';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { action, computed, observable } from "mobx";
-import { observer } from "mobx-react";
-import ReactTable, { CellInfo, Column, ComponentPropsGetterR, Resize, SortingRule } from "react-table";
-import "react-table/react-table.css";
-import { DateField } from "../../../fields/DateField";
-import { AclPrivate, AclReadonly, DataSym, Doc, DocListCast, Field, Opt } from "../../../fields/Doc";
-import { Id } from "../../../fields/FieldSymbols";
-import { List } from "../../../fields/List";
-import { listSpec } from "../../../fields/Schema";
-import { SchemaHeaderField } from "../../../fields/SchemaHeaderField";
-import { ComputedField } from "../../../fields/ScriptField";
-import { Cast, FieldValue, NumCast, StrCast } from "../../../fields/Types";
-import { ImageField } from "../../../fields/URLField";
-import { GetEffectiveAcl } from "../../../fields/util";
-import { emptyFunction, emptyPath, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue } from "../../../Utils";
-import { Docs, DocumentOptions, DocUtils } from "../../documents/Documents";
-import { DocumentType } from "../../documents/DocumentTypes";
-import { CompileScript, Transformer, ts } from "../../util/Scripting";
-import { Transform } from "../../util/Transform";
-import { undoBatch } from "../../util/UndoManager";
-import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../views/globalCssVariables.scss';
-import { ContextMenu } from "../ContextMenu";
-import '../DocumentDecorations.scss';
-import { DocumentView } from "../nodes/DocumentView";
-import { DefaultStyleProvider } from "../StyleProvider";
-import { CellProps, CollectionSchemaButtons, CollectionSchemaCell, CollectionSchemaCheckboxCell, CollectionSchemaDateCell, CollectionSchemaDocCell, CollectionSchemaImageCell, CollectionSchemaListCell, CollectionSchemaNumberCell, CollectionSchemaStringCell } from "./CollectionSchemaCells";
-import { CollectionSchemaAddColumnHeader, KeysDropdown } from "./CollectionSchemaHeaders";
-import { MovableColumn, MovableRow } from "./CollectionSchemaMovableTableHOC";
-import "./CollectionSchemaView.scss";
-import { CollectionView } from "./CollectionView";
-
-
-enum ColumnType {
-    Any,
-    Number,
-    String,
-    Boolean,
-    Doc,
-    Image,
-    List,
-    Date
-}
-
-// this map should be used for keys that should have a const type of value
-const columnTypes: Map<string, ColumnType> = new Map([
-    ["title", ColumnType.String],
-    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
-    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
-    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
-]);
-
-export interface SchemaTableProps {
-    Document: Doc; // child doc
-    dataDoc?: Doc;
-    PanelHeight: () => number;
-    PanelWidth: () => number;
-    childDocs?: Doc[];
-    CollectionView: Opt<CollectionView>;
-    ContainingCollectionView: Opt<CollectionView>;
-    ContainingCollectionDoc: Opt<Doc>;
-    fieldKey: string;
-    renderDepth: number;
-    deleteDocument?: (document: Doc | Doc[]) => boolean;
-    addDocument?: (document: Doc | Doc[]) => boolean;
-    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (document: Doc | Doc[]) => boolean) => boolean;
-    ScreenToLocalTransform: () => Transform;
-    active: (outsideReaction: boolean | undefined) => boolean;
-    onDrop: (e: React.DragEvent<Element>, options: DocumentOptions, completed?: (() => void) | undefined) => void;
-    addDocTab: (document: Doc, where: string) => boolean;
-    pinToPres: (document: Doc) => void;
-    isSelected: (outsideReaction?: boolean) => boolean;
-    isFocused: (document: Doc, outsideReaction: boolean) => boolean;
-    setFocused: (document: Doc) => void;
-    setPreviewDoc: (document: Opt<Doc>) => void;
-    columns: SchemaHeaderField[];
-    documentKeys: any[];
-    headerIsEditing: boolean;
-    openHeader: (column: any, screenx: number, screeny: number) => void;
-    onClick: (e: React.MouseEvent) => void;
-    onPointerDown: (e: React.PointerEvent) => void;
-    onResizedChange: (newResized: Resize[], event: any) => void;
-    setColumns: (columns: SchemaHeaderField[]) => void;
-    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => void;
-    changeColumns: (oldKey: string, newKey: string, addNew: boolean) => void;
-    setHeaderIsEditing: (isEditing: boolean) => void;
-    changeColumnSort: (columnField: SchemaHeaderField, descending: boolean | undefined) => void;
-}
-
-@observer
-export class SchemaTable extends React.Component<SchemaTableProps> {
-    @observable _cellIsEditing: boolean = false;
-    @observable _focusedCell: { row: number, col: number } = { row: 0, col: 0 };
-    @observable _openCollections: Set<number> = new Set;
-
-    @observable _showDoc: Doc | undefined;
-    @observable _showDataDoc: any = "";
-    @observable _showDocPos: number[] = [];
-
-    @observable _showTitleDropdown: boolean = false;
-
-    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
-    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
-    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
-
-    @computed get childDocs() {
-        if (this.props.childDocs) return this.props.childDocs;
-
-        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
-        return DocListCast(doc[this.props.fieldKey]);
-    }
-    set childDocs(docs: Doc[]) {
-        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
-        doc[this.props.fieldKey] = new List<Doc>(docs);
-    }
-
-    @computed get textWrappedRows() {
-        return Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
-    }
-    set textWrappedRows(textWrappedRows: string[]) {
-        this.props.Document.textwrappedSchemaRows = new List<string>(textWrappedRows);
-    }
-
-    @computed get resized(): { id: string, value: number }[] {
-        return this.props.columns.reduce((resized, shf) => {
-            (shf.width > -1) && resized.push({ id: shf.heading, value: shf.width });
-            return resized;
-        }, [] as { id: string, value: number }[]);
-    }
-    @computed get sorted(): SortingRule[] {
-        return this.props.columns.reduce((sorted, shf) => {
-            shf.desc !== undefined && sorted.push({ id: shf.heading, desc: shf.desc });
-            return sorted;
-        }, [] as SortingRule[]);
-    }
-
-    @action
-    changeSorting = (col: any) => {
-        this.props.changeColumnSort(col, col.desc === true ? false : col.desc === false ? undefined : true);
-    }
-
-    @action
-    changeTitleMode = () => this._showTitleDropdown = !this._showTitleDropdown
-
-    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
-    @computed get tableColumns(): Column<Doc>[] {
-        const possibleKeys = this.props.documentKeys.filter(key => this.props.columns.findIndex(existingKey => existingKey.heading.toUpperCase() === key.toUpperCase()) === -1);
-        const columns: Column<Doc>[] = [];
-        const tableIsFocused = this.props.isFocused(this.props.Document, false);
-        const focusedRow = this._focusedCell.row;
-        const focusedCol = this._focusedCell.col;
-        const isEditable = !this.props.headerIsEditing;
-
-        columns.push({
-            expander: true, Header: "", width: 58,
-            Expander: (rowInfo) => {
-                return rowInfo.original.type !== DocumentType.COL ? (null) :
-                    <div className="collectionSchemaView-expander" onClick={action(() => (this._openCollections[rowInfo.isExpanded ? "delete" : "add"])(rowInfo.viewIndex))}>
-                        <FontAwesomeIcon icon={rowInfo.isExpanded ? "caret-down" : "caret-right"} size="lg" />
-                    </div>;
-            }
-        });
-        columns.push(...this.props.columns.map(col => {
-            const icon: IconProp = this.getColumnType(col) === ColumnType.Number ? "hashtag" : this.getColumnType(col) === ColumnType.String ? "font" :
-                this.getColumnType(col) === ColumnType.Boolean ? "check-square" : this.getColumnType(col) === ColumnType.Doc ? "file" :
-                    this.getColumnType(col) === ColumnType.Image ? "image" : this.getColumnType(col) === ColumnType.List ? "list-ul" :
-                        this.getColumnType(col) === ColumnType.Date ? "calendar" : "align-justify";
-
-            const keysDropdown = <KeysDropdown
-                keyValue={col.heading}
-                possibleKeys={possibleKeys}
-                existingKeys={this.props.columns.map(c => c.heading)}
-                canAddNew={true}
-                addNew={false}
-                onSelect={this.props.changeColumns}
-                setIsEditing={this.props.setHeaderIsEditing}
-                docs={this.props.childDocs}
-                Document={this.props.Document}
-                dataDoc={this.props.dataDoc}
-                fieldKey={this.props.fieldKey}
-                ContainingCollectionDoc={this.props.ContainingCollectionDoc}
-                ContainingCollectionView={this.props.ContainingCollectionView}
-                active={this.props.active}
-                openHeader={this.props.openHeader}
-                icon={icon}
-                col={col}
-                // try commenting this out
-                width={"100%"}
-            />;
-
-            const sortIcon = col.desc === undefined ? "caret-right" : col.desc === true ? "caret-down" : "caret-up";
-            const header = <div className="collectionSchemaView-menuOptions-wrapper" style={{ background: col.color, padding: "2px", display: "flex", cursor: "default", height: "100%", }}>
-                {keysDropdown}
-                <div onClick={e => this.changeSorting(col)} style={{ width: 21, padding: 1, display: "inline", zIndex: 1, background: "inherit", cursor: "hand" }}>
-                    <FontAwesomeIcon icon={sortIcon} size="lg" />
-                </div>
-            </div>;
-
-            return {
-                Header: <MovableColumn columnRenderer={header} columnValue={col} allColumns={this.props.columns} reorderColumns={this.props.reorderColumns} ScreenToLocalTransform={this.props.ScreenToLocalTransform} />,
-                accessor: (doc: Doc) => doc ? Field.toString(doc[col.heading] as Field) : 0,
-                id: col.heading,
-                Cell: (rowProps: CellInfo) => {
-                    const rowIndex = rowProps.index;
-                    const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
-                    const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
-
-                    const props: CellProps = {
-                        row: rowIndex,
-                        col: columnIndex,
-                        rowProps: rowProps,
-                        isFocused: isFocused,
-                        changeFocusedCellByIndex: this.changeFocusedCellByIndex,
-                        CollectionView: this.props.CollectionView,
-                        ContainingCollection: this.props.ContainingCollectionView,
-                        Document: this.props.Document,
-                        fieldKey: this.props.fieldKey,
-                        renderDepth: this.props.renderDepth,
-                        addDocTab: this.props.addDocTab,
-                        pinToPres: this.props.pinToPres,
-                        moveDocument: this.props.moveDocument,
-                        setIsEditing: this.setCellIsEditing,
-                        isEditable: isEditable,
-                        setPreviewDoc: this.props.setPreviewDoc,
-                        setComputed: this.setComputed,
-                        getField: this.getField,
-                        showDoc: this.showDoc,
-                    };
-
-
-                    switch (this.getColumnType(col, rowProps.original, rowProps.column.id)) {
-                        case ColumnType.Number: return <CollectionSchemaNumberCell {...props} />;
-                        case ColumnType.String: return <CollectionSchemaStringCell {...props} />;
-                        case ColumnType.Boolean: return <CollectionSchemaCheckboxCell {...props} />;
-                        case ColumnType.Doc: return <CollectionSchemaDocCell {...props} />;
-                        case ColumnType.Image: return <CollectionSchemaImageCell {...props} />;
-                        case ColumnType.List: return <CollectionSchemaListCell {...props} />;
-                        case ColumnType.Date: return <CollectionSchemaDateCell {...props} />;
-                        default:
-                            return <CollectionSchemaCell {...props} />;
-                    }
-                },
-                minWidth: 200,
-            };
-        }));
-        columns.push({
-            Header: <CollectionSchemaAddColumnHeader createColumn={this.createColumn} />,
-            accessor: (doc: Doc) => 0,
-            id: "add",
-            Cell: (rowProps: CellInfo) => {
-                const rowIndex = rowProps.index;
-                const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
-                const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
-                return <CollectionSchemaButtons  {...{
-                    row: rowProps.index,
-                    col: columnIndex,
-                    rowProps: rowProps,
-                    isFocused: isFocused,
-                    changeFocusedCellByIndex: this.changeFocusedCellByIndex,
-                    CollectionView: this.props.CollectionView,
-                    ContainingCollection: this.props.ContainingCollectionView,
-                    Document: this.props.Document,
-                    fieldKey: this.props.fieldKey,
-                    renderDepth: this.props.renderDepth,
-                    addDocTab: this.props.addDocTab,
-                    pinToPres: this.props.pinToPres,
-                    moveDocument: this.props.moveDocument,
-                    setIsEditing: this.setCellIsEditing,
-                    isEditable: isEditable,
-                    setPreviewDoc: this.props.setPreviewDoc,
-                    setComputed: this.setComputed,
-                    getField: this.getField,
-                    showDoc: this.showDoc,
-                }} />;
-            },
-            width: 28,
-            resizable: false
-        });
-        return columns;
-    }
-
-
-    constructor(props: SchemaTableProps) {
-        super(props);
-        if (this.props.Document._schemaHeaders === undefined) {
-            this.props.Document._schemaHeaders = new List<SchemaHeaderField>([new SchemaHeaderField("title", "#f1efeb"), new SchemaHeaderField("author", "#f1efeb"), new SchemaHeaderField("*lastModified", "#f1efeb", ColumnType.Date),
-            new SchemaHeaderField("text", "#f1efeb", ColumnType.String), new SchemaHeaderField("type", "#f1efeb"), new SchemaHeaderField("context", "#f1efeb", ColumnType.Doc)]);
-        }
-    }
-
-    componentDidMount() {
-        document.addEventListener("keydown", this.onKeyDown);
-    }
-
-    componentWillUnmount() {
-        document.removeEventListener("keydown", this.onKeyDown);
-    }
-
-    tableAddDoc = (doc: Doc, relativeTo?: Doc, before?: boolean) => {
-        const tableDoc = this.props.Document[DataSym];
-        const effectiveAcl = GetEffectiveAcl(tableDoc);
-
-        if (effectiveAcl !== AclPrivate && effectiveAcl !== AclReadonly) {
-            doc.context = this.props.Document;
-            tableDoc[this.props.fieldKey + "-lastModified"] = new DateField(new Date(Date.now()));
-            return Doc.AddDocToList(this.props.Document, this.props.fieldKey, doc, relativeTo, before);
-        }
-        return false;
-    }
-
-    private getTrProps: ComponentPropsGetterR = (state, rowInfo) => {
-        return !rowInfo ? {} : {
-            ScreenToLocalTransform: this.props.ScreenToLocalTransform,
-            addDoc: this.tableAddDoc,
-            removeDoc: this.props.deleteDocument,
-            rowInfo,
-            rowFocused: !this.props.headerIsEditing && rowInfo.index === this._focusedCell.row && this.props.isFocused(this.props.Document, true),
-            textWrapRow: this.toggleTextWrapRow,
-            rowWrapped: this.textWrappedRows.findIndex(id => rowInfo.original[Id] === id) > -1,
-            dropAction: StrCast(this.props.Document.childDropAction),
-            addDocTab: this.props.addDocTab
-        };
-    }
-
-    private getTdProps: ComponentPropsGetterR = (state, rowInfo, column, instance) => {
-        if (!rowInfo || column) return {};
-
-        const row = rowInfo.index;
-        //@ts-ignore
-        const col = this.columns.map(c => c.heading).indexOf(column!.id);
-        const isFocused = this._focusedCell.row === row && this._focusedCell.col === col && this.props.isFocused(this.props.Document, true);
-        // TODO: editing border doesn't work :(
-        return {
-            style: { border: !this.props.headerIsEditing && isFocused ? "2px solid rgb(255, 160, 160)" : "1px solid #f1efeb" }
-        };
-    }
-
-    @action setCellIsEditing = (isEditing: boolean) => this._cellIsEditing = isEditing;
-
-    @action
-    onKeyDown = (e: KeyboardEvent): void => {
-        if (!this._cellIsEditing && !this.props.headerIsEditing && this.props.isFocused(this.props.Document, true)) {// && this.props.isSelected(true)) {
-            const direction = e.key === "Tab" ? "tab" : e.which === 39 ? "right" : e.which === 37 ? "left" : e.which === 38 ? "up" : e.which === 40 ? "down" : "";
-            this._focusedCell = this.changeFocusedCellByDirection(direction, this._focusedCell.row, this._focusedCell.col);
-
-            if (direction) {
-                const pdoc = FieldValue(this.childDocs[this._focusedCell.row]);
-                pdoc && this.props.setPreviewDoc(pdoc);
-                e.stopPropagation();
-            }
-        } else if (e.keyCode === 27) {
-            this.props.setPreviewDoc(undefined);
-            e.stopPropagation(); // stopPropagation for left/right arrows 
-        }
-    }
-
-    changeFocusedCellByDirection = (direction: string, curRow: number, curCol: number) => {
-        switch (direction) {
-            case "tab": return { row: (curRow + 1 === this.childDocs.length ? 0 : curRow + 1), col: curCol + 1 === this.props.columns.length ? 0 : curCol + 1 };
-            case "right": return { row: curRow, col: curCol + 1 === this.props.columns.length ? curCol : curCol + 1 };
-            case "left": return { row: curRow, col: curCol === 0 ? curCol : curCol - 1 };
-            case "up": return { row: curRow === 0 ? curRow : curRow - 1, col: curCol };
-            case "down": return { row: curRow + 1 === this.childDocs.length ? curRow : curRow + 1, col: curCol };
-        }
-        return this._focusedCell;
-    }
-
-    @action
-    changeFocusedCellByIndex = (row: number, col: number): void => {
-        if (this._focusedCell.row !== row || this._focusedCell.col !== col) {
-            this._focusedCell = { row: row, col: col };
-        }
-        this.props.setFocused(this.props.Document);
-    }
-
-    @undoBatch
-    createRow = action(() => {
-        this.props.addDocument?.(Docs.Create.TextDocument("", { title: "", _width: 100, _height: 30 }));
-        this._focusedCell = { row: this.childDocs.length, col: this._focusedCell.col };
-    });
-
-    @undoBatch
-    @action
-    createColumn = () => {
-        let index = 0;
-        let found = this.props.columns.findIndex(col => col.heading.toUpperCase() === "New field".toUpperCase()) > -1;
-        while (found) {
-            index++;
-            found = this.props.columns.findIndex(col => col.heading.toUpperCase() === ("New field (" + index + ")").toUpperCase()) > -1;
-        }
-        this.props.columns.push(new SchemaHeaderField(`New field ${index ? "(" + index + ")" : ""}`, "#f1efeb"));
-    }
-
-    @action
-    getColumnType = (column: SchemaHeaderField, doc?: Doc, field?: string): ColumnType => {
-        if (doc && field && column.type === ColumnType.Any) {
-            const val = doc[CollectionSchemaCell.resolvedFieldKey(field, doc)];
-            if (val instanceof ImageField) return ColumnType.Image;
-            if (val instanceof Doc) return ColumnType.Doc;
-            if (val instanceof DateField) return ColumnType.Date;
-            if (val instanceof List) return ColumnType.List;
-        }
-        if (column.type && column.type !== 0) {
-            return column.type;
-        }
-        if (columnTypes.get(column.heading)) {
-            return column.type = columnTypes.get(column.heading)!;
-        }
-        return column.type = ColumnType.Any;
-    }
-
-    @undoBatch
-    @action
-    toggleTextwrap = async () => {
-        const textwrappedRows = Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
-        if (textwrappedRows.length) {
-            this.props.Document.textwrappedSchemaRows = new List<string>([]);
-        } else {
-            const docs = DocListCast(this.props.Document[this.props.fieldKey]);
-            const allRows = docs instanceof Doc ? [docs[Id]] : docs.map(doc => doc[Id]);
-            this.props.Document.textwrappedSchemaRows = new List<string>(allRows);
-        }
-    }
-
-    @action
-    toggleTextWrapRow = (doc: Doc): void => {
-        const textWrapped = this.textWrappedRows;
-        const index = textWrapped.findIndex(id => doc[Id] === id);
-
-        index > -1 ? textWrapped.splice(index, 1) : textWrapped.push(doc[Id]);
-
-        this.textWrappedRows = textWrapped;
-    }
-
-    @computed
-    get reactTable() {
-        const children = this.childDocs;
-        const hasCollectionChild = children.reduce((found, doc) => found || doc.type === DocumentType.COL, false);
-        const expanded: { [name: string]: any } = {};
-        Array.from(this._openCollections.keys()).map(col => expanded[col.toString()] = true);
-        const rerender = [...this.textWrappedRows]; // TODO: get component to rerender on text wrap change without needign to console.log :((((
-
-        return <ReactTable
-            style={{ position: "relative" }}
-            data={children}
-            page={0}
-            pageSize={children.length}
-            showPagination={false}
-            columns={this.tableColumns}
-            getTrProps={this.getTrProps}
-            getTdProps={this.getTdProps}
-            sortable={false}
-            TrComponent={MovableRow}
-            sorted={this.sorted}
-            expanded={expanded}
-            resized={this.resized}
-            onResizedChange={this.props.onResizedChange}
-            SubComponent={!hasCollectionChild ? undefined : row => (row.original.type !== DocumentType.COL) ? (null) :
-                <div className="reactTable-sub"><SchemaTable {...this.props} Document={row.original} dataDoc={undefined} childDocs={undefined} /></div>}
-
-        />;
-    }
-
-    onContextMenu = (e: React.MouseEvent): void => {
-        ContextMenu.Instance.addItem({ description: "Toggle text wrapping", event: this.toggleTextwrap, icon: "table" });
-    }
-
-    getField = (row: number, col?: number) => {
-        const docs = this.childDocs;
-
-        row = row % docs.length;
-        while (row < 0) row += docs.length;
-        const columns = this.props.columns;
-        const doc = docs[row];
-        if (col === undefined) {
-            return doc;
-        }
-        if (col >= 0 && col < columns.length) {
-            const column = this.props.columns[col].heading;
-            return doc[column];
-        }
-        return undefined;
-    }
-
-    createTransformer = (row: number, col: number): Transformer => {
-        const self = this;
-        const captures: { [name: string]: Field } = {};
-
-        const transformer: ts.TransformerFactory<ts.SourceFile> = context => {
-            return root => {
-                function visit(node: ts.Node) {
-                    node = ts.visitEachChild(node, visit, context);
-                    if (ts.isIdentifier(node)) {
-                        const isntPropAccess = !ts.isPropertyAccessExpression(node.parent) || node.parent.expression === node;
-                        const isntPropAssign = !ts.isPropertyAssignment(node.parent) || node.parent.name !== node;
-                        if (isntPropAccess && isntPropAssign) {
-                            if (node.text === "$r") {
-                                return ts.createNumericLiteral(row.toString());
-                            } else if (node.text === "$c") {
-                                return ts.createNumericLiteral(col.toString());
-                            } else if (node.text === "$") {
-                                if (ts.isCallExpression(node.parent)) {
-                                    // captures.doc = self.props.Document;
-                                    // captures.key = self.props.fieldKey;
-                                }
-                            }
-                        }
-                    }
-
-                    return node;
-                }
-                return ts.visitNode(root, visit);
-            };
-        };
-
-        // const getVars = () => {
-        //     return { capturedVariables: captures };
-        // };
-
-        return { transformer, /*getVars*/ };
-    }
-
-    setComputed = (script: string, doc: Doc, field: string, row: number, col: number): boolean => {
-        script =
-            `const $ = (row:number, col?:number) => {
-                const rval = (doc as any)[key][row + ${row}];
-                return col === undefined ? rval : rval[(doc as any)._schemaHeaders[col + ${col}].heading];
-            }
-            return ${script}`;
-        const compiled = CompileScript(script, { params: { this: Doc.name }, capturedVariables: { doc: this.props.Document, key: this.props.fieldKey }, typecheck: false, transformer: this.createTransformer(row, col) });
-        if (compiled.compiled) {
-            doc[field] = new ComputedField(compiled);
-            return true;
-        }
-        return false;
-    }
-
-    @action
-    showDoc = (doc: Doc | undefined, dataDoc?: Doc, screenX?: number, screenY?: number) => {
-        this._showDoc = doc;
-        if (dataDoc && screenX && screenY) {
-            this._showDocPos = this.props.ScreenToLocalTransform().transformPoint(screenX, screenY);
-        }
-    }
-
-    onOpenClick = () => {
-        this._showDoc && this.props.addDocTab(this._showDoc, "add:right");
-    }
-
-    getPreviewTransform = (): Transform => {
-        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - 4 - this.tableWidth, - this.borderWidth);
-    }
-
-    render() {
-        const preview = "";
-        return <div className="collectionSchemaView-table"
-            onPointerDown={this.props.onPointerDown} onClick={this.props.onClick} onWheel={e => this.props.active(true) && e.stopPropagation()}
-            onDrop={e => this.props.onDrop(e, {})} onContextMenu={this.onContextMenu} >
-            {this.reactTable}
-            {this.props.Document._chromeHidden ? undefined : <div className="collectionSchemaView-addRow" onClick={this.createRow}>+ new</div>}
-            {!this._showDoc ? (null) :
-                <div className="collectionSchemaView-documentPreview" ref="overlay"
-                    style={{
-                        position: "absolute", width: 150, height: 150,
-                        background: "dimGray", display: "block", top: 0, left: 0,
-                        transform: `translate(${this._showDocPos[0]}px, ${this._showDocPos[1] - 180}px)`
-                    }} >
-                    <DocumentView
-                        Document={this._showDoc}
-                        DataDoc={this._showDataDoc}
-                        styleProvider={DefaultStyleProvider}
-                        layerProvider={undefined}
-                        docViewPath={returnEmptyDoclist}
-                        freezeDimensions={true}
-                        focus={DocUtils.DefaultFocus}
-                        renderDepth={this.props.renderDepth}
-                        rootSelected={returnFalse}
-                        isContentActive={returnTrue}
-                        isDocumentActive={returnFalse}
-                        PanelWidth={() => 150}
-                        PanelHeight={() => 150}
-                        ScreenToLocalTransform={this.getPreviewTransform}
-                        docFilters={returnEmptyFilter}
-                        docRangeFilters={returnEmptyFilter}
-                        searchFilterDocs={returnEmptyDoclist}
-                        ContainingCollectionDoc={this.props.CollectionView?.props.Document}
-                        ContainingCollectionView={this.props.CollectionView}
-                        moveDocument={this.props.moveDocument}
-                        whenChildContentsActiveChanged={emptyFunction}
-                        addDocTab={this.props.addDocTab}
-                        pinToPres={this.props.pinToPres}
-                        bringToFront={returnFalse}>
-                    </DocumentView>
-                </div>}
-        </div>;
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaCells.tsx b/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
new file mode 100644
index 000000000..2549beaae
--- /dev/null
+++ b/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
@@ -0,0 +1,584 @@
+import React = require("react");
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action, computed, observable } from "mobx";
+import { observer } from "mobx-react";
+import DatePicker from "react-datepicker";
+import "react-datepicker/dist/react-datepicker.css";
+import { CellInfo } from "react-table";
+import "react-table/react-table.css";
+import { DateField } from "../../../../fields/DateField";
+import { Doc, DocListCast, Field, Opt } from "../../../../fields/Doc";
+import { Id } from "../../../../fields/FieldSymbols";
+import { List } from "../../../../fields/List";
+import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { ComputedField } from "../../../../fields/ScriptField";
+import { BoolCast, Cast, DateCast, FieldValue, NumCast, StrCast } from "../../../../fields/Types";
+import { ImageField } from "../../../../fields/URLField";
+import { Utils, emptyFunction } from "../../../../Utils";
+import { Docs } from "../../../documents/Documents";
+import { DocumentType } from "../../../documents/DocumentTypes";
+import { DocumentManager } from "../../../util/DocumentManager";
+import { DragManager } from "../../../util/DragManager";
+import { KeyCodes } from "../../../util/KeyCodes";
+import { CompileScript } from "../../../util/Scripting";
+import { SearchUtil } from "../../../util/SearchUtil";
+import { SnappingManager } from "../../../util/SnappingManager";
+import { undoBatch } from "../../../util/UndoManager";
+import '../DocumentDecorations.scss';
+import { EditableView } from "../../EditableView";
+import { MAX_ROW_HEIGHT } from '../../globalCssVariables.scss';
+import { DocumentIconContainer } from "../../nodes/DocumentIcon";
+import { OverlayView } from "../../OverlayView";
+import "./CollectionSchemaView.scss";
+import { CollectionView } from "../CollectionView";
+const path = require('path');
+
+export interface CellProps {
+    row: number;
+    col: number;
+    rowProps: CellInfo;
+    CollectionView: Opt<CollectionView>;
+    ContainingCollection: Opt<CollectionView>;
+    Document: Doc;
+    fieldKey: string;
+    renderDepth: number;
+    addDocTab: (document: Doc, where: string) => boolean;
+    pinToPres: (document: Doc) => void;
+    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined,
+        addDocument: (document: Doc | Doc[]) => boolean) => boolean;
+    isFocused: boolean;
+    changeFocusedCellByIndex: (row: number, col: number) => void;
+    setIsEditing: (isEditing: boolean) => void;
+    isEditable: boolean;
+    setPreviewDoc: (doc: Doc) => void;
+    setComputed: (script: string, doc: Doc, field: string, row: number, col: number) => boolean;
+    getField: (row: number, col?: number) => void;
+    showDoc: (doc: Doc | undefined, dataDoc?: any, screenX?: number, screenY?: number) => void;
+}
+
+@observer
+export class CollectionSchemaCell extends React.Component<CellProps> {
+    public static resolvedFieldKey(column: string, rowDoc: Doc) {
+        const fieldKey = column;
+        if (fieldKey.startsWith("*")) {
+            const rootKey = fieldKey.substring(1);
+            const allKeys = [...Array.from(Object.keys(rowDoc)), ...Array.from(Object.keys(Doc.GetProto(rowDoc)))];
+            const matchedKeys = allKeys.filter(key => key.includes(rootKey));
+            if (matchedKeys.length) return matchedKeys[0];
+        }
+        return fieldKey;
+    }
+    @observable protected _isEditing: boolean = false;
+    protected _focusRef = React.createRef<HTMLDivElement>();
+    protected _rowDoc = this.props.rowProps.original;
+    protected _rowDataDoc = Doc.GetProto(this.props.rowProps.original);
+    protected _dropDisposer?: DragManager.DragDropDisposer;
+    @observable contents: string = "";
+
+    componentDidMount() { document.addEventListener("keydown", this.onKeyDown); }
+    componentWillUnmount() { document.removeEventListener("keydown", this.onKeyDown); }
+
+    @action
+    onKeyDown = (e: KeyboardEvent): void => {
+        if (this.props.isFocused && this.props.isEditable && e.keyCode === KeyCodes.ENTER) {
+            document.removeEventListener("keydown", this.onKeyDown);
+            this._isEditing = true;
+            this.props.setIsEditing(true);
+        }
+    }
+
+    @action
+    isEditingCallback = (isEditing: boolean): void => {
+        document.removeEventListener("keydown", this.onKeyDown);
+        isEditing && document.addEventListener("keydown", this.onKeyDown);
+        this._isEditing = isEditing;
+        this.props.setIsEditing(isEditing);
+        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
+    }
+
+    @action
+    onPointerDown = async (e: React.PointerEvent): Promise<void> => {
+        this.onItemDown(e);
+        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
+        this.props.setPreviewDoc(this.props.rowProps.original);
+
+        let url: string;
+        if (url = StrCast(this.props.rowProps.row.href)) {
+            try {
+                new URL(url);
+                const temp = window.open(url)!;
+                temp.blur();
+                window.focus();
+            } catch { }
+        }
+
+        const doc = Cast(this._rowDoc[this.renderFieldKey], Doc, null);
+        doc && this.props.setPreviewDoc(doc);
+    }
+
+    @undoBatch
+    applyToDoc = (doc: Doc, row: number, col: number, run: (args?: { [name: string]: any }) => any) => {
+        const res = run({ this: doc, $r: row, $c: col, $: (r: number = 0, c: number = 0) => this.props.getField(r + row, c + col) });
+        if (!res.success) return false;
+        doc[this.renderFieldKey] = res.result;
+        return true;
+    }
+
+    private drop = (e: Event, de: DragManager.DropEvent) => {
+        if (de.complete.docDragData) {
+            if (de.complete.docDragData.draggedDocuments.length === 1) {
+                this._rowDataDoc[this.renderFieldKey] = de.complete.docDragData.draggedDocuments[0];
+            }
+            else {
+                const coll = Docs.Create.SchemaDocument([new SchemaHeaderField("title", "#f1efeb")], de.complete.docDragData.draggedDocuments, {});
+                this._rowDataDoc[this.renderFieldKey] = coll;
+            }
+            e.stopPropagation();
+        }
+    }
+
+    protected dropRef = (ele: HTMLElement | null) => {
+        this._dropDisposer?.();
+        ele && (this._dropDisposer = DragManager.MakeDropTarget(ele, this.drop.bind(this)));
+    }
+
+    returnHighlights(contents: string, positions?: number[]) {
+        if (positions) {
+            const results = [];
+            StrCast(this.props.Document._searchString);
+            const length = StrCast(this.props.Document._searchString).length;
+            const color = contents ? "black" : "grey";
+
+            results.push(<span key="-1" style={{ color }}>{contents?.slice(0, positions[0])}</span>);
+            positions.forEach((num, cur) => {
+                results.push(<span key={"start" + cur} style={{ backgroundColor: "#FFFF00", color }}>{contents?.slice(num, num + length)}</span>);
+                let end = 0;
+                cur === positions.length - 1 ? end = contents.length : end = positions[cur + 1];
+                results.push(<span key={"end" + cur} style={{ color }}>{contents?.slice(num + length, end)}</span>);
+            }
+            );
+            return results;
+        }
+        return <span style={{ color: contents ? "black" : "grey" }}>{contents ? contents?.valueOf() : "undefined"}</span>;
+    }
+
+    @computed get renderFieldKey() { return CollectionSchemaCell.resolvedFieldKey(this.props.rowProps.column.id!, this.props.rowProps.original); }
+    onItemDown = async (e: React.PointerEvent) => {
+        if (this.props.Document._searchDoc) {
+            const aliasdoc = await SearchUtil.GetAliasesOfDocument(this._rowDataDoc);
+            const targetContext = aliasdoc.length <= 0 ? undefined : Cast(aliasdoc[0].context, Doc, null);
+            DocumentManager.Instance.jumpToDocument(this._rowDoc, false, emptyFunction, targetContext,
+                undefined, undefined, undefined, () => this.props.setPreviewDoc(this._rowDoc));
+        }
+    }
+    renderCellWithType(type: string | undefined) {
+        const dragRef: React.RefObject<HTMLDivElement> = React.createRef();
+
+        const fieldKey = this.renderFieldKey;
+        const field = this._rowDoc[fieldKey];
+
+        const onPointerEnter = (e: React.PointerEvent): void => {
+            if (e.buttons === 1 && SnappingManager.GetIsDragging() && (type === "document" || type === undefined)) {
+                dragRef.current!.className = "collectionSchemaView-cellContainer doc-drag-over";
+            }
+        };
+        const onPointerLeave = (e: React.PointerEvent): void => {
+            dragRef.current!.className = "collectionSchemaView-cellContainer";
+        };
+
+        let contents = Field.toString(field as Field);
+        contents = contents === "" ? "--" : contents;
+
+        let className = "collectionSchemaView-cellWrapper";
+        if (this._isEditing) className += " editing";
+        if (this.props.isFocused && this.props.isEditable) className += " focused";
+        if (this.props.isFocused && !this.props.isEditable) className += " inactive";
+
+        const positions = [];
+        if (StrCast(this.props.Document._searchString).toLowerCase() !== "") {
+            let term = (field instanceof Promise) ? "...promise pending..." : contents.toLowerCase();
+            const search = StrCast(this.props.Document._searchString).toLowerCase();
+            let start = term.indexOf(search);
+            let tally = 0;
+            if (start !== -1) {
+                positions.push(start);
+            }
+            while (start < contents?.length && start !== -1) {
+                term = term.slice(start + search.length + 1);
+                tally += start + search.length + 1;
+                start = term.indexOf(search);
+                positions.push(tally + start);
+            }
+            if (positions.length > 1) {
+                positions.pop();
+            }
+        }
+        const placeholder = type === "number" ? "0" : contents === "" ? "--" : "undefined";
+        return (
+            <div className="collectionSchemaView-cellContainer" style={{ cursor: field instanceof Doc ? "grab" : "auto" }}
+                ref={dragRef} onPointerDown={this.onPointerDown} onClick={action(e => this._isEditing = true)} onPointerEnter={onPointerEnter} onPointerLeave={onPointerLeave}>
+                <div className={className} ref={this._focusRef} tabIndex={-1}>
+                    <div className="collectionSchemaView-cellContents" ref={type === undefined || type === "document" ? this.dropRef : null}>
+                        {!this.props.Document._searchDoc ?
+                            <EditableView
+                                editing={this._isEditing}
+                                isEditingCallback={this.isEditingCallback}
+                                display={"inline"}
+                                contents={contents}
+                                height={"auto"}
+                                maxHeight={Number(MAX_ROW_HEIGHT)}
+                                placeholder={placeholder}
+                                GetValue={() => {
+                                    const cfield = ComputedField.WithoutComputed(() => FieldValue(field));
+                                    const cscript = cfield instanceof ComputedField ? cfield.script.originalScript : undefined;
+                                    const cfinalScript = cscript?.split("return")[cscript.split("return").length - 1];
+                                    return cscript ? (cfinalScript?.endsWith(";") ? `:=${cfinalScript?.substring(0, cfinalScript.length - 2)}` : cfinalScript) :
+                                        Field.IsField(cfield) ? Field.toScriptString(cfield) : "";
+                                }}
+                                SetValue={action((value: string) => {
+                                    // sets what is displayed after the user makes an input
+                                    let retVal = false;
+                                    if (value.startsWith(":=") || value.startsWith("=:=")) {
+                                        // decides how to compute a value when given either of the above strings
+                                        const script = value.substring(value.startsWith("=:=") ? 3 : 2);
+                                        retVal = this.props.setComputed(script, value.startsWith(":=") ? this._rowDataDoc : this._rowDoc, this.renderFieldKey, this.props.row, this.props.col);
+                                    } else {
+                                        // check if the input is a number
+                                        let inputIsNum = true;
+                                        for (let s of value) {
+                                            if (isNaN(parseInt(s))) {
+                                                inputIsNum = false;
+                                            }
+                                        }
+                                        // check if the input is a boolean
+                                        let inputIsBool: boolean = value == "false" || value == "true";
+                                        // what to do in the case 
+                                        if (!inputIsNum && !inputIsBool && !value.startsWith("=")) {
+                                            // if it's not a number, it's a string, and should be processed as such
+                                            // strips the string of quotes when it is edited to prevent quotes form being added to the text automatically 
+                                            // after each edit
+                                            let valueSansQuotes = value;
+                                            if (this._isEditing) {
+                                                const vsqLength = valueSansQuotes.length;
+                                                // get rid of outer quotes
+                                                valueSansQuotes = valueSansQuotes.substring(value.startsWith("\"") ? 1 : 0,
+                                                    valueSansQuotes.charAt(vsqLength - 1) == "\"" ? vsqLength - 1 : vsqLength);
+                                            }
+                                            let inputAsString = '"';
+                                            // escape any quotes in the string
+                                            for (const i of valueSansQuotes) {
+                                                if (i == '"') {
+                                                    inputAsString += '\\"';
+                                                } else {
+                                                    inputAsString += i;
+                                                }
+                                            }
+                                            // add a closing quote
+                                            inputAsString += '"';
+                                            //two options here: we can strip off outer quotes or we can figure out what's going on with the script
+                                            const script = CompileScript(inputAsString, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                            const changeMade = inputAsString.length !== value.length || inputAsString.length - 2 !== value.length
+                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            // handle numbers and expressions
+                                        } else if (inputIsNum || value.startsWith("=")) {
+                                            //TODO: make accept numbers
+                                            const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
+                                            // if commas are not stripped, the parser only considers the numbers after the last comma
+                                            let inputSansCommas = "";
+                                            for (let s of inputscript) {
+                                                if (!(s == ",")) {
+                                                    inputSansCommas += s;
+                                                }
+                                            }
+                                            const script = CompileScript(inputSansCommas, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
+                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            // handle booleans
+                                        } else if (inputIsBool) {
+                                            const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
+                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                        }
+                                    }
+                                    if (retVal) {
+                                        this._isEditing = false; // need to set this here. otherwise, the assignment of the field will invalidate & cause render() to be called with the wrong value for 'editing'
+                                        this.props.setIsEditing(false);
+                                    }
+                                    return retVal;
+                                })}
+                                OnFillDown={async (value: string) => {
+                                    const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                    script.compiled && DocListCast(this.props.Document[this.props.fieldKey]).
+                                        forEach((doc, i) => value.startsWith(":=") ?
+                                            this.props.setComputed(value.substring(2), Doc.GetProto(doc), this.renderFieldKey, i, this.props.col) :
+                                            this.applyToDoc(Doc.GetProto(doc), i, this.props.col, script.run));
+                                }}
+                            />
+                            :
+                            this.returnHighlights(contents, positions)
+                        }
+                    </div >
+                </div>
+            </div>
+        );
+    }
+
+    render() { return this.renderCellWithType(undefined); }
+}
+
+@observer
+export class CollectionSchemaNumberCell extends CollectionSchemaCell { render() { return this.renderCellWithType("number"); } }
+
+@observer
+export class CollectionSchemaBooleanCell extends CollectionSchemaCell { render() { return this.renderCellWithType("boolean"); } }
+
+@observer
+export class CollectionSchemaStringCell extends CollectionSchemaCell { render() { return this.renderCellWithType("string"); } }
+
+@observer
+export class CollectionSchemaDateCell extends CollectionSchemaCell {
+    @computed get _date(): Opt<DateField> { return this._rowDoc[this.renderFieldKey] instanceof DateField ? DateCast(this._rowDoc[this.renderFieldKey]) : undefined; }
+
+    @action
+    handleChange = (date: any) => {
+        // const script = CompileScript(date.toString(), { requiredType: "Date", addReturn: true, params: { this: Doc.name } });
+        // if (script.compiled) {
+        //     this.applyToDoc(this._document, this.props.row, this.props.col, script.run);
+        // } else {
+        // ^ DateCast is always undefined for some reason, but that is what the field should be set to
+        this._rowDoc[this.renderFieldKey] = new DateField(date as Date);
+        //}
+    }
+
+    render() {
+        return !this.props.isFocused ? <span onPointerDown={this.onPointerDown}>{this._date ? Field.toString(this._date as Field) : "--"}</span> :
+            <DatePicker
+                selected={this._date?.date || new Date}
+                onSelect={date => this.handleChange(date)}
+                onChange={date => this.handleChange(date)}
+            />;
+    }
+}
+
+@observer
+export class CollectionSchemaDocCell extends CollectionSchemaCell {
+
+    _overlayDisposer?: () => void;
+
+    @computed get _doc() { return FieldValue(Cast(this._rowDoc[this.renderFieldKey], Doc)); }
+
+    @action
+    onSetValue = (value: string) => {
+        this._doc && (Doc.GetProto(this._doc).title = value);
+
+        const script = CompileScript(value, {
+            addReturn: true,
+            typecheck: false,
+            transformer: DocumentIconContainer.getTransformer()
+        });
+
+        const results = script.compiled && script.run();
+        if (results && results.success) {
+            this._rowDoc[this.renderFieldKey] = results.result;
+            return true;
+        }
+        return false;
+    }
+
+    componentWillUnmount() { this.onBlur(); }
+
+    onBlur = () => { this._overlayDisposer?.(); };
+    onFocus = () => {
+        this.onBlur();
+        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
+    }
+
+    @action
+    isEditingCallback = (isEditing: boolean): void => {
+        document.removeEventListener("keydown", this.onKeyDown);
+        isEditing && document.addEventListener("keydown", this.onKeyDown);
+        this._isEditing = isEditing;
+        this.props.setIsEditing(isEditing);
+        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
+    }
+
+    render() {
+        return !this._doc ? this.renderCellWithType("document") :
+            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1}
+                onPointerDown={this.onPointerDown}
+            >
+                <div className="collectionSchemaView-cellContents-document"
+                    style={{ padding: "5.9px" }}
+                    ref={this.dropRef}
+                    onFocus={this.onFocus}
+                    onBlur={this.onBlur}
+                >
+                    <EditableView
+                        editing={this._isEditing}
+                        isEditingCallback={this.isEditingCallback}
+                        display={"inline"}
+                        contents={this._doc.title || "--"}
+                        height={"auto"}
+                        maxHeight={Number(MAX_ROW_HEIGHT)}
+                        GetValue={() => StrCast(this._doc?.title)}
+                        SetValue={action((value: string) => {
+                            this.onSetValue(value);
+                            return true;
+                        })}
+                    />
+                </div >
+                <div onClick={() => this._doc && this.props.addDocTab(this._doc, "add:right")} className="collectionSchemaView-cellContents-docButton">
+                    <FontAwesomeIcon icon="external-link-alt" size="lg" />
+                </div>
+            </div>;
+    }
+}
+
+@observer
+export class CollectionSchemaImageCell extends CollectionSchemaCell {
+
+    choosePath(url: URL) {
+        if (url.protocol === "data") return url.href;
+        if (url.href.indexOf(window.location.origin) === -1) return Utils.CorsProxy(url.href);
+        if (!/\.(png|jpg|jpeg|gif|webp)$/.test(url.href.toLowerCase())) return url.href;//Why is this here
+
+        const ext = path.extname(url.href);
+        return url.href.replace(ext, "_o" + path.extname(url.href));
+    }
+
+    render() {
+        const field = Cast(this._rowDoc[this.renderFieldKey], ImageField, null); // retrieve the primary image URL that is being rendered from the data doc
+        const alts = DocListCast(this._rowDoc[this.renderFieldKey + "-alternates"]); // retrieve alternate documents that may be rendered as alternate images
+        const altpaths = alts.map(doc => Cast(doc[Doc.LayoutFieldKey(doc)], ImageField, null)?.url).filter(url => url).map(url => this.choosePath(url)); // access the primary layout data of the alternate documents
+        const paths = field ? [this.choosePath(field.url), ...altpaths] : altpaths;
+        const url = paths.length ? paths : [Utils.CorsProxy("http://www.cs.brown.edu/~bcz/noImage.png")];
+
+        const aspect = Doc.NativeAspect(this._rowDoc);
+        let width = Math.min(75, this.props.rowProps.width);
+        const height = Math.min(75, width / aspect);
+        width = height * aspect;
+
+        const reference = React.createRef<HTMLDivElement>();
+        return <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
+            <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
+                <img src={url[0]}
+                    width={paths.length ? width : "20px"}
+                    height={paths.length ? height : "20px"} />
+            </div >
+        </div>;
+    }
+}
+
+
+@observer
+export class CollectionSchemaListCell extends CollectionSchemaCell {
+    _overlayDisposer?: () => void;
+
+    @computed get _field() { return this._rowDoc[this.renderFieldKey]; }
+    @computed get _optionsList() { return this._field as List<any>; }
+    @observable private _opened = false;
+    @observable private _text = "select an item";
+    @observable private _selectedNum = 0;
+
+    @action
+    onSetValue = (value: string) => {
+        // change if its a document
+        this._optionsList[this._selectedNum] = this._text = value;
+
+        (this._field as List<any>).splice(this._selectedNum, 1, value);
+    }
+
+    @action
+    onSelected = (element: string, index: number) => {
+        this._text = element;
+        this._selectedNum = index;
+    }
+
+    onFocus = () => {
+        this._overlayDisposer?.();
+        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
+    }
+
+    render() {
+        const link = false;
+        const reference = React.createRef<HTMLDivElement>();
+
+        if (this._optionsList?.length) {
+            const options = !this._opened ? (null) :
+                <div>
+                    {this._optionsList.map((element, index) => {
+                        const val = Field.toString(element);
+                        return <div className="collectionSchemaView-dropdownOption" key={index} style={{ padding: "6px" }} onPointerDown={(e) => this.onSelected(StrCast(element), index)} >
+                            {val}
+                        </div>;
+                    })}
+                </div>;
+
+            const plainText = <div style={{ padding: "5.9px" }}>{this._text}</div>;
+            const textarea = <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} style={{ padding: "5.9px" }} ref={this.dropRef} >
+                <EditableView
+                    editing={this._isEditing}
+                    isEditingCallback={this.isEditingCallback}
+                    display={"inline"}
+                    contents={this._text}
+                    height={"auto"}
+                    maxHeight={Number(MAX_ROW_HEIGHT)}
+                    GetValue={() => this._text}
+                    SetValue={action((value: string) => {
+                        // add special for params 
+                        this.onSetValue(value);
+                        return true;
+                    })}
+                />
+            </div >;
+
+            //☰
+            return (
+                <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
+                    <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
+                        <div className="collectionSchemaView-dropDownWrapper">
+                            <button type="button" className="collectionSchemaView-dropdownButton" style={{ right: "length", position: "relative" }}
+                                onClick={action(e => this._opened = !this._opened)} >
+                                <FontAwesomeIcon icon={this._opened ? "caret-up" : "caret-down"} size="sm" />
+                            </button>
+                            <div className="collectionSchemaView-dropdownText"> {link ? plainText : textarea} </div>
+                        </div>
+                        {options}
+                    </div >
+                </div>
+            );
+        }
+        return this.renderCellWithType("list");
+    }
+}
+
+
+@observer
+export class CollectionSchemaCheckboxCell extends CollectionSchemaCell {
+    @computed get _isChecked() { return BoolCast(this._rowDoc[this.renderFieldKey]); }
+
+    render() {
+        const reference = React.createRef<HTMLDivElement>();
+        return (
+            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
+                <input type="checkbox" checked={this._isChecked} onChange={e => this._rowDoc[this.renderFieldKey] = e.target.checked} />
+            </div>
+        );
+    }
+}
+
+
+@observer
+export class CollectionSchemaButtons extends CollectionSchemaCell {
+    render() {
+        return !this.props.Document._searchDoc || ![DocumentType.PDF, DocumentType.RTF].includes(StrCast(this._rowDoc.type) as DocumentType) ? <></> :
+            <div style={{ paddingTop: 8, paddingLeft: 3 }} >
+                <button style={{ padding: 2, left: 77 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, true)}>
+                    <FontAwesomeIcon icon="arrow-up" size="sm" />
+                </button>
+                <button style={{ padding: 2 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, false)} >
+                    <FontAwesomeIcon icon="arrow-down" size="sm" />
+                </button>
+            </div>;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx b/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
new file mode 100644
index 000000000..b825d6d96
--- /dev/null
+++ b/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
@@ -0,0 +1,518 @@
+import React = require("react");
+import { IconProp, library } from "@fortawesome/fontawesome-svg-core";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action, computed, observable, runInAction } from "mobx";
+import { observer } from "mobx-react";
+import { Doc, DocListCast, Opt } from "../../../../fields/Doc";
+import { listSpec } from "../../../../fields/Schema";
+import { PastelSchemaPalette, SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { ScriptField } from "../../../../fields/ScriptField";
+import { Cast, StrCast } from "../../../../fields/Types";
+import { undoBatch } from "../../../util/UndoManager";
+import { SearchBox } from "../../search/SearchBox";
+import { ColumnType } from "../CollectionSchemaView";
+import "./CollectionSchemaView.scss";
+import { CollectionView } from "../CollectionView";
+
+const higflyout = require("@hig/flyout");
+export const { anchorPoints } = higflyout;
+export const Flyout = higflyout.default;
+
+
+export interface AddColumnHeaderProps {
+    createColumn: () => void;
+}
+
+@observer
+export class CollectionSchemaAddColumnHeader extends React.Component<AddColumnHeaderProps> {
+    render() {
+        return (
+            <button className="add-column" onClick={() => this.props.createColumn()}><FontAwesomeIcon icon="plus" size="sm" /></button>
+        );
+    }
+}
+
+
+export interface ColumnMenuProps {
+    columnField: SchemaHeaderField;
+    // keyValue: string;
+    possibleKeys: string[];
+    existingKeys: string[];
+    // keyType: ColumnType;
+    typeConst: boolean;
+    menuButtonContent: JSX.Element;
+    addNew: boolean;
+    onSelect: (oldKey: string, newKey: string, addnew: boolean) => void;
+    setIsEditing: (isEditing: boolean) => void;
+    deleteColumn: (column: string) => void;
+    onlyShowOptions: boolean;
+    setColumnType: (column: SchemaHeaderField, type: ColumnType) => void;
+    setColumnSort: (column: SchemaHeaderField, desc: boolean | undefined) => void;
+    anchorPoint?: any;
+    setColumnColor: (column: SchemaHeaderField, color: string) => void;
+}
+@observer
+export class CollectionSchemaColumnMenu extends React.Component<ColumnMenuProps> {
+    @observable private _isOpen: boolean = false;
+    @observable private _node: HTMLDivElement | null = null;
+
+    componentDidMount() { document.addEventListener("pointerdown", this.detectClick); }
+
+    componentWillUnmount() { document.removeEventListener("pointerdown", this.detectClick); }
+
+    @action
+    detectClick = (e: PointerEvent) => {
+        !this._node?.contains(e.target as Node) && this.props.setIsEditing(this._isOpen = false);
+    }
+
+    @action
+    toggleIsOpen = (): void => {
+        this.props.setIsEditing(this._isOpen = !this._isOpen);
+    }
+
+    changeColumnType = (type: ColumnType) => {
+        this.props.setColumnType(this.props.columnField, type);
+    }
+
+    changeColumnSort = (desc: boolean | undefined) => {
+        this.props.setColumnSort(this.props.columnField, desc);
+    }
+
+    changeColumnColor = (color: string) => {
+        this.props.setColumnColor(this.props.columnField, color);
+    }
+
+    @action
+    setNode = (node: HTMLDivElement): void => {
+        if (node) {
+            this._node = node;
+        }
+    }
+
+    renderTypes = () => {
+        if (this.props.typeConst) return (null);
+
+        const type = this.props.columnField.type;
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Column type:</label>
+                <div className="columnMenu-types">
+                    <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Any)}>
+                        <FontAwesomeIcon icon={"align-justify"} size="sm" />
+                        Any
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Number)}>
+                        <FontAwesomeIcon icon={"hashtag"} size="sm" />
+                        Number
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.String)}>
+                        <FontAwesomeIcon icon={"font"} size="sm" />
+                        Text
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Boolean)}>
+                        <FontAwesomeIcon icon={"check-square"} size="sm" />
+                        Checkbox
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.List)}>
+                        <FontAwesomeIcon icon={"list-ul"} size="sm" />
+                        List
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Doc)}>
+                        <FontAwesomeIcon icon={"file"} size="sm" />
+                        Document
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Image)}>
+                        <FontAwesomeIcon icon={"image"} size="sm" />
+                        Image
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Date)}>
+                        <FontAwesomeIcon icon={"calendar"} size="sm" />
+                        Date
+                    </div>
+                </div>
+            </div >
+        );
+    }
+
+    renderSorting = () => {
+        const sort = this.props.columnField.desc;
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Sort by:</label>
+                <div className="columnMenu-sort">
+                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.changeColumnSort(true)}>
+                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
+                        Sort descending
+                    </div>
+                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.changeColumnSort(false)}>
+                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
+                        Sort ascending
+                    </div>
+                    <div className="columnMenu-option" onClick={() => this.changeColumnSort(undefined)}>
+                        <FontAwesomeIcon icon="times" size="sm" />
+                        Clear sorting
+                    </div>
+                </div>
+            </div>
+        );
+    }
+
+    renderColors = () => {
+        const selected = this.props.columnField.color;
+
+        const pink = PastelSchemaPalette.get("pink2");
+        const purple = PastelSchemaPalette.get("purple2");
+        const blue = PastelSchemaPalette.get("bluegreen1");
+        const yellow = PastelSchemaPalette.get("yellow4");
+        const red = PastelSchemaPalette.get("red2");
+        const gray = "#f1efeb";
+
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Color:</label>
+                <div className="columnMenu-colors">
+                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.changeColumnColor(pink!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.changeColumnColor(purple!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.changeColumnColor(blue!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.changeColumnColor(yellow!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.changeColumnColor(red!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.changeColumnColor(gray)}></div>
+                </div>
+            </div>
+        );
+    }
+
+    renderContent = () => {
+        return (
+            <div className="collectionSchema-header-menuOptions">
+                {this.props.onlyShowOptions ? <></> :
+                    <>
+                        {this.renderTypes()}
+                        {this.renderSorting()}
+                        {this.renderColors()}
+                        <div className="collectionSchema-headerMenu-group">
+                            <button onClick={() => this.props.deleteColumn(this.props.columnField.heading)}>Delete Column</button>
+                        </div>
+                    </>
+                }
+            </div>
+        );
+    }
+
+    render() {
+        return (
+            <div className="collectionSchema-header-menu" ref={this.setNode}>
+                <Flyout anchorPoint={this.props.anchorPoint ? this.props.anchorPoint : anchorPoints.TOP_CENTER} content={this.renderContent()}>
+                    <div className="collectionSchema-header-toggler" onClick={() => this.toggleIsOpen()}>{this.props.menuButtonContent}</div>
+                </ Flyout >
+            </div>
+        );
+    }
+}
+
+
+export interface KeysDropdownProps {
+    keyValue: string;
+    possibleKeys: string[];
+    existingKeys: string[];
+    canAddNew: boolean;
+    addNew: boolean;
+    onSelect: (oldKey: string, newKey: string, addnew: boolean, filter?: string) => void;
+    setIsEditing: (isEditing: boolean) => void;
+    width?: string;
+    docs?: Doc[];
+    Document: Doc;
+    dataDoc: Doc | undefined;
+    fieldKey: string;
+    ContainingCollectionDoc: Doc | undefined;
+    ContainingCollectionView: Opt<CollectionView>;
+    active?: (outsideReaction?: boolean) => boolean;
+    openHeader: (column: any, screenx: number, screeny: number) => void;
+    col: SchemaHeaderField;
+    icon: IconProp;
+}
+@observer
+export class KeysDropdown extends React.Component<KeysDropdownProps> {
+    @observable private _key: string = this.props.keyValue;
+    @observable private _searchTerm: string = this.props.keyValue;
+    @observable private _isOpen: boolean = false;
+    @observable private _node: HTMLDivElement | null = null;
+    @observable private _inputRef: React.RefObject<HTMLInputElement> = React.createRef();
+
+    @action setSearchTerm = (value: string): void => { this._searchTerm = value; };
+    @action setKey = (key: string): void => { this._key = key; };
+    @action setIsOpen = (isOpen: boolean): void => { this._isOpen = isOpen; };
+
+    @action
+    onSelect = (key: string): void => {
+        this.props.onSelect(this._key, key, this.props.addNew);
+        this.setKey(key);
+        this._isOpen = false;
+        this.props.setIsEditing(false);
+    }
+
+    @action
+    setNode = (node: HTMLDivElement): void => {
+        if (node) {
+            this._node = node;
+        }
+    }
+
+    componentDidMount() {
+        document.addEventListener("pointerdown", this.detectClick);
+        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
+        if (filters?.some(filter => filter.split(":")[0] === this._key)) {
+            runInAction(() => this.closeResultsVisibility = "contents");
+        }
+    }
+
+    @action
+    detectClick = (e: PointerEvent): void => {
+        if (this._node && this._node.contains(e.target as Node)) {
+        } else {
+            this._isOpen = false;
+            this.props.setIsEditing(false);
+        }
+    }
+
+    private tempfilter: string = "";
+    @undoBatch
+    onKeyDown = (e: React.KeyboardEvent): void => {
+        if (e.key === "Enter") {
+            if (this._searchTerm.includes(":")) {
+                const colpos = this._searchTerm.indexOf(":");
+                const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
+                if (temp === "") {
+                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
+                    this.updateFilter();
+                }
+                else {
+                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
+                    this.tempfilter = temp;
+                    Doc.setDocFilter(this.props.Document, this._key, temp, "check");
+                    this.props.col.setColor("green");
+                    this.closeResultsVisibility = "contents";
+                }
+            }
+            else {
+                Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
+                this.updateFilter();
+                if (this.showKeys.length) {
+                    this.onSelect(this.showKeys[0]);
+                } else if (this._searchTerm !== "" && this.props.canAddNew) {
+                    this.setSearchTerm(this._searchTerm || this._key);
+                    this.onSelect(this._searchTerm);
+                }
+            }
+        }
+    }
+
+    onChange = (val: string): void => {
+        this.setSearchTerm(val);
+    }
+
+    @action
+    onFocus = (e: React.FocusEvent): void => {
+        this._isOpen = true;
+        this.props.setIsEditing(true);
+    }
+
+    @computed get showKeys() {
+        const whitelistKeys = ["context", "author", "*lastModified", "text", "data", "tags", "creationDate"];
+        const keyOptions = this._searchTerm === "" ? this.props.possibleKeys : this.props.possibleKeys.filter(key => key.toUpperCase().indexOf(this._searchTerm.toUpperCase()) > -1);
+        const showKeys = new Set<string>();
+        [...keyOptions, ...whitelistKeys].forEach(key => (!Doc.UserDoc().noviceMode ||
+            whitelistKeys.includes(key)
+            || ((!key.startsWith("_") && key[0] === key[0].toUpperCase()) || key[0] === "#")) ? showKeys.add(key) : null);
+        return Array.from(showKeys.keys()).filter(key => !this._searchTerm || key.includes(this._searchTerm));
+    }
+    @action
+    renderOptions = (): JSX.Element[] | JSX.Element => {
+        if (!this._isOpen) {
+            this.defaultMenuHeight = 0;
+            return <></>;
+        }
+        const options = this.showKeys.map(key => {
+            return <div key={key} className="key-option" style={{
+                border: "1px solid lightgray",
+                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
+            }}
+                onPointerDown={e => {
+                    e.stopPropagation();
+                }}
+                onClick={() => {
+                    this.onSelect(key);
+                    this.setSearchTerm("");
+                }}>{key}</div>;
+        });
+
+        // if search term does not already exist as a group type, give option to create new group type
+
+        if (this._key !== this._searchTerm.slice(0, this._key.length)) {
+            if (this._searchTerm !== "" && this.props.canAddNew) {
+                options.push(<div key={""} className="key-option" style={{
+                    border: "1px solid lightgray", width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
+                }}
+                    onClick={() => { this.onSelect(this._searchTerm); this.setSearchTerm(""); }}>
+                    Create "{this._searchTerm}" key</div>);
+            }
+        }
+
+        if (options.length === 0) {
+            this.defaultMenuHeight = 0;
+        }
+        else {
+            if (this.props.docs) {
+                const panesize = this.props.docs.length * 30;
+                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+            else {
+                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+        }
+        return options;
+    }
+
+    docSafe: Doc[] = [];
+
+    @action
+    renderFilterOptions = (): JSX.Element[] | JSX.Element => {
+        if (!this._isOpen || !this.props.dataDoc) {
+            this.defaultMenuHeight = 0;
+            return <></>;
+        }
+        const keyOptions: string[] = [];
+        const colpos = this._searchTerm.indexOf(":");
+        const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
+        if (this.docSafe.length === 0) {
+            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
+        }
+        const docs = this.docSafe;
+        docs.forEach((doc) => {
+            const key = StrCast(doc[this._key]);
+            if (keyOptions.includes(key) === false && key.includes(temp) && key !== "") {
+                keyOptions.push(key);
+            }
+        });
+
+        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
+        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
+            this.props.col.setColor("rgb(241, 239, 235)");
+            this.closeResultsVisibility = "none";
+        }
+        for (let i = 0; i < (filters?.length ?? 0) - 1; i++) {
+            if (filters![i] === this.props.col.heading && keyOptions.includes(filters![i].split(":")[1]) === false) {
+                keyOptions.push(filters![i + 1]);
+            }
+        }
+        const options = keyOptions.map(key => {
+            let bool = false;
+            if (filters !== undefined) {
+                const ind = filters.findIndex(filter => filter.split(":")[0] === key);
+                const fields = ind === -1 ? undefined : filters[ind].split(":");
+                bool = fields ? fields[1] === "check" : false;
+            }
+            return <div key={key} className="key-option" style={{
+                border: "1px solid lightgray", paddingLeft: 5, textAlign: "left",
+                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white", backgroundColor: "white",
+            }}
+            >
+                <input type="checkbox"
+                    onPointerDown={e => e.stopPropagation()}
+                    onClick={e => e.stopPropagation()}
+                    onChange={(e) => {
+                        e.target.checked === true ? Doc.setDocFilter(this.props.Document, this._key, key, "check") : Doc.setDocFilter(this.props.Document, this._key, key, "remove");
+                        e.target.checked === true ? this.closeResultsVisibility = "contents" : console.log("");
+                        e.target.checked === true ? this.props.col.setColor("green") : this.updateFilter();
+                        e.target.checked === true && SearchBox.Instance.filter === true ? Doc.setDocFilter(docs[0], this._key, key, "check") : Doc.setDocFilter(docs[0], this._key, key, "remove");
+                    }}
+                    checked={bool}
+                />
+                <span style={{ paddingLeft: 4 }}>
+                    {key}
+                </span>
+
+            </div>;
+        });
+        if (options.length === 0) {
+            this.defaultMenuHeight = 0;
+        }
+        else {
+            if (this.props.docs) {
+                const panesize = this.props.docs.length * 30;
+                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+            else {
+                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+
+        }
+        return options;
+    }
+
+    @observable defaultMenuHeight = 0;
+
+
+    updateFilter() {
+        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
+        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
+            this.props.col.setColor("rgb(241, 239, 235)");
+            this.closeResultsVisibility = "none";
+        }
+    }
+
+    @computed get scriptField() {
+        const scriptText = "setDocFilter(containingTreeView, heading, this.title, checked)";
+        const script = ScriptField.MakeScript(scriptText, { this: Doc.name, heading: "string", checked: "string", containingTreeView: Doc.name });
+        return script ? () => script : undefined;
+    }
+    filterBackground = () => "rgba(105, 105, 105, 0.432)";
+    @observable filterOpen: boolean | undefined = undefined;
+    closeResultsVisibility: string = "none";
+
+    removeFilters = (e: React.PointerEvent): void => {
+        const keyOptions: string[] = [];
+        if (this.docSafe.length === 0 && this.props.dataDoc) {
+            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
+        }
+        const docs = this.docSafe;
+        docs.forEach((doc) => {
+            const key = StrCast(doc[this._key]);
+            if (keyOptions.includes(key) === false) {
+                keyOptions.push(key);
+            }
+        });
+
+        Doc.setDocFilter(this.props.Document, this._key, "", "remove");
+        this.props.col.setColor("rgb(241, 239, 235)");
+        this.closeResultsVisibility = "none";
+    }
+    render() {
+        return (
+            <div style={{ display: "flex" }} ref={this.setNode}>
+                <FontAwesomeIcon onClick={e => { this.props.openHeader(this.props.col, e.clientX, e.clientY); e.stopPropagation(); }} icon={this.props.icon} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} />
+
+                {/* <FontAwesomeIcon icon={fa.faSearchMinus} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} onClick={e => {
+                    runInAction(() => { this._isOpen === undefined ? this._isOpen = true : this._isOpen = !this._isOpen })
+                }} /> */}
+
+                <div className="keys-dropdown" style={{ zIndex: 1, width: this.props.width, maxWidth: this.props.width }}>
+                    <input className="keys-search" style={{ width: "100%" }}
+                        ref={this._inputRef} type="text" value={this._searchTerm} placeholder="Column key" onKeyDown={this.onKeyDown}
+                        onChange={e => this.onChange(e.target.value)}
+                        onClick={(e) => { e.stopPropagation(); this._inputRef.current?.focus(); }}
+                        onFocus={this.onFocus} ></input>
+                    <div style={{ display: this.closeResultsVisibility }}>
+                        <FontAwesomeIcon onPointerDown={this.removeFilters} icon={"times-circle"} size="lg"
+                            style={{ cursor: "hand", color: "grey", padding: 2, left: -20, top: -1, height: 15, position: "relative" }} />
+                    </div>
+                    {!this._isOpen ? (null) : <div className="keys-options-wrapper" style={{
+                        width: this.props.width, maxWidth: this.props.width, height: "auto",
+                    }}>
+                        {this._searchTerm.includes(":") ? this.renderFilterOptions() : this.renderOptions()}
+                    </div>}
+                </div >
+            </div>
+        );
+    }
+}
diff --git a/src/client/views/collections/schemaView/CollectionSchemaMovableTableHOC.tsx b/src/client/views/collections/schemaView/CollectionSchemaMovableTableHOC.tsx
new file mode 100644
index 000000000..149677976
--- /dev/null
+++ b/src/client/views/collections/schemaView/CollectionSchemaMovableTableHOC.tsx
@@ -0,0 +1,261 @@
+import React = require("react");
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action } from "mobx";
+import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
+import { Doc } from "../../../fields/Doc";
+import { SchemaHeaderField } from "../../../fields/SchemaHeaderField";
+import { Cast, FieldValue, StrCast } from "../../../fields/Types";
+import { DocumentManager } from "../../util/DocumentManager";
+import { DragManager, dropActionType, SetupDrag } from "../../util/DragManager";
+import { SnappingManager } from "../../util/SnappingManager";
+import { Transform } from "../../util/Transform";
+import { undoBatch } from "../../util/UndoManager";
+import { ContextMenu } from "../ContextMenu";
+import "./CollectionSchemaView.scss";
+
+export interface MovableColumnProps {
+    columnRenderer: TableCellRenderer;
+    columnValue: SchemaHeaderField;
+    allColumns: SchemaHeaderField[];
+    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columns: SchemaHeaderField[]) => void;
+    ScreenToLocalTransform: () => Transform;
+}
+export class MovableColumn extends React.Component<MovableColumnProps> {
+    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
+    private _colDropDisposer?: DragManager.DragDropDisposer;
+    private _startDragPosition: { x: number, y: number } = { x: 0, y: 0 };
+    private _sensitivity: number = 16;
+    private _dragRef: React.RefObject<HTMLDivElement> = React.createRef();
+
+    onPointerEnter = (e: React.PointerEvent): void => {
+        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
+            this._header!.current!.className = "collectionSchema-col-wrapper";
+            document.addEventListener("pointermove", this.onDragMove, true);
+        }
+    }
+    onPointerLeave = (e: React.PointerEvent): void => {
+        this._header!.current!.className = "collectionSchema-col-wrapper";
+        document.removeEventListener("pointermove", this.onDragMove, true);
+        !e.buttons && document.removeEventListener("pointermove", this.onPointerMove);
+    }
+    onDragMove = (e: PointerEvent): void => {
+        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
+        const before = x[0] < bounds[0];
+        this._header!.current!.className = "collectionSchema-col-wrapper";
+        if (before) this._header!.current!.className += " col-before";
+        if (!before) this._header!.current!.className += " col-after";
+        e.stopPropagation();
+    }
+
+    createColDropTarget = (ele: HTMLDivElement) => {
+        this._colDropDisposer?.();
+        if (ele) {
+            this._colDropDisposer = DragManager.MakeDropTarget(ele, this.colDrop.bind(this));
+        }
+    }
+
+    colDrop = (e: Event, de: DragManager.DropEvent) => {
+        document.removeEventListener("pointermove", this.onDragMove, true);
+        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
+        const before = x[0] < bounds[0];
+        const colDragData = de.complete.columnDragData;
+        if (colDragData) {
+            e.stopPropagation();
+            this.props.reorderColumns(colDragData.colKey, this.props.columnValue, before, this.props.allColumns);
+            return true;
+        }
+        return false;
+    }
+
+    onPointerMove = (e: PointerEvent) => {
+        const onRowMove = (e: PointerEvent) => {
+            e.stopPropagation();
+            e.preventDefault();
+
+            document.removeEventListener("pointermove", onRowMove);
+            document.removeEventListener('pointerup', onRowUp);
+            const dragData = new DragManager.ColumnDragData(this.props.columnValue);
+            DragManager.StartColumnDrag(this._dragRef.current!, dragData, e.x, e.y);
+        };
+        const onRowUp = (): void => {
+            document.removeEventListener("pointermove", onRowMove);
+            document.removeEventListener('pointerup', onRowUp);
+        };
+        if (e.buttons === 1) {
+            const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX - this._startDragPosition.x, e.clientY - this._startDragPosition.y);
+            if (Math.abs(dx) + Math.abs(dy) > this._sensitivity) {
+                document.removeEventListener("pointermove", this.onPointerMove);
+                e.stopPropagation();
+
+                document.addEventListener("pointermove", onRowMove);
+                document.addEventListener("pointerup", onRowUp);
+            }
+        }
+    }
+
+    onPointerUp = (e: React.PointerEvent) => {
+        document.removeEventListener("pointermove", this.onPointerMove);
+    }
+
+    @action
+    onPointerDown = (e: React.PointerEvent, ref: React.RefObject<HTMLDivElement>) => {
+        this._dragRef = ref;
+        const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX, e.clientY);
+        if (!(e.target as any)?.tagName.includes("INPUT")) {
+            this._startDragPosition = { x: dx, y: dy };
+            document.addEventListener("pointermove", this.onPointerMove);
+        }
+    }
+
+
+    render() {
+        const reference = React.createRef<HTMLDivElement>();
+
+        return (
+            <div className="collectionSchema-col" ref={this.createColDropTarget}>
+                <div className="collectionSchema-col-wrapper" ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
+                    <div className="col-dragger" ref={reference} onPointerDown={e => this.onPointerDown(e, reference)} onPointerUp={this.onPointerUp}>
+                        {this.props.columnRenderer}
+                    </div>
+                </div>
+            </div>
+        );
+    }
+}
+
+export interface MovableRowProps {
+    rowInfo: RowInfo;
+    ScreenToLocalTransform: () => Transform;
+    addDoc: (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => boolean;
+    removeDoc: (doc: Doc | Doc[]) => boolean;
+    rowFocused: boolean;
+    textWrapRow: (doc: Doc) => void;
+    rowWrapped: boolean;
+    dropAction: string;
+    addDocTab: any;
+}
+
+export class MovableRow extends React.Component<MovableRowProps> {
+    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
+    private _rowDropDisposer?: DragManager.DragDropDisposer;
+
+    // Event listeners are only necessary when the user is hovering over the table
+    // Create one when the mouse starts hovering...
+    onPointerEnter = (e: React.PointerEvent): void => {
+        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
+            this._header!.current!.className = "collectionSchema-row-wrapper";
+            document.addEventListener("pointermove", this.onDragMove, true);
+        }
+    }
+    // ... and delete it when the mouse leaves
+    onPointerLeave = (e: React.PointerEvent): void => {
+        this._header!.current!.className = "collectionSchema-row-wrapper";
+        document.removeEventListener("pointermove", this.onDragMove, true);
+    }
+    // The method for the event listener, reorders columns when dragged to their new locations.
+    onDragMove = (e: PointerEvent): void => {
+        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
+        const before = x[1] < bounds[1];
+        this._header!.current!.className = "collectionSchema-row-wrapper";
+        if (before) this._header!.current!.className += " row-above";
+        if (!before) this._header!.current!.className += " row-below";
+        e.stopPropagation();
+    }
+    componentWillUnmount() {
+
+        this._rowDropDisposer?.();
+    }
+    //
+    createRowDropTarget = (ele: HTMLDivElement) => {
+        this._rowDropDisposer?.();
+        if (ele) {
+            this._rowDropDisposer = DragManager.MakeDropTarget(ele, this.rowDrop.bind(this));
+        }
+    }
+    // Controls what hppens when a row is dragged and dropped
+    rowDrop = (e: Event, de: DragManager.DropEvent) => {
+        this.onPointerLeave(e as any);
+        const rowDoc = FieldValue(Cast(this.props.rowInfo.original, Doc));
+        if (!rowDoc) return false;
+
+        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
+        const before = x[1] < bounds[1];
+
+        const docDragData = de.complete.docDragData;
+        if (docDragData) {
+            e.stopPropagation();
+            if (docDragData.draggedDocuments[0] === rowDoc) return true;
+            const addDocument = (doc: Doc | Doc[]) => this.props.addDoc(doc, rowDoc, before);
+            const movedDocs = docDragData.draggedDocuments;
+            return (docDragData.dropAction || docDragData.userDropAction) ?
+                docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before) || added, false)
+                : (docDragData.moveDocument) ?
+                    movedDocs.reduce((added: boolean, d) => docDragData.moveDocument?.(d, rowDoc, addDocument) || added, false)
+                    : docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before), false);
+        }
+        return false;
+    }
+
+    onRowContextMenu = (e: React.MouseEvent): void => {
+        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
+        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
+    }
+
+    @undoBatch
+    @action
+    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
+        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
+        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
+    }
+
+    @action
+    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
+        console.log("yes");
+        if (e.key === "Backspace" || e.key === "Delete") {
+            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
+        }
+    }
+
+    render() {
+        const { children = null, rowInfo } = this.props;
+
+        if (!rowInfo) {
+            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
+        }
+
+        const { original } = rowInfo;
+        const doc = FieldValue(Cast(original, Doc));
+
+        if (!doc) return (null);
+
+        const reference = React.createRef<HTMLDivElement>();
+        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
+
+        let className = "collectionSchema-row";
+        if (this.props.rowFocused) className += " row-focused";
+        if (this.props.rowWrapped) className += " row-wrapped";
+
+        return (
+            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
+                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
+                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
+                        <div className="row-dragger">
+                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
+                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
+                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
+                        </div>
+                        {children}
+                    </ReactTableDefaults.TrComponent>
+                </div>
+            </div>
+        );
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaView.scss b/src/client/views/collections/schemaView/CollectionSchemaView.scss
new file mode 100644
index 000000000..b57fee0e4
--- /dev/null
+++ b/src/client/views/collections/schemaView/CollectionSchemaView.scss
@@ -0,0 +1,552 @@
+@import "../../globalCssVariables";
+.collectionSchemaView-container {
+    border-width: $COLLECTION_BORDER_WIDTH;
+    border-color: $intermediate-color;
+    border-style: solid;
+    border-radius: $border-radius;
+    box-sizing: border-box;
+    position: relative;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    margin-top: 0;
+    transition: top 0.5s;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: nowrap;
+    touch-action: none;
+    div {
+        touch-action: none;
+    }
+    .collectionSchemaView-tableContainer {
+        width: 100%;
+        height: 100%;
+    }
+    .collectionSchemaView-dividerDragger {
+        position: relative;
+        height: 100%;
+        width: $SCHEMA_DIVIDER_WIDTH;
+        z-index: 20;
+        right: 0;
+        top: 0;
+        background: gray;
+        cursor: col-resize;
+    }
+    // .documentView-node:first-child {
+    //     background: $light-color;
+    // }
+}
+
+.collectionSchemaView-searchContainer {
+    border-width: $COLLECTION_BORDER_WIDTH;
+    border-color: $intermediate-color;
+    border-style: solid;
+    border-radius: $border-radius;
+    box-sizing: border-box;
+    position: relative;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    margin-top: 0;
+    transition: top 0.5s;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: nowrap;
+    touch-action: none;
+    padding: 2px;
+    div {
+        touch-action: none;
+    }
+    .collectionSchemaView-tableContainer {
+        width: 100%;
+        height: 100%;
+    }
+    .collectionSchemaView-dividerDragger {
+        position: relative;
+        height: 100%;
+        width: 20px;
+        z-index: 20;
+        right: 0;
+        top: 0;
+        background: gray;
+        cursor: col-resize;
+    }
+    // .documentView-node:first-child {
+    //     background: $light-color;
+    // }
+}
+
+.ReactTable {
+    width: 100%;
+    background: white;
+    box-sizing: border-box;
+    border: none !important;
+    float: none !important;
+    .rt-table {
+        height: 100%;
+        display: -webkit-inline-box;
+        direction: ltr;
+        overflow: visible;
+    }
+    .rt-noData {
+        display: none;
+    }
+    .rt-thead {
+        width: 100%;
+        z-index: 100;
+        overflow-y: visible;
+        &.-header {
+            font-size: 12px;
+            height: 30px;
+            box-shadow: none;
+            z-index: 100;
+            overflow-y: visible;
+        }
+        .rt-resizable-header-content {
+            height: 100%;
+            overflow: visible;
+        }
+        .rt-th {
+            padding: 0;
+            border: solid lightgray;
+            border-width: 0 1px;
+            border-bottom: 2px solid lightgray;
+        }
+    }
+    .rt-th {
+        font-size: 13px;
+        text-align: center;
+        &:last-child {
+            overflow: visible;
+        }
+    }
+    .rt-tbody {
+        width: 100%;
+        direction: rtl;
+        overflow: visible;
+        .rt-td {
+            border-right: 1px solid rgba(0, 0, 0, 0.2);
+        }
+    }
+    .rt-tr-group {
+        direction: ltr;
+        flex: 0 1 auto;
+        min-height: 30px;
+        border: 0 !important;
+    }
+    .rt-tr {
+        width: 100%;
+        min-height: 30px;
+    }
+    .rt-td {
+        padding: 0;
+        font-size: 13px;
+        text-align: center;
+        white-space: nowrap;
+        display: flex;
+        align-items: center;
+        .imageBox-cont {
+            position: relative;
+            max-height: 100%;
+        }
+        .imageBox-cont img {
+            object-fit: contain;
+            max-width: 100%;
+            height: 100%;
+        }
+        .videoBox-cont {
+            object-fit: contain;
+            width: auto;
+            height: 100%;
+        }
+    }
+    .rt-td.rt-expandable {
+        display: flex;
+        align-items: center;
+        height: inherit;
+    }
+    .rt-resizer {
+        width: 8px;
+        right: -4px;
+    }
+    .rt-resizable-header {
+        padding: 0;
+        height: 30px;
+    }
+    .rt-resizable-header:last-child {
+        overflow: visible;
+        .rt-resizer {
+            width: 5px !important;
+        }
+    }
+}
+
+.documentView-node-topmost {
+    text-align: left;
+    transform-origin: center top;
+    display: inline-block;
+}
+
+.collectionSchema-col {
+    height: 100%;
+}
+
+.collectionSchema-header-menu {
+    height: auto;
+    z-index: 100;
+    position: absolute;
+    background: white;
+    padding: 5px;
+    position: fixed;
+    background: white;
+    border: black 1px solid;
+    .collectionSchema-header-toggler {
+        z-index: 100;
+        width: 100%;
+        height: 100%;
+        padding: 4px;
+        letter-spacing: 2px;
+        text-transform: uppercase;
+        svg {
+            margin-right: 4px;
+        }
+    }
+}
+
+.collectionSchemaView-header {
+    height: 100%;
+    color: gray;
+    z-index: 100;
+    overflow-y: visible;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+}
+
+button.add-column {
+    width: 28px;
+}
+
+.collectionSchema-header-menuOptions {
+    color: black;
+    width: 180px;
+    text-align: left;
+    .collectionSchema-headerMenu-group {
+        padding: 7px 0;
+        border-bottom: 1px solid lightgray;
+        cursor: pointer;
+        &:first-child {
+            padding-top: 0;
+        }
+        &:last-child {
+            border: none;
+            text-align: center;
+            padding: 12px 0 0 0;
+        }
+    }
+    label {
+        color: $main-accent;
+        font-weight: normal;
+        letter-spacing: 2px;
+        text-transform: uppercase;
+    }
+    input {
+        color: black;
+        width: 100%;
+    }
+    .columnMenu-option {
+        cursor: pointer;
+        padding: 3px;
+        background-color: white;
+        transition: background-color 0.2s;
+        &:hover {
+            background-color: $light-color-secondary;
+        }
+        &.active {
+            font-weight: bold;
+            border: 2px solid $light-color-secondary;
+        }
+        svg {
+            color: gray;
+            margin-right: 5px;
+            width: 10px;
+        }
+    }
+    .keys-dropdown {
+        position: relative;
+        //width: 100%;
+        background-color: white;
+        input {
+            border: 2px solid $light-color-secondary;
+            padding: 3px;
+            height: 28px;
+            font-weight: bold;
+            letter-spacing: "2px";
+            text-transform: "uppercase";
+            &:focus {
+                font-weight: normal;
+            }
+        }
+        .keys-options-wrapper {
+            width: 100%;
+            max-height: 150px;
+            overflow-y: scroll;
+            position: absolute;
+            top: 28px;
+            box-shadow: 0 10px 16px rgba(0, 0, 0, 0.1);
+            background-color: white;
+            .key-option {
+                background-color: white;
+                border: 1px solid lightgray;
+                padding: 2px 3px;
+                &:not(:first-child) {
+                    border-top: 0;
+                }
+                &:hover {
+                    background-color: $light-color-secondary;
+                }
+            }
+        }
+    }
+    .columnMenu-colors {
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        .columnMenu-colorPicker {
+            cursor: pointer;
+            width: 20px;
+            height: 20px;
+            border-radius: 10px;
+            &.active {
+                border: 2px solid white;
+                box-shadow: 0 0 0 2px lightgray;
+            }
+        }
+    }
+}
+
+.collectionSchema-row {
+    height: 100%;
+    background-color: white;
+    &.row-focused .rt-td {
+        background-color: #bfffc0; //$light-color-secondary;
+    }
+    &.row-wrapped {
+        .rt-td {
+            white-space: normal;
+        }
+    }
+    .row-dragger {
+        display: flex;
+        justify-content: space-around;
+        //flex: 50 0 auto;
+        width: 0;
+        max-width: 50px;
+        //height: 100%;
+        min-height: 30px;
+        align-items: center;
+        color: lightgray;
+        background-color: white;
+        transition: color 0.1s ease;
+        .row-option {
+            // padding: 5px;
+            cursor: pointer;
+            position: absolute;
+            transition: color 0.1s ease;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            z-index: 2;
+            &:hover {
+                color: gray;
+            }
+        }
+    }
+    .collectionSchema-row-wrapper {
+        &.row-above {
+            border-top: 1px solid red;
+        }
+        &.row-below {
+            border-bottom: 1px solid red;
+        }
+        &.row-inside {
+            border: 1px solid red;
+        }
+        .row-dragging {
+            background-color: blue;
+        }
+    }
+}
+
+.collectionSchemaView-cellContainer {
+    width: 100%;
+    height: unset;
+}
+
+.collectionSchemaView-cellWrapper {
+    height: 100%;
+    padding: 4px;
+    text-align: left;
+    padding-left: 19px;
+    position: relative;
+    &:focus {
+        outline: none;
+    }
+    &.editing {
+        padding: 0;
+        input {
+            outline: 0;
+            border: none;
+            background-color: rgb(255, 217, 217);
+            width: 100%;
+            height: 100%;
+            padding: 2px 3px;
+            min-height: 26px;
+        }
+    }
+    &.focused {
+        &.inactive {
+            border: none;
+        }
+    }
+    p {
+        width: 100%;
+        height: 100%;
+    }
+    &:hover .collectionSchemaView-cellContents-docExpander {
+        display: block;
+    }
+    .collectionSchemaView-cellContents-document {
+        display: inline-block;
+    }
+    .collectionSchemaView-cellContents-docButton {
+        float: right;
+        width: "15px";
+        height: "15px";
+    }
+    .collectionSchemaView-dropdownWrapper {
+        border: grey;
+        border-style: solid;
+        border-width: 1px;
+        height: 30px;
+        .collectionSchemaView-dropdownButton {
+            //display: inline-block;
+            float: left;
+            height: 100%;
+        }
+        .collectionSchemaView-dropdownText {
+            display: inline-block;
+            //float: right;
+            height: 100%;
+            display: "flex";
+            font-size: 13;
+            justify-content: "center";
+            align-items: "center";
+        }
+    }
+    .collectionSchemaView-dropdownContainer {
+        position: absolute;
+        border: 1px solid rgba(0, 0, 0, 0.04);
+        box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14);
+        .collectionSchemaView-dropdownOption:hover {
+            background-color: rgba(0, 0, 0, 0.14);
+            cursor: pointer;
+        }
+    }
+}
+
+.collectionSchemaView-cellContents-docExpander {
+    height: 30px;
+    width: 30px;
+    display: none;
+    position: absolute;
+    top: 0;
+    right: 0;
+    background-color: lightgray;
+}
+
+.doc-drag-over {
+    background-color: red;
+}
+
+.collectionSchemaView-toolbar {
+    z-index: 100;
+}
+
+.collectionSchemaView-toolbar {
+    height: 30px;
+    display: flex;
+    justify-content: flex-end;
+    padding: 0 10px;
+    border-bottom: 2px solid gray;
+    .collectionSchemaView-toolbar-item {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+    }
+}
+
+#preview-schema-checkbox-div {
+    margin-left: 20px;
+    font-size: 12px;
+}
+
+.collectionSchemaView-table {
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    padding: 3px;
+}
+
+.rt-td.rt-expandable {
+    overflow: visible;
+    position: relative;
+    height: 100%;
+    z-index: 1;
+}
+
+.reactTable-sub {
+    background-color: rgb(252, 252, 252);
+    width: 100%;
+    .rt-thead {
+        display: none;
+    }
+    .row-dragger {
+        background-color: rgb(252, 252, 252);
+    }
+    .rt-table {
+        background-color: rgb(252, 252, 252);
+    }
+    .collectionSchemaView-table {
+        width: 100%;
+        border: solid 1px;
+        overflow: visible;
+        padding: 0px;
+    }
+}
+
+.collectionSchemaView-expander {
+    height: 100%;
+    min-height: 30px;
+    position: absolute;
+    color: gray;
+    width: 20;
+    height: auto;
+    left: 55;
+    svg {
+        position: absolute;
+        top: 50%;
+        left: 10;
+        transform: translate(-50%, -50%);
+    }
+}
+
+.collectionSchemaView-addRow {
+    color: gray;
+    letter-spacing: 2px;
+    text-transform: uppercase;
+    cursor: pointer;
+    font-size: 10.5px;
+    margin-left: 50px;
+    margin-top: 10px;
+}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaView.tsx b/src/client/views/collections/schemaView/CollectionSchemaView.tsx
new file mode 100644
index 000000000..b33c437a9
--- /dev/null
+++ b/src/client/views/collections/schemaView/CollectionSchemaView.tsx
@@ -0,0 +1,575 @@
+import React = require("react");
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { action, computed, observable, untracked } from "mobx";
+import { observer } from "mobx-react";
+import Measure from "react-measure";
+import { Resize } from "react-table";
+import "react-table/react-table.css";
+import { Doc, Opt } from "../../../fields/Doc";
+import { List } from "../../../fields/List";
+import { listSpec } from "../../../fields/Schema";
+import { PastelSchemaPalette, SchemaHeaderField } from "../../../fields/SchemaHeaderField";
+import { Cast, NumCast } from "../../../fields/Types";
+import { TraceMobx } from "../../../fields/util";
+import { emptyFunction, emptyPath, returnFalse, setupMoveUpEvents, returnEmptyDoclist, returnTrue } from "../../../Utils";
+import { SelectionManager } from "../../util/SelectionManager";
+import { SnappingManager } from "../../util/SnappingManager";
+import { Transform } from "../../util/Transform";
+import { undoBatch } from "../../util/UndoManager";
+import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../views/globalCssVariables.scss';
+import { ContextMenu } from "../ContextMenu";
+import { ContextMenuProps } from "../ContextMenuItem";
+import '../DocumentDecorations.scss';
+import { DocumentView } from "../nodes/DocumentView";
+import { DefaultStyleProvider } from "../StyleProvider";
+import "./CollectionSchemaView.scss";
+import { CollectionSubView } from "./CollectionSubView";
+import { SchemaTable } from "./SchemaTable";
+import { DocUtils } from "../../documents/Documents";
+// bcz: need to add drag and drop of rows and columns.  This seems like it might work for rows: https://codesandbox.io/s/l94mn1q657
+
+export enum ColumnType {
+    Any,
+    Number,
+    String,
+    Boolean,
+    Doc,
+    Image,
+    List,
+    Date
+}
+// this map should be used for keys that should have a const type of value
+const columnTypes: Map<string, ColumnType> = new Map([
+    ["title", ColumnType.String],
+    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
+    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
+    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
+]);
+
+@observer
+export class CollectionSchemaView extends CollectionSubView(doc => doc) {
+    private _previewCont?: HTMLDivElement;
+
+    @observable _previewDoc: Doc | undefined = undefined;
+    @observable _focusedTable: Doc = this.props.Document;
+    @observable _col: any = "";
+    @observable _menuWidth = 0;
+    @observable _headerOpen = false;
+    @observable _headerIsEditing = false;
+    @observable _menuHeight = 0;
+    @observable _pointerX = 0;
+    @observable _pointerY = 0;
+    @observable _openTypes: boolean = false;
+
+    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
+    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
+    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
+    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
+    @computed get scale() { return this.props.ScreenToLocalTransform().Scale; }
+    @computed get columns() { return Cast(this.props.Document._schemaHeaders, listSpec(SchemaHeaderField), []); }
+    set columns(columns: SchemaHeaderField[]) { this.props.Document._schemaHeaders = new List<SchemaHeaderField>(columns); }
+
+    @computed get menuCoordinates() {
+        let searchx = 0;
+        let searchy = 0;
+        if (this.props.Document._searchDoc) {
+            const el = document.getElementsByClassName("collectionSchemaView-searchContainer")[0];
+            if (el !== undefined) {
+                const rect = el.getBoundingClientRect();
+                searchx = rect.x;
+                searchy = rect.y;
+            }
+        }
+        const x = Math.max(0, Math.min(document.body.clientWidth - this._menuWidth, this._pointerX)) - searchx;
+        const y = Math.max(0, Math.min(document.body.clientHeight - this._menuHeight, this._pointerY)) - searchy;
+        return this.props.ScreenToLocalTransform().transformPoint(x, y);
+    }
+
+    get documentKeys() {
+        const docs = this.childDocs;
+        const keys: { [key: string]: boolean } = {};
+        // bcz: ugh.  this is untracked since otherwise a large collection of documents will blast the server for all their fields.
+        //  then as each document's fields come back, we update the documents _proxies.  Each time we do this, the whole schema will be
+        //  invalidated and re-rendered.   This workaround will inquire all of the document fields before the options button is clicked.
+        //  then by the time the options button is clicked, all of the fields should be in place.  If a new field is added while this menu
+        //  is displayed (unlikely) it won't show up until something else changes.
+        //TODO Types
+        untracked(() => docs.map(doc => Doc.GetAllPrototypes(doc).map(proto => Object.keys(proto).forEach(key => keys[key] = false))));
+
+        this.columns.forEach(key => keys[key.heading] = true);
+        return Array.from(Object.keys(keys));
+    }
+
+    @action setHeaderIsEditing = (isEditing: boolean) => this._headerIsEditing = isEditing;
+
+    @undoBatch
+    setColumnType = action((columnField: SchemaHeaderField, type: ColumnType): void => {
+        this._openTypes = false;
+        if (columnTypes.get(columnField.heading)) return;
+
+        const columns = this.columns;
+        const index = columns.indexOf(columnField);
+        if (index > -1) {
+            columnField.setType(NumCast(type));
+            columns[index] = columnField;
+            this.columns = columns;
+        }
+    });
+
+    @undoBatch
+    setColumnColor = (columnField: SchemaHeaderField, color: string): void => {
+        const columns = this.columns;
+        const index = columns.indexOf(columnField);
+        if (index > -1) {
+            columnField.setColor(color);
+            columns[index] = columnField;
+            this.columns = columns; // need to set the columns to trigger rerender
+        }
+    }
+
+    @undoBatch
+    @action
+    setColumnSort = (columnField: SchemaHeaderField, descending: boolean | undefined) => {
+        const columns = this.columns;
+        columns.forEach(col => col.setDesc(undefined));
+
+        const index = columns.findIndex(c => c.heading === columnField.heading);
+        const column = columns[index];
+        column.setDesc(descending);
+        columns[index] = column;
+        this.columns = columns;
+    }
+
+    renderTypes = (col: any) => {
+        if (columnTypes.get(col.heading)) return (null);
+
+        const type = col.type;
+
+        const anyType = <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Any)}>
+            <FontAwesomeIcon icon={"align-justify"} size="sm" />
+                Any
+            </div>;
+
+        const numType = <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Number)}>
+            <FontAwesomeIcon icon={"hashtag"} size="sm" />
+                Number
+            </div>;
+
+        const textType = <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.String)}>
+            <FontAwesomeIcon icon={"font"} size="sm" />
+            Text
+            </div>;
+
+        const boolType = <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Boolean)}>
+            <FontAwesomeIcon icon={"check-square"} size="sm" />
+            Checkbox
+            </div>;
+
+        const listType = <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.List)}>
+            <FontAwesomeIcon icon={"list-ul"} size="sm" />
+            List
+            </div>;
+
+        const docType = <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Doc)}>
+            <FontAwesomeIcon icon={"file"} size="sm" />
+            Document
+            </div>;
+
+        const imageType = <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Image)}>
+            <FontAwesomeIcon icon={"image"} size="sm" />
+            Image
+            </div>;
+
+        const dateType = <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Date)}>
+            <FontAwesomeIcon icon={"calendar"} size="sm" />
+                Date
+                </div>;
+
+
+        const allColumnTypes = <div className="columnMenu-types">
+            {anyType}
+            {numType}
+            {textType}
+            {boolType}
+            {listType}
+            {docType}
+            {imageType}
+            {dateType}
+        </div>;
+
+        const justColType = type === ColumnType.Any ? anyType : type === ColumnType.Number ? numType :
+            type === ColumnType.String ? textType : type === ColumnType.Boolean ? boolType :
+                type === ColumnType.List ? listType : type === ColumnType.Doc ? docType :
+                    type === ColumnType.Date ? dateType : imageType;
+
+        return (
+            <div className="collectionSchema-headerMenu-group" onClick={action(() => this._openTypes = !this._openTypes)}>
+                <div>
+                    <label style={{ cursor: "pointer" }}>Column type:</label>
+                    <FontAwesomeIcon icon={"caret-down"} size="lg" style={{ float: "right", transform: `rotate(${this._openTypes ? "180deg" : 0})`, transition: "0.2s all ease" }} />
+                </div>
+                {this._openTypes ? allColumnTypes : justColType}
+            </div >
+        );
+    }
+
+    renderSorting = (col: any) => {
+        const sort = col.desc;
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Sort by:</label>
+                <div className="columnMenu-sort">
+                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.setColumnSort(col, true)}>
+                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
+                        Sort descending
+                    </div>
+                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.setColumnSort(col, false)}>
+                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
+                        Sort ascending
+                    </div>
+                    <div className="columnMenu-option" onClick={() => this.setColumnSort(col, undefined)}>
+                        <FontAwesomeIcon icon="times" size="sm" />
+                        Clear sorting
+                    </div>
+                </div>
+            </div>
+        );
+    }
+
+    renderColors = (col: any) => {
+        const selected = col.color;
+
+        const pink = PastelSchemaPalette.get("pink2");
+        const purple = PastelSchemaPalette.get("purple2");
+        const blue = PastelSchemaPalette.get("bluegreen1");
+        const yellow = PastelSchemaPalette.get("yellow4");
+        const red = PastelSchemaPalette.get("red2");
+        const gray = "#f1efeb";
+
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Color:</label>
+                <div className="columnMenu-colors">
+                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.setColumnColor(col, pink!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.setColumnColor(col, purple!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.setColumnColor(col, blue!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.setColumnColor(col, yellow!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.setColumnColor(col, red!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.setColumnColor(col, gray)}></div>
+                </div>
+            </div>
+        );
+    }
+
+    @undoBatch
+    @action
+    changeColumns = (oldKey: string, newKey: string, addNew: boolean, filter?: string) => {
+        const columns = this.columns;
+        if (columns === undefined) {
+            this.columns = new List<SchemaHeaderField>([new SchemaHeaderField(newKey, "f1efeb")]);
+        } else {
+            if (addNew) {
+                columns.push(new SchemaHeaderField(newKey, "f1efeb"));
+                this.columns = columns;
+            } else {
+                const index = columns.map(c => c.heading).indexOf(oldKey);
+                if (index > -1) {
+                    const column = columns[index];
+                    column.setHeading(newKey);
+                    columns[index] = column;
+                    this.columns = columns;
+                    if (filter) {
+                        Doc.setDocFilter(this.props.Document, newKey, filter, "match");
+                    }
+                    else {
+                        this.props.Document._docFilters = undefined;
+                    }
+                }
+            }
+        }
+    }
+
+    @action
+    openHeader = (col: any, screenx: number, screeny: number) => {
+        this._col = col;
+        this._headerOpen = true;
+        this._pointerX = screenx;
+        this._pointerY = screeny;
+    }
+
+    @action
+    closeHeader = () => { this._headerOpen = false; }
+
+    @undoBatch
+    @action
+    deleteColumn = (key: string) => {
+        const columns = this.columns;
+        if (columns === undefined) {
+            this.columns = new List<SchemaHeaderField>([]);
+        } else {
+            const index = columns.map(c => c.heading).indexOf(key);
+            if (index > -1) {
+                columns.splice(index, 1);
+                this.columns = columns;
+            }
+        }
+        this.closeHeader();
+    }
+
+    getPreviewTransform = (): Transform => {
+        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - NumCast(COLLECTION_BORDER_WIDTH) - this.tableWidth, - this.borderWidth);
+    }
+
+    @action
+    onHeaderClick = (e: React.PointerEvent) => {
+        e.stopPropagation();
+    }
+
+    @action
+    onWheel(e: React.WheelEvent) {
+        const scale = this.props.ScreenToLocalTransform().Scale;
+        this.props.isContentActive(true) && e.stopPropagation();
+    }
+
+    @computed get renderMenuContent() {
+        TraceMobx();
+        return <div className="collectionSchema-header-menuOptions">
+            {this.renderTypes(this._col)}
+            {this.renderColors(this._col)}
+            <div className="collectionSchema-headerMenu-group">
+                <button onClick={() => { this.deleteColumn(this._col.heading); }}
+                >Delete Column</button>
+            </div>
+        </div>;
+    }
+
+    private createTarget = (ele: HTMLDivElement) => {
+        this._previewCont = ele;
+        super.CreateDropTarget(ele);
+    }
+
+    isFocused = (doc: Doc, outsideReaction: boolean): boolean => this.props.isSelected(outsideReaction) && doc === this._focusedTable;
+
+    @action setFocused = (doc: Doc) => this._focusedTable = doc;
+
+    @action setPreviewDoc = (doc: Opt<Doc>) => {
+        SelectionManager.SelectSchemaView(this, doc);
+        this._previewDoc = doc;
+    }
+
+    //toggles preview side-panel of schema
+    @action
+    toggleExpander = () => {
+        this.props.Document.schemaPreviewWidth = this.previewWidth() === 0 ? Math.min(this.tableWidth / 3, 200) : 0;
+    }
+
+    onDividerDown = (e: React.PointerEvent) => {
+        setupMoveUpEvents(this, e, this.onDividerMove, emptyFunction, this.toggleExpander);
+    }
+    @action
+    onDividerMove = (e: PointerEvent, down: number[], delta: number[]) => {
+        const nativeWidth = this._previewCont!.getBoundingClientRect();
+        const minWidth = 40;
+        const maxWidth = 1000;
+        const movedWidth = this.props.ScreenToLocalTransform().transformDirection(nativeWidth.right - e.clientX, 0)[0];
+        const width = movedWidth < minWidth ? minWidth : movedWidth > maxWidth ? maxWidth : movedWidth;
+        this.props.Document.schemaPreviewWidth = width;
+        return false;
+    }
+
+    onPointerDown = (e: React.PointerEvent): void => {
+        if (e.button === 0 && !e.altKey && !e.ctrlKey && !e.metaKey) {
+            if (this.props.isSelected(true)) e.stopPropagation();
+            else this.props.select(false);
+        }
+    }
+
+    @computed
+    get previewDocument(): Doc | undefined { return this._previewDoc; }
+
+    @computed
+    get dividerDragger() {
+        return this.previewWidth() === 0 ? (null) :
+            <div className="collectionSchemaView-dividerDragger" onPointerDown={this.onDividerDown} >
+                <div className="collectionSchemaView-dividerDragger" />
+            </div>;
+    }
+
+    @computed
+    get previewPanel() {
+        return <div ref={this.createTarget} style={{ width: `${this.previewWidth()}px` }}>
+            {!this.previewDocument ? (null) :
+                <DocumentView
+                    Document={this.previewDocument}
+                    DataDoc={undefined}
+                    fitContentsToDoc={returnTrue}
+                    freezeDimensions={true}
+                    dontCenter={"y"}
+                    focus={DocUtils.DefaultFocus}
+                    renderDepth={this.props.renderDepth}
+                    rootSelected={this.rootSelected}
+                    PanelWidth={this.previewWidth}
+                    PanelHeight={this.previewHeight}
+                    isContentActive={returnTrue}
+                    isDocumentActive={returnFalse}
+                    ScreenToLocalTransform={this.getPreviewTransform}
+                    docFilters={this.docFilters}
+                    docRangeFilters={this.docRangeFilters}
+                    searchFilterDocs={this.searchFilterDocs}
+                    styleProvider={DefaultStyleProvider}
+                    layerProvider={undefined}
+                    docViewPath={returnEmptyDoclist}
+                    ContainingCollectionDoc={this.props.CollectionView?.props.Document}
+                    ContainingCollectionView={this.props.CollectionView}
+                    moveDocument={this.props.moveDocument}
+                    addDocument={this.props.addDocument}
+                    removeDocument={this.props.removeDocument}
+                    whenChildContentsActiveChanged={this.props.whenChildContentsActiveChanged}
+                    addDocTab={this.props.addDocTab}
+                    pinToPres={this.props.pinToPres}
+                    bringToFront={returnFalse}
+                />}
+        </div>;
+    }
+
+    @computed
+    get schemaTable() {
+        return <SchemaTable
+            Document={this.props.Document}
+            PanelHeight={this.props.PanelHeight}
+            PanelWidth={this.props.PanelWidth}
+            childDocs={this.childDocs}
+            CollectionView={this.props.CollectionView}
+            ContainingCollectionView={this.props.ContainingCollectionView}
+            ContainingCollectionDoc={this.props.ContainingCollectionDoc}
+            fieldKey={this.props.fieldKey}
+            renderDepth={this.props.renderDepth}
+            moveDocument={this.props.moveDocument}
+            ScreenToLocalTransform={this.props.ScreenToLocalTransform}
+            active={this.props.isContentActive}
+            onDrop={this.onExternalDrop}
+            addDocTab={this.props.addDocTab}
+            pinToPres={this.props.pinToPres}
+            isSelected={this.props.isSelected}
+            isFocused={this.isFocused}
+            setFocused={this.setFocused}
+            setPreviewDoc={this.setPreviewDoc}
+            deleteDocument={this.props.removeDocument}
+            addDocument={this.props.addDocument}
+            dataDoc={this.props.DataDoc}
+            columns={this.columns}
+            documentKeys={this.documentKeys}
+            headerIsEditing={this._headerIsEditing}
+            openHeader={this.openHeader}
+            onClick={this.onTableClick}
+            onPointerDown={emptyFunction}
+            onResizedChange={this.onResizedChange}
+            setColumns={this.setColumns}
+            reorderColumns={this.reorderColumns}
+            changeColumns={this.changeColumns}
+            setHeaderIsEditing={this.setHeaderIsEditing}
+            changeColumnSort={this.setColumnSort}
+        />;
+    }
+
+    @computed
+    public get schemaToolbar() {
+        return <div className="collectionSchemaView-toolbar">
+            <div className="collectionSchemaView-toolbar-item">
+                <div id="preview-schema-checkbox-div">
+                    <input type="checkbox" key={"Show Preview"} checked={this.previewWidth() !== 0} onChange={this.toggleExpander} />
+                    Show Preview
+                </div>
+            </div>
+        </div>;
+    }
+
+    onSpecificMenu = (e: React.MouseEvent) => {
+        if ((e.target as any)?.className?.includes?.("collectionSchemaView-cell") || (e.target instanceof HTMLSpanElement)) {
+            const cm = ContextMenu.Instance;
+            const options = cm.findByDescription("Options...");
+            const optionItems: ContextMenuProps[] = options && "subitems" in options ? options.subitems : [];
+            optionItems.push({ description: "remove", event: () => this._previewDoc && this.props.removeDocument?.(this._previewDoc), icon: "trash" });
+            !options && cm.addItem({ description: "Options...", subitems: optionItems, icon: "compass" });
+            cm.displayMenu(e.clientX, e.clientY);
+            (e.nativeEvent as any).SchemaHandled = true; // not sure why this is needed, but if you right-click quickly on a cell, the Document/Collection contextMenu handlers still fire without this.
+            e.stopPropagation();
+        }
+    }
+
+    @action
+    onTableClick = (e: React.MouseEvent): void => {
+        if (!(e.target as any)?.className?.includes?.("collectionSchemaView-cell") && !(e.target instanceof HTMLSpanElement)) {
+            this.setPreviewDoc(undefined);
+        } else {
+            e.stopPropagation();
+        }
+        this.setFocused(this.props.Document);
+        this.closeHeader();
+    }
+
+    onResizedChange = (newResized: Resize[], event: any) => {
+        const columns = this.columns;
+        newResized.forEach(resized => {
+            const index = columns.findIndex(c => c.heading === resized.id);
+            const column = columns[index];
+            column.setWidth(resized.value);
+            columns[index] = column;
+        });
+        this.columns = columns;
+    }
+
+    @action
+    setColumns = (columns: SchemaHeaderField[]) => this.columns = columns
+
+    @undoBatch
+    reorderColumns = (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => {
+        const columns = [...columnsValues];
+        const oldIndex = columns.indexOf(toMove);
+        const relIndex = columns.indexOf(relativeTo);
+        const newIndex = (oldIndex > relIndex && !before) ? relIndex + 1 : (oldIndex < relIndex && before) ? relIndex - 1 : relIndex;
+
+        if (oldIndex === newIndex) return;
+
+        columns.splice(newIndex, 0, columns.splice(oldIndex, 1)[0]);
+        this.columns = columns;
+    }
+
+    onZoomMenu = (e: React.WheelEvent) => this.props.isContentActive(true) && e.stopPropagation();
+
+    render() {
+        TraceMobx();
+        if (!this.props.isContentActive()) setTimeout(() => this.closeHeader(), 0);
+        const menuContent = this.renderMenuContent;
+        const menu = <div className="collectionSchema-header-menu"
+            onWheel={e => this.onZoomMenu(e)}
+            onPointerDown={e => this.onHeaderClick(e)}
+            style={{ transform: `translate(${(this.menuCoordinates[0])}px, ${(this.menuCoordinates[1])}px)` }}>
+            <Measure offset onResize={action((r: any) => {
+                const dim = this.props.ScreenToLocalTransform().inverse().transformDirection(r.offset.width, r.offset.height);
+                this._menuWidth = dim[0]; this._menuHeight = dim[1];
+            })}>
+                {({ measureRef }) => <div ref={measureRef}> {menuContent} </div>}
+            </Measure>
+        </div>;
+        return <div className={"collectionSchemaView" + (this.props.Document._searchDoc ? "-searchContainer" : "-container")}
+            style={{
+                overflow: this.props.scrollOverflow === true ? "scroll" : undefined, backgroundColor: "white",
+                pointerEvents: this.props.Document._searchDoc !== undefined && !this.props.isContentActive() && !SnappingManager.GetIsDragging() ? "none" : undefined,
+                width: name === "collectionSchemaView-searchContainer" ? "auto" : this.props.PanelWidth() || "100%", height: this.props.PanelHeight() || "100%", position: "relative",
+            }}  >
+            <div className="collectionSchemaView-tableContainer"
+                style={{ width: `calc(100% - ${this.previewWidth()}px)` }}
+                onContextMenu={this.onSpecificMenu}
+                onPointerDown={this.onPointerDown}
+                onWheel={e => this.props.isContentActive(true) && e.stopPropagation()}
+                onDrop={e => this.onExternalDrop(e, {})}
+                ref={this.createTarget}>
+                {this.schemaTable}
+            </div>
+            {this.dividerDragger}
+            {!this.previewWidth() ? (null) : this.previewPanel}
+            {this._headerOpen && this.props.isContentActive() ? menu : null}
+        </div>;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/SchemaTable.tsx b/src/client/views/collections/schemaView/SchemaTable.tsx
new file mode 100644
index 000000000..c305f6806
--- /dev/null
+++ b/src/client/views/collections/schemaView/SchemaTable.tsx
@@ -0,0 +1,599 @@
+import React = require("react");
+import { IconProp } from '@fortawesome/fontawesome-svg-core';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { action, computed, observable } from "mobx";
+import { observer } from "mobx-react";
+import ReactTable, { CellInfo, Column, ComponentPropsGetterR, Resize, SortingRule } from "react-table";
+import "react-table/react-table.css";
+import { DateField } from "../../../../fields/DateField";
+import { AclPrivate, AclReadonly, DataSym, Doc, DocListCast, Field, Opt } from "../../../../fields/Doc";
+import { Id } from "../../../../fields/FieldSymbols";
+import { List } from "../../../../fields/List";
+import { listSpec } from "../../../../fields/Schema";
+import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { ComputedField } from "../../../../fields/ScriptField";
+import { Cast, FieldValue, NumCast, StrCast } from "../../../../fields/Types";
+import { ImageField } from "../../../../fields/URLField";
+import { GetEffectiveAcl } from "../../../../fields/util";
+import { emptyFunction, emptyPath, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue } from "../../../../Utils";
+import { Docs, DocumentOptions, DocUtils } from "../../../documents/Documents";
+import { DocumentType } from "../../../documents/DocumentTypes";
+import { CompileScript, Transformer, ts } from "../../../util/Scripting";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../globalCssVariables.scss';
+import { ContextMenu } from "../../ContextMenu";
+import '../DocumentDecorations.scss';
+import { DocumentView } from "../../nodes/DocumentView";
+import { DefaultStyleProvider } from "../../StyleProvider";
+import { CellProps, CollectionSchemaButtons, CollectionSchemaCell, CollectionSchemaCheckboxCell, CollectionSchemaDateCell, CollectionSchemaDocCell, CollectionSchemaImageCell, CollectionSchemaListCell, CollectionSchemaNumberCell, CollectionSchemaStringCell } from "./CollectionSchemaCells";
+import { CollectionSchemaAddColumnHeader, KeysDropdown } from "./CollectionSchemaHeaders";
+import { MovableColumn, MovableRow } from "./CollectionSchemaMovableTableHOC";
+import "./CollectionSchemaView.scss";
+import { CollectionView } from "../CollectionView";
+
+
+enum ColumnType {
+    Any,
+    Number,
+    String,
+    Boolean,
+    Doc,
+    Image,
+    List,
+    Date
+}
+
+// this map should be used for keys that should have a const type of value
+const columnTypes: Map<string, ColumnType> = new Map([
+    ["title", ColumnType.String],
+    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
+    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
+    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
+]);
+
+export interface SchemaTableProps {
+    Document: Doc; // child doc
+    dataDoc?: Doc;
+    PanelHeight: () => number;
+    PanelWidth: () => number;
+    childDocs?: Doc[];
+    CollectionView: Opt<CollectionView>;
+    ContainingCollectionView: Opt<CollectionView>;
+    ContainingCollectionDoc: Opt<Doc>;
+    fieldKey: string;
+    renderDepth: number;
+    deleteDocument?: (document: Doc | Doc[]) => boolean;
+    addDocument?: (document: Doc | Doc[]) => boolean;
+    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (document: Doc | Doc[]) => boolean) => boolean;
+    ScreenToLocalTransform: () => Transform;
+    active: (outsideReaction: boolean | undefined) => boolean;
+    onDrop: (e: React.DragEvent<Element>, options: DocumentOptions, completed?: (() => void) | undefined) => void;
+    addDocTab: (document: Doc, where: string) => boolean;
+    pinToPres: (document: Doc) => void;
+    isSelected: (outsideReaction?: boolean) => boolean;
+    isFocused: (document: Doc, outsideReaction: boolean) => boolean;
+    setFocused: (document: Doc) => void;
+    setPreviewDoc: (document: Opt<Doc>) => void;
+    columns: SchemaHeaderField[];
+    documentKeys: any[];
+    headerIsEditing: boolean;
+    openHeader: (column: any, screenx: number, screeny: number) => void;
+    onClick: (e: React.MouseEvent) => void;
+    onPointerDown: (e: React.PointerEvent) => void;
+    onResizedChange: (newResized: Resize[], event: any) => void;
+    setColumns: (columns: SchemaHeaderField[]) => void;
+    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => void;
+    changeColumns: (oldKey: string, newKey: string, addNew: boolean) => void;
+    setHeaderIsEditing: (isEditing: boolean) => void;
+    changeColumnSort: (columnField: SchemaHeaderField, descending: boolean | undefined) => void;
+}
+
+@observer
+export class SchemaTable extends React.Component<SchemaTableProps> {
+    @observable _cellIsEditing: boolean = false;
+    @observable _focusedCell: { row: number, col: number } = { row: 0, col: 0 };
+    @observable _openCollections: Set<number> = new Set;
+
+    @observable _showDoc: Doc | undefined;
+    @observable _showDataDoc: any = "";
+    @observable _showDocPos: number[] = [];
+
+    @observable _showTitleDropdown: boolean = false;
+
+    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
+    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
+    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
+
+    @computed get childDocs() {
+        if (this.props.childDocs) return this.props.childDocs;
+
+        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
+        return DocListCast(doc[this.props.fieldKey]);
+    }
+    set childDocs(docs: Doc[]) {
+        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
+        doc[this.props.fieldKey] = new List<Doc>(docs);
+    }
+
+    @computed get textWrappedRows() {
+        return Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
+    }
+    set textWrappedRows(textWrappedRows: string[]) {
+        this.props.Document.textwrappedSchemaRows = new List<string>(textWrappedRows);
+    }
+
+    @computed get resized(): { id: string, value: number }[] {
+        return this.props.columns.reduce((resized, shf) => {
+            (shf.width > -1) && resized.push({ id: shf.heading, value: shf.width });
+            return resized;
+        }, [] as { id: string, value: number }[]);
+    }
+    @computed get sorted(): SortingRule[] {
+        return this.props.columns.reduce((sorted, shf) => {
+            shf.desc !== undefined && sorted.push({ id: shf.heading, desc: shf.desc });
+            return sorted;
+        }, [] as SortingRule[]);
+    }
+
+    @action
+    changeSorting = (col: any) => {
+        this.props.changeColumnSort(col, col.desc === true ? false : col.desc === false ? undefined : true);
+    }
+
+    @action
+    changeTitleMode = () => this._showTitleDropdown = !this._showTitleDropdown
+
+    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
+    @computed get tableColumns(): Column<Doc>[] {
+        const possibleKeys = this.props.documentKeys.filter(key => this.props.columns.findIndex(existingKey => existingKey.heading.toUpperCase() === key.toUpperCase()) === -1);
+        const columns: Column<Doc>[] = [];
+        const tableIsFocused = this.props.isFocused(this.props.Document, false);
+        const focusedRow = this._focusedCell.row;
+        const focusedCol = this._focusedCell.col;
+        const isEditable = !this.props.headerIsEditing;
+
+        columns.push({
+            expander: true, Header: "", width: 58,
+            Expander: (rowInfo) => {
+                return rowInfo.original.type !== DocumentType.COL ? (null) :
+                    <div className="collectionSchemaView-expander" onClick={action(() => (this._openCollections[rowInfo.isExpanded ? "delete" : "add"])(rowInfo.viewIndex))}>
+                        <FontAwesomeIcon icon={rowInfo.isExpanded ? "caret-down" : "caret-right"} size="lg" />
+                    </div>;
+            }
+        });
+        columns.push(...this.props.columns.map(col => {
+            const icon: IconProp = this.getColumnType(col) === ColumnType.Number ? "hashtag" : this.getColumnType(col) === ColumnType.String ? "font" :
+                this.getColumnType(col) === ColumnType.Boolean ? "check-square" : this.getColumnType(col) === ColumnType.Doc ? "file" :
+                    this.getColumnType(col) === ColumnType.Image ? "image" : this.getColumnType(col) === ColumnType.List ? "list-ul" :
+                        this.getColumnType(col) === ColumnType.Date ? "calendar" : "align-justify";
+
+            const keysDropdown = <KeysDropdown
+                keyValue={col.heading}
+                possibleKeys={possibleKeys}
+                existingKeys={this.props.columns.map(c => c.heading)}
+                canAddNew={true}
+                addNew={false}
+                onSelect={this.props.changeColumns}
+                setIsEditing={this.props.setHeaderIsEditing}
+                docs={this.props.childDocs}
+                Document={this.props.Document}
+                dataDoc={this.props.dataDoc}
+                fieldKey={this.props.fieldKey}
+                ContainingCollectionDoc={this.props.ContainingCollectionDoc}
+                ContainingCollectionView={this.props.ContainingCollectionView}
+                active={this.props.active}
+                openHeader={this.props.openHeader}
+                icon={icon}
+                col={col}
+                // try commenting this out
+                width={"100%"}
+            />;
+
+            const sortIcon = col.desc === undefined ? "caret-right" : col.desc === true ? "caret-down" : "caret-up";
+            const header = <div className="collectionSchemaView-menuOptions-wrapper" style={{ background: col.color, padding: "2px", display: "flex", cursor: "default", height: "100%", }}>
+                {keysDropdown}
+                <div onClick={e => this.changeSorting(col)} style={{ width: 21, padding: 1, display: "inline", zIndex: 1, background: "inherit", cursor: "hand" }}>
+                    <FontAwesomeIcon icon={sortIcon} size="lg" />
+                </div>
+            </div>;
+
+            return {
+                Header: <MovableColumn columnRenderer={header} columnValue={col} allColumns={this.props.columns} reorderColumns={this.props.reorderColumns} ScreenToLocalTransform={this.props.ScreenToLocalTransform} />,
+                accessor: (doc: Doc) => doc ? Field.toString(doc[col.heading] as Field) : 0,
+                id: col.heading,
+                Cell: (rowProps: CellInfo) => {
+                    const rowIndex = rowProps.index;
+                    const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
+                    const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
+
+                    const props: CellProps = {
+                        row: rowIndex,
+                        col: columnIndex,
+                        rowProps: rowProps,
+                        isFocused: isFocused,
+                        changeFocusedCellByIndex: this.changeFocusedCellByIndex,
+                        CollectionView: this.props.CollectionView,
+                        ContainingCollection: this.props.ContainingCollectionView,
+                        Document: this.props.Document,
+                        fieldKey: this.props.fieldKey,
+                        renderDepth: this.props.renderDepth,
+                        addDocTab: this.props.addDocTab,
+                        pinToPres: this.props.pinToPres,
+                        moveDocument: this.props.moveDocument,
+                        setIsEditing: this.setCellIsEditing,
+                        isEditable: isEditable,
+                        setPreviewDoc: this.props.setPreviewDoc,
+                        setComputed: this.setComputed,
+                        getField: this.getField,
+                        showDoc: this.showDoc,
+                    };
+
+
+                    switch (this.getColumnType(col, rowProps.original, rowProps.column.id)) {
+                        case ColumnType.Number: return <CollectionSchemaNumberCell {...props} />;
+                        case ColumnType.String: return <CollectionSchemaStringCell {...props} />;
+                        case ColumnType.Boolean: return <CollectionSchemaCheckboxCell {...props} />;
+                        case ColumnType.Doc: return <CollectionSchemaDocCell {...props} />;
+                        case ColumnType.Image: return <CollectionSchemaImageCell {...props} />;
+                        case ColumnType.List: return <CollectionSchemaListCell {...props} />;
+                        case ColumnType.Date: return <CollectionSchemaDateCell {...props} />;
+                        default:
+                            return <CollectionSchemaCell {...props} />;
+                    }
+                },
+                minWidth: 200,
+            };
+        }));
+        columns.push({
+            Header: <CollectionSchemaAddColumnHeader createColumn={this.createColumn} />,
+            accessor: (doc: Doc) => 0,
+            id: "add",
+            Cell: (rowProps: CellInfo) => {
+                const rowIndex = rowProps.index;
+                const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
+                const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
+                return <CollectionSchemaButtons  {...{
+                    row: rowProps.index,
+                    col: columnIndex,
+                    rowProps: rowProps,
+                    isFocused: isFocused,
+                    changeFocusedCellByIndex: this.changeFocusedCellByIndex,
+                    CollectionView: this.props.CollectionView,
+                    ContainingCollection: this.props.ContainingCollectionView,
+                    Document: this.props.Document,
+                    fieldKey: this.props.fieldKey,
+                    renderDepth: this.props.renderDepth,
+                    addDocTab: this.props.addDocTab,
+                    pinToPres: this.props.pinToPres,
+                    moveDocument: this.props.moveDocument,
+                    setIsEditing: this.setCellIsEditing,
+                    isEditable: isEditable,
+                    setPreviewDoc: this.props.setPreviewDoc,
+                    setComputed: this.setComputed,
+                    getField: this.getField,
+                    showDoc: this.showDoc,
+                }} />;
+            },
+            width: 28,
+            resizable: false
+        });
+        return columns;
+    }
+
+
+    constructor(props: SchemaTableProps) {
+        super(props);
+        if (this.props.Document._schemaHeaders === undefined) {
+            this.props.Document._schemaHeaders = new List<SchemaHeaderField>([new SchemaHeaderField("title", "#f1efeb"), new SchemaHeaderField("author", "#f1efeb"), new SchemaHeaderField("*lastModified", "#f1efeb", ColumnType.Date),
+            new SchemaHeaderField("text", "#f1efeb", ColumnType.String), new SchemaHeaderField("type", "#f1efeb"), new SchemaHeaderField("context", "#f1efeb", ColumnType.Doc)]);
+        }
+    }
+
+    componentDidMount() {
+        document.addEventListener("keydown", this.onKeyDown);
+    }
+
+    componentWillUnmount() {
+        document.removeEventListener("keydown", this.onKeyDown);
+    }
+
+    tableAddDoc = (doc: Doc, relativeTo?: Doc, before?: boolean) => {
+        const tableDoc = this.props.Document[DataSym];
+        const effectiveAcl = GetEffectiveAcl(tableDoc);
+
+        if (effectiveAcl !== AclPrivate && effectiveAcl !== AclReadonly) {
+            doc.context = this.props.Document;
+            tableDoc[this.props.fieldKey + "-lastModified"] = new DateField(new Date(Date.now()));
+            return Doc.AddDocToList(this.props.Document, this.props.fieldKey, doc, relativeTo, before);
+        }
+        return false;
+    }
+
+    private getTrProps: ComponentPropsGetterR = (state, rowInfo) => {
+        return !rowInfo ? {} : {
+            ScreenToLocalTransform: this.props.ScreenToLocalTransform,
+            addDoc: this.tableAddDoc,
+            removeDoc: this.props.deleteDocument,
+            rowInfo,
+            rowFocused: !this.props.headerIsEditing && rowInfo.index === this._focusedCell.row && this.props.isFocused(this.props.Document, true),
+            textWrapRow: this.toggleTextWrapRow,
+            rowWrapped: this.textWrappedRows.findIndex(id => rowInfo.original[Id] === id) > -1,
+            dropAction: StrCast(this.props.Document.childDropAction),
+            addDocTab: this.props.addDocTab
+        };
+    }
+
+    private getTdProps: ComponentPropsGetterR = (state, rowInfo, column, instance) => {
+        if (!rowInfo || column) return {};
+
+        const row = rowInfo.index;
+        //@ts-ignore
+        const col = this.columns.map(c => c.heading).indexOf(column!.id);
+        const isFocused = this._focusedCell.row === row && this._focusedCell.col === col && this.props.isFocused(this.props.Document, true);
+        // TODO: editing border doesn't work :(
+        return {
+            style: { border: !this.props.headerIsEditing && isFocused ? "2px solid rgb(255, 160, 160)" : "1px solid #f1efeb" }
+        };
+    }
+
+    @action setCellIsEditing = (isEditing: boolean) => this._cellIsEditing = isEditing;
+
+    @action
+    onKeyDown = (e: KeyboardEvent): void => {
+        if (!this._cellIsEditing && !this.props.headerIsEditing && this.props.isFocused(this.props.Document, true)) {// && this.props.isSelected(true)) {
+            const direction = e.key === "Tab" ? "tab" : e.which === 39 ? "right" : e.which === 37 ? "left" : e.which === 38 ? "up" : e.which === 40 ? "down" : "";
+            this._focusedCell = this.changeFocusedCellByDirection(direction, this._focusedCell.row, this._focusedCell.col);
+
+            if (direction) {
+                const pdoc = FieldValue(this.childDocs[this._focusedCell.row]);
+                pdoc && this.props.setPreviewDoc(pdoc);
+                e.stopPropagation();
+            }
+        } else if (e.keyCode === 27) {
+            this.props.setPreviewDoc(undefined);
+            e.stopPropagation(); // stopPropagation for left/right arrows 
+        }
+    }
+
+    changeFocusedCellByDirection = (direction: string, curRow: number, curCol: number) => {
+        switch (direction) {
+            case "tab": return { row: (curRow + 1 === this.childDocs.length ? 0 : curRow + 1), col: curCol + 1 === this.props.columns.length ? 0 : curCol + 1 };
+            case "right": return { row: curRow, col: curCol + 1 === this.props.columns.length ? curCol : curCol + 1 };
+            case "left": return { row: curRow, col: curCol === 0 ? curCol : curCol - 1 };
+            case "up": return { row: curRow === 0 ? curRow : curRow - 1, col: curCol };
+            case "down": return { row: curRow + 1 === this.childDocs.length ? curRow : curRow + 1, col: curCol };
+        }
+        return this._focusedCell;
+    }
+
+    @action
+    changeFocusedCellByIndex = (row: number, col: number): void => {
+        if (this._focusedCell.row !== row || this._focusedCell.col !== col) {
+            this._focusedCell = { row: row, col: col };
+        }
+        this.props.setFocused(this.props.Document);
+    }
+
+    @undoBatch
+    createRow = action(() => {
+        this.props.addDocument?.(Docs.Create.TextDocument("", { title: "", _width: 100, _height: 30 }));
+        this._focusedCell = { row: this.childDocs.length, col: this._focusedCell.col };
+    });
+
+    @undoBatch
+    @action
+    createColumn = () => {
+        let index = 0;
+        let found = this.props.columns.findIndex(col => col.heading.toUpperCase() === "New field".toUpperCase()) > -1;
+        while (found) {
+            index++;
+            found = this.props.columns.findIndex(col => col.heading.toUpperCase() === ("New field (" + index + ")").toUpperCase()) > -1;
+        }
+        this.props.columns.push(new SchemaHeaderField(`New field ${index ? "(" + index + ")" : ""}`, "#f1efeb"));
+    }
+
+    @action
+    getColumnType = (column: SchemaHeaderField, doc?: Doc, field?: string): ColumnType => {
+        if (doc && field && column.type === ColumnType.Any) {
+            const val = doc[CollectionSchemaCell.resolvedFieldKey(field, doc)];
+            if (val instanceof ImageField) return ColumnType.Image;
+            if (val instanceof Doc) return ColumnType.Doc;
+            if (val instanceof DateField) return ColumnType.Date;
+            if (val instanceof List) return ColumnType.List;
+        }
+        if (column.type && column.type !== 0) {
+            return column.type;
+        }
+        if (columnTypes.get(column.heading)) {
+            return column.type = columnTypes.get(column.heading)!;
+        }
+        return column.type = ColumnType.Any;
+    }
+
+    @undoBatch
+    @action
+    toggleTextwrap = async () => {
+        const textwrappedRows = Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
+        if (textwrappedRows.length) {
+            this.props.Document.textwrappedSchemaRows = new List<string>([]);
+        } else {
+            const docs = DocListCast(this.props.Document[this.props.fieldKey]);
+            const allRows = docs instanceof Doc ? [docs[Id]] : docs.map(doc => doc[Id]);
+            this.props.Document.textwrappedSchemaRows = new List<string>(allRows);
+        }
+    }
+
+    @action
+    toggleTextWrapRow = (doc: Doc): void => {
+        const textWrapped = this.textWrappedRows;
+        const index = textWrapped.findIndex(id => doc[Id] === id);
+
+        index > -1 ? textWrapped.splice(index, 1) : textWrapped.push(doc[Id]);
+
+        this.textWrappedRows = textWrapped;
+    }
+
+    @computed
+    get reactTable() {
+        const children = this.childDocs;
+        const hasCollectionChild = children.reduce((found, doc) => found || doc.type === DocumentType.COL, false);
+        const expanded: { [name: string]: any } = {};
+        Array.from(this._openCollections.keys()).map(col => expanded[col.toString()] = true);
+        const rerender = [...this.textWrappedRows]; // TODO: get component to rerender on text wrap change without needign to console.log :((((
+
+        return <ReactTable
+            style={{ position: "relative" }}
+            data={children}
+            page={0}
+            pageSize={children.length}
+            showPagination={false}
+            columns={this.tableColumns}
+            getTrProps={this.getTrProps}
+            getTdProps={this.getTdProps}
+            sortable={false}
+            TrComponent={MovableRow}
+            sorted={this.sorted}
+            expanded={expanded}
+            resized={this.resized}
+            onResizedChange={this.props.onResizedChange}
+            SubComponent={!hasCollectionChild ? undefined : row => (row.original.type !== DocumentType.COL) ? (null) :
+                <div className="reactTable-sub"><SchemaTable {...this.props} Document={row.original} dataDoc={undefined} childDocs={undefined} /></div>}
+
+        />;
+    }
+
+    onContextMenu = (e: React.MouseEvent): void => {
+        ContextMenu.Instance.addItem({ description: "Toggle text wrapping", event: this.toggleTextwrap, icon: "table" });
+    }
+
+    getField = (row: number, col?: number) => {
+        const docs = this.childDocs;
+
+        row = row % docs.length;
+        while (row < 0) row += docs.length;
+        const columns = this.props.columns;
+        const doc = docs[row];
+        if (col === undefined) {
+            return doc;
+        }
+        if (col >= 0 && col < columns.length) {
+            const column = this.props.columns[col].heading;
+            return doc[column];
+        }
+        return undefined;
+    }
+
+    createTransformer = (row: number, col: number): Transformer => {
+        const self = this;
+        const captures: { [name: string]: Field } = {};
+
+        const transformer: ts.TransformerFactory<ts.SourceFile> = context => {
+            return root => {
+                function visit(node: ts.Node) {
+                    node = ts.visitEachChild(node, visit, context);
+                    if (ts.isIdentifier(node)) {
+                        const isntPropAccess = !ts.isPropertyAccessExpression(node.parent) || node.parent.expression === node;
+                        const isntPropAssign = !ts.isPropertyAssignment(node.parent) || node.parent.name !== node;
+                        if (isntPropAccess && isntPropAssign) {
+                            if (node.text === "$r") {
+                                return ts.createNumericLiteral(row.toString());
+                            } else if (node.text === "$c") {
+                                return ts.createNumericLiteral(col.toString());
+                            } else if (node.text === "$") {
+                                if (ts.isCallExpression(node.parent)) {
+                                    // captures.doc = self.props.Document;
+                                    // captures.key = self.props.fieldKey;
+                                }
+                            }
+                        }
+                    }
+
+                    return node;
+                }
+                return ts.visitNode(root, visit);
+            };
+        };
+
+        // const getVars = () => {
+        //     return { capturedVariables: captures };
+        // };
+
+        return { transformer, /*getVars*/ };
+    }
+
+    setComputed = (script: string, doc: Doc, field: string, row: number, col: number): boolean => {
+        script =
+            `const $ = (row:number, col?:number) => {
+                const rval = (doc as any)[key][row + ${row}];
+                return col === undefined ? rval : rval[(doc as any)._schemaHeaders[col + ${col}].heading];
+            }
+            return ${script}`;
+        const compiled = CompileScript(script, { params: { this: Doc.name }, capturedVariables: { doc: this.props.Document, key: this.props.fieldKey }, typecheck: false, transformer: this.createTransformer(row, col) });
+        if (compiled.compiled) {
+            doc[field] = new ComputedField(compiled);
+            return true;
+        }
+        return false;
+    }
+
+    @action
+    showDoc = (doc: Doc | undefined, dataDoc?: Doc, screenX?: number, screenY?: number) => {
+        this._showDoc = doc;
+        if (dataDoc && screenX && screenY) {
+            this._showDocPos = this.props.ScreenToLocalTransform().transformPoint(screenX, screenY);
+        }
+    }
+
+    onOpenClick = () => {
+        this._showDoc && this.props.addDocTab(this._showDoc, "add:right");
+    }
+
+    getPreviewTransform = (): Transform => {
+        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - 4 - this.tableWidth, - this.borderWidth);
+    }
+
+    render() {
+        const preview = "";
+        return <div className="collectionSchemaView-table"
+            onPointerDown={this.props.onPointerDown} onClick={this.props.onClick} onWheel={e => this.props.active(true) && e.stopPropagation()}
+            onDrop={e => this.props.onDrop(e, {})} onContextMenu={this.onContextMenu} >
+            {this.reactTable}
+            {this.props.Document._chromeHidden ? undefined : <div className="collectionSchemaView-addRow" onClick={this.createRow}>+ new</div>}
+            {!this._showDoc ? (null) :
+                <div className="collectionSchemaView-documentPreview" ref="overlay"
+                    style={{
+                        position: "absolute", width: 150, height: 150,
+                        background: "dimGray", display: "block", top: 0, left: 0,
+                        transform: `translate(${this._showDocPos[0]}px, ${this._showDocPos[1] - 180}px)`
+                    }} >
+                    <DocumentView
+                        Document={this._showDoc}
+                        DataDoc={this._showDataDoc}
+                        styleProvider={DefaultStyleProvider}
+                        layerProvider={undefined}
+                        docViewPath={returnEmptyDoclist}
+                        freezeDimensions={true}
+                        focus={DocUtils.DefaultFocus}
+                        renderDepth={this.props.renderDepth}
+                        rootSelected={returnFalse}
+                        isContentActive={returnTrue}
+                        isDocumentActive={returnFalse}
+                        PanelWidth={() => 150}
+                        PanelHeight={() => 150}
+                        ScreenToLocalTransform={this.getPreviewTransform}
+                        docFilters={returnEmptyFilter}
+                        docRangeFilters={returnEmptyFilter}
+                        searchFilterDocs={returnEmptyDoclist}
+                        ContainingCollectionDoc={this.props.CollectionView?.props.Document}
+                        ContainingCollectionView={this.props.CollectionView}
+                        moveDocument={this.props.moveDocument}
+                        whenChildContentsActiveChanged={emptyFunction}
+                        addDocTab={this.props.addDocTab}
+                        pinToPres={this.props.pinToPres}
+                        bringToFront={returnFalse}>
+                    </DocumentView>
+                </div>}
+        </div>;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx
index f0a54e4ac..ecf4c0901 100644
--- a/src/client/views/nodes/DocumentContentsView.tsx
+++ b/src/client/views/nodes/DocumentContentsView.tsx
@@ -8,7 +8,7 @@ import { emptyPath, OmitKeys, Without } from "../../../Utils";
 import { DirectoryImportBox } from "../../util/Import & Export/DirectoryImportBox";
 import { CollectionDockingView } from "../collections/CollectionDockingView";
 import { CollectionFreeFormView } from "../collections/collectionFreeForm/CollectionFreeFormView";
-import { CollectionSchemaView } from "../collections/CollectionSchemaView";
+import { CollectionSchemaView } from "../collections/schemaView/CollectionSchemaView";
 import { CollectionView } from "../collections/CollectionView";
 import { InkingStroke } from "../InkingStroke";
 import { PresElementBox } from "../presentationview/PresElementBox";
-- 
cgit v1.2.3-70-g09d2


From 0ac0b74de8578062aa7f700779613ff0e18a12ea Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Thu, 8 Jul 2021 09:48:51 -0400
Subject: fixed file path mess

---
 src/client/views/collections/CollectionView.tsx    |  2 +-
 .../schemaView/CollectionSchemaCells.tsx           |  2 +-
 .../schemaView/CollectionSchemaHeaders.tsx         |  3 +-
 .../schemaView/CollectionSchemaMovableTableHOC.tsx | 18 +++++-----
 .../schemaView/CollectionSchemaView.tsx            | 38 +++++++++++-----------
 .../views/collections/schemaView/SchemaTable.tsx   |  2 +-
 src/client/views/search/SearchBox.tsx              |  4 +--
 7 files changed, 35 insertions(+), 34 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx
index fb60265e3..e5b1721f9 100644
--- a/src/client/views/collections/CollectionView.tsx
+++ b/src/client/views/collections/CollectionView.tsx
@@ -29,7 +29,7 @@ import CollectionMapView from './CollectionMapView';
 import { CollectionMulticolumnView } from './collectionMulticolumn/CollectionMulticolumnView';
 import { CollectionMultirowView } from './collectionMulticolumn/CollectionMultirowView';
 import { CollectionPileView } from './CollectionPileView';
-import { CollectionSchemaView } from "./CollectionSchemaView";
+import { CollectionSchemaView } from "./schemaView/CollectionSchemaView";
 import { CollectionStackingView } from './CollectionStackingView';
 import { SubCollectionViewProps } from './CollectionSubView';
 import { CollectionTimeView } from './CollectionTimeView';
diff --git a/src/client/views/collections/schemaView/CollectionSchemaCells.tsx b/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
index 2549beaae..f2df87d71 100644
--- a/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
@@ -24,7 +24,7 @@ import { CompileScript } from "../../../util/Scripting";
 import { SearchUtil } from "../../../util/SearchUtil";
 import { SnappingManager } from "../../../util/SnappingManager";
 import { undoBatch } from "../../../util/UndoManager";
-import '../DocumentDecorations.scss';
+import '../../../views/DocumentDecorations.scss';
 import { EditableView } from "../../EditableView";
 import { MAX_ROW_HEIGHT } from '../../globalCssVariables.scss';
 import { DocumentIconContainer } from "../../nodes/DocumentIcon";
diff --git a/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx b/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
index b825d6d96..ab3076224 100644
--- a/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
+++ b/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
@@ -10,7 +10,8 @@ import { ScriptField } from "../../../../fields/ScriptField";
 import { Cast, StrCast } from "../../../../fields/Types";
 import { undoBatch } from "../../../util/UndoManager";
 import { SearchBox } from "../../search/SearchBox";
-import { ColumnType } from "../CollectionSchemaView";
+import { ColumnType } from "./CollectionSchemaView";
+import { ColumnType2 } from "../CollectionSchemaView";
 import "./CollectionSchemaView.scss";
 import { CollectionView } from "../CollectionView";
 
diff --git a/src/client/views/collections/schemaView/CollectionSchemaMovableTableHOC.tsx b/src/client/views/collections/schemaView/CollectionSchemaMovableTableHOC.tsx
index 149677976..e1066caf4 100644
--- a/src/client/views/collections/schemaView/CollectionSchemaMovableTableHOC.tsx
+++ b/src/client/views/collections/schemaView/CollectionSchemaMovableTableHOC.tsx
@@ -2,15 +2,15 @@ import React = require("react");
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { action } from "mobx";
 import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
-import { Doc } from "../../../fields/Doc";
-import { SchemaHeaderField } from "../../../fields/SchemaHeaderField";
-import { Cast, FieldValue, StrCast } from "../../../fields/Types";
-import { DocumentManager } from "../../util/DocumentManager";
-import { DragManager, dropActionType, SetupDrag } from "../../util/DragManager";
-import { SnappingManager } from "../../util/SnappingManager";
-import { Transform } from "../../util/Transform";
-import { undoBatch } from "../../util/UndoManager";
-import { ContextMenu } from "../ContextMenu";
+import { Doc } from "../../../../fields/Doc";
+import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { Cast, FieldValue, StrCast } from "../../../../fields/Types";
+import { DocumentManager } from "../../../util/DocumentManager";
+import { DragManager, dropActionType, SetupDrag } from "../../../util/DragManager";
+import { SnappingManager } from "../../../util/SnappingManager";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { ContextMenu } from "../../ContextMenu";
 import "./CollectionSchemaView.scss";
 
 export interface MovableColumnProps {
diff --git a/src/client/views/collections/schemaView/CollectionSchemaView.tsx b/src/client/views/collections/schemaView/CollectionSchemaView.tsx
index b33c437a9..ef28f75c8 100644
--- a/src/client/views/collections/schemaView/CollectionSchemaView.tsx
+++ b/src/client/views/collections/schemaView/CollectionSchemaView.tsx
@@ -5,27 +5,27 @@ import { observer } from "mobx-react";
 import Measure from "react-measure";
 import { Resize } from "react-table";
 import "react-table/react-table.css";
-import { Doc, Opt } from "../../../fields/Doc";
-import { List } from "../../../fields/List";
-import { listSpec } from "../../../fields/Schema";
-import { PastelSchemaPalette, SchemaHeaderField } from "../../../fields/SchemaHeaderField";
-import { Cast, NumCast } from "../../../fields/Types";
-import { TraceMobx } from "../../../fields/util";
-import { emptyFunction, emptyPath, returnFalse, setupMoveUpEvents, returnEmptyDoclist, returnTrue } from "../../../Utils";
-import { SelectionManager } from "../../util/SelectionManager";
-import { SnappingManager } from "../../util/SnappingManager";
-import { Transform } from "../../util/Transform";
-import { undoBatch } from "../../util/UndoManager";
-import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../views/globalCssVariables.scss';
-import { ContextMenu } from "../ContextMenu";
-import { ContextMenuProps } from "../ContextMenuItem";
-import '../DocumentDecorations.scss';
-import { DocumentView } from "../nodes/DocumentView";
-import { DefaultStyleProvider } from "../StyleProvider";
+import { Doc, Opt } from "../../../../fields/Doc";
+import { List } from "../../../../fields/List";
+import { listSpec } from "../../../../fields/Schema";
+import { PastelSchemaPalette, SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { Cast, NumCast } from "../../../../fields/Types";
+import { TraceMobx } from "../../../../fields/util";
+import { emptyFunction, emptyPath, returnFalse, setupMoveUpEvents, returnEmptyDoclist, returnTrue } from "../../../../Utils";
+import { SelectionManager } from "../../../util/SelectionManager";
+import { SnappingManager } from "../../../util/SnappingManager";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../globalCssVariables.scss';
+import { ContextMenu } from "../../ContextMenu";
+import { ContextMenuProps } from "../../ContextMenuItem";
+import '../../../views/DocumentDecorations.scss';
+import { DocumentView } from "../../nodes/DocumentView";
+import { DefaultStyleProvider } from "../../StyleProvider";
 import "./CollectionSchemaView.scss";
-import { CollectionSubView } from "./CollectionSubView";
+import { CollectionSubView } from "../CollectionSubView";
 import { SchemaTable } from "./SchemaTable";
-import { DocUtils } from "../../documents/Documents";
+import { DocUtils } from "../../../documents/Documents";
 // bcz: need to add drag and drop of rows and columns.  This seems like it might work for rows: https://codesandbox.io/s/l94mn1q657
 
 export enum ColumnType {
diff --git a/src/client/views/collections/schemaView/SchemaTable.tsx b/src/client/views/collections/schemaView/SchemaTable.tsx
index c305f6806..05d77a739 100644
--- a/src/client/views/collections/schemaView/SchemaTable.tsx
+++ b/src/client/views/collections/schemaView/SchemaTable.tsx
@@ -23,7 +23,7 @@ import { Transform } from "../../../util/Transform";
 import { undoBatch } from "../../../util/UndoManager";
 import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../globalCssVariables.scss';
 import { ContextMenu } from "../../ContextMenu";
-import '../DocumentDecorations.scss';
+import '../../../views/DocumentDecorations.scss';
 import { DocumentView } from "../../nodes/DocumentView";
 import { DefaultStyleProvider } from "../../StyleProvider";
 import { CellProps, CollectionSchemaButtons, CollectionSchemaCell, CollectionSchemaCheckboxCell, CollectionSchemaDateCell, CollectionSchemaDocCell, CollectionSchemaImageCell, CollectionSchemaListCell, CollectionSchemaNumberCell, CollectionSchemaStringCell } from "./CollectionSchemaCells";
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 5c168d8a9..a671c955d 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -18,7 +18,7 @@ import { SetupDrag } from '../../util/DragManager';
 import { SearchUtil } from '../../util/SearchUtil';
 import { Transform } from '../../util/Transform';
 import { CollectionDockingView } from "../collections/CollectionDockingView";
-import { CollectionSchemaView, ColumnType } from "../collections/CollectionSchemaView";
+import { CollectionSchemaView, ColumnType } from "../collections/schemaView/CollectionSchemaView";
 import { CollectionViewType } from '../collections/CollectionView';
 import { ViewBoxBaseComponent } from "../DocComponent";
 import { FieldView, FieldViewProps } from '../nodes/FieldView';
@@ -119,7 +119,7 @@ export class SearchBox extends ViewBoxBaseComponent<FieldViewProps, SearchBoxDoc
 
     getFinalQuery(query: string): string {
         //alters the query so it looks in the correct fields
-        //if this is true, th`en not all of the field boxes are checked
+        //if this is true, then not all of the field boxes are checked
         //TODO: data
         const initialfilters = Cast(this.props.Document._docFilters, listSpec("string"), []);
 
-- 
cgit v1.2.3-70-g09d2


From dc4d29e7aef46d856f59e2f45f0016de45df78a7 Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Thu, 8 Jul 2021 10:28:08 -0400
Subject: minor bugfix for numbers with commas and periods

---
 src/client/views/collections/schemaView/CollectionSchemaCells.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/schemaView/CollectionSchemaCells.tsx b/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
index f2df87d71..f75179cea 100644
--- a/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
@@ -33,6 +33,7 @@ import "./CollectionSchemaView.scss";
 import { CollectionView } from "../CollectionView";
 const path = require('path');
 
+// intialize cell properties
 export interface CellProps {
     row: number;
     col: number;
@@ -246,7 +247,7 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                         // check if the input is a number
                                         let inputIsNum = true;
                                         for (let s of value) {
-                                            if (isNaN(parseInt(s))) {
+                                            if (isNaN(parseInt(s)) && !(s == ".") && !(s == ",")) {
                                                 inputIsNum = false;
                                             }
                                         }
@@ -373,7 +374,7 @@ export class CollectionSchemaDocCell extends CollectionSchemaCell {
 
         const script = CompileScript(value, {
             addReturn: true,
-            typecheck: false,
+            typecheck: true,
             transformer: DocumentIconContainer.getTransformer()
         });
 
-- 
cgit v1.2.3-70-g09d2


From 3c834ee55899b91f5fff8cfe5c808607f942b9f3 Mon Sep 17 00:00:00 2001
From: dinhanhtruong <70963346+dinhanhtruong@users.noreply.github.com>
Date: Thu, 8 Jul 2021 15:51:26 -0400
Subject: created front-end link popup on text highlight

added button to AnchorMenu marquee selector for showing the link popup after highlighting text. created the front end of the popup. need to fix visibility when clicking out
---
 src/client/views/AntimodeMenu.scss                 |  1 -
 src/client/views/linking/LinkPopup.scss            | 40 +++++++++
 src/client/views/linking/LinkPopup.tsx             | 94 ++++++++++++++++++++++
 src/client/views/nodes/DocumentLinksButton.tsx     | 18 +++--
 src/client/views/nodes/LinkDocPreview.tsx          |  4 +-
 .../views/nodes/formattedText/FormattedTextBox.tsx |  2 +-
 src/client/views/pdf/AnchorMenu.tsx                | 17 ++++
 7 files changed, 166 insertions(+), 10 deletions(-)
 create mode 100644 src/client/views/linking/LinkPopup.scss
 create mode 100644 src/client/views/linking/LinkPopup.tsx

(limited to 'src')

diff --git a/src/client/views/AntimodeMenu.scss b/src/client/views/AntimodeMenu.scss
index a275901be..468ee838d 100644
--- a/src/client/views/AntimodeMenu.scss
+++ b/src/client/views/AntimodeMenu.scss
@@ -8,7 +8,6 @@
     background: #323232;
     box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.25);
     // border-radius: 0px 6px 6px 6px;
-    z-index: 1001;
     display: flex;
 
     &.with-rows {
diff --git a/src/client/views/linking/LinkPopup.scss b/src/client/views/linking/LinkPopup.scss
new file mode 100644
index 000000000..009a21bd6
--- /dev/null
+++ b/src/client/views/linking/LinkPopup.scss
@@ -0,0 +1,40 @@
+.linkPopup-container {
+    background: white;
+    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
+    top: 35px;
+    height: 200px;
+    width: 200px;
+    position: absolute;
+    padding: 10px;
+    border-radius: 3px;
+
+    input {
+        border: 1px solid #b9b9b9;
+        border-radius: 20px;
+        height: 25px;
+        width: 100%;
+        padding-left: 10px;
+    }
+
+    .divider {
+        margin: 10px 0;
+        height: 20px;
+        width: 100%;
+
+        .line {
+            height: 1px;
+            background-color: #b9b9b9;
+            width: 100%;
+            position: relative;
+            top: 12px;
+        }
+
+        .divider-text {
+            width: 20px;
+            background-color: white;
+            text-align: center;
+            position: relative;
+            margin: auto;
+        }
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/linking/LinkPopup.tsx b/src/client/views/linking/LinkPopup.tsx
new file mode 100644
index 000000000..71db06f19
--- /dev/null
+++ b/src/client/views/linking/LinkPopup.tsx
@@ -0,0 +1,94 @@
+import { IconProp } from '@fortawesome/fontawesome-svg-core';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { Tooltip } from '@material-ui/core';
+import { action, observable, runInAction } from 'mobx';
+import { observer } from "mobx-react";
+import { Doc, DocListCast } from '../../../fields/Doc';
+import { Cast, StrCast } from '../../../fields/Types';
+import { WebField } from '../../../fields/URLField';
+import { emptyFunction, setupMoveUpEvents, returnFalse, returnTrue, returnEmptyDoclist, returnEmptyFilter } from '../../../Utils';
+import { DocumentType } from '../../documents/DocumentTypes';
+import { DocumentManager } from '../../util/DocumentManager';
+import { DragManager } from '../../util/DragManager';
+import { Hypothesis } from '../../util/HypothesisUtils';
+import { LinkManager } from '../../util/LinkManager';
+import { undoBatch } from '../../util/UndoManager';
+import { DocumentLinksButton } from '../nodes/DocumentLinksButton';
+import { DocumentView, DocumentViewSharedProps } from '../nodes/DocumentView';
+import { LinkDocPreview } from '../nodes/LinkDocPreview';
+import './LinkPopup.scss';
+import React = require("react");
+import { CurrentUserUtils } from '../../util/CurrentUserUtils';
+import { DefaultStyleProvider } from '../StyleProvider';
+import { Transform } from 'stream';
+import { DocUtils } from '../../documents/Documents';
+import { SearchBox } from '../search/SearchBox';
+
+interface LinkPopupProps {
+    showPopup: boolean;
+    // groupType: string;
+    // linkDoc: Doc;
+    // docView: DocumentView;
+    // sourceDoc: Doc;
+}
+
+/**
+ * Popup component for creating links from text to Dash documents 
+ */
+
+@observer
+export class LinkPopup extends React.Component<LinkPopupProps> {
+
+    render() {
+        const popupVisibility = this.props.showPopup ? "block" : "none";
+        return (
+            <div className="linkPopup-container" style={{ display: popupVisibility }}>
+
+                <div className="linkPopup-url-container">
+                    <input defaultValue={""} autoComplete="off" type="text" placeholder="Enter URL..." id="url-input"
+                        className="linkPopup-searchBox searchBox-input" />
+                    <button style={{ display: "block", margin: "10px auto", }}>Apply hyperlink</button>
+                </div>
+                <div className="divider">
+                    <div className="line"></div>
+                    <p className="divider-text">or</p>
+                </div>
+                <div className="linkPopup-document-search-container">
+                    <i></i>
+                    <input defaultValue={""} autoComplete="off" type="text" placeholder="Search for Document..." id="search-input"
+                        className="linkPopup-searchBox searchBox-input" />
+
+                    {/*                     
+                        <SearchBox Document={CurrentUserUtils.MySearchPanelDoc}
+                        DataDoc={CurrentUserUtils.MySearchPanelDoc}
+                        fieldKey="data"
+                        dropAction="move"
+                        isSelected={returnTrue}
+                        isContentActive={returnTrue}
+                        select={returnTrue}
+                        setHeight={returnFalse}
+                        addDocument={undefined}
+                        addDocTab={this.addDocTabFunc}
+                        pinToPres={emptyFunction}
+                        rootSelected={returnTrue}
+                        styleProvider={DefaultStyleProvider}
+                        layerProvider={undefined}
+                        removeDocument={undefined}
+                        ScreenToLocalTransform={Transform.Identity}
+                        PanelWidth={this.getPWidth}
+                        PanelHeight={this.getPHeight}
+                        renderDepth={0}
+                        focus={DocUtils.DefaultFocus}
+                        docViewPath={returnEmptyDoclist}
+                        whenChildContentsActiveChanged={emptyFunction}
+                        bringToFront={emptyFunction}
+                        docFilters={returnEmptyFilter}
+                        docRangeFilters={returnEmptyFilter}
+                        searchFilterDocs={returnEmptyDoclist}
+                        ContainingCollectionView={undefined}
+                        ContainingCollectionDoc={undefined} /> */}
+                </div>
+            </div>
+        );
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx
index a6d07374a..046a8c856 100644
--- a/src/client/views/nodes/DocumentLinksButton.tsx
+++ b/src/client/views/nodes/DocumentLinksButton.tsx
@@ -30,12 +30,12 @@ interface DocumentLinksButtonProps {
     Offset?: (number | undefined)[];
     AlwaysOn?: boolean;
     InMenu?: boolean;
-    StartLink?: boolean;
+    StartLink?: boolean; //whether the link HAS been started (i.e. now needs to be completed)
 }
 @observer
 export class DocumentLinksButton extends React.Component<DocumentLinksButtonProps, {}> {
     private _linkButton = React.createRef<HTMLDivElement>();
-    @observable public static StartLink: Doc | undefined;
+    @observable public static StartLink: Doc | undefined; //origin's Doc, if defined
     @observable public static StartLinkView: DocumentView | undefined;
     @observable public static AnnotationId: string | undefined;
     @observable public static AnnotationUri: string | undefined;
@@ -45,6 +45,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
     public static invisibleWebRef = React.createRef<HTMLDivElement>();
 
     @action public static ClearLinkEditor() { DocumentLinksButton.LinkEditorDocView = undefined; }
+
     @action @undoBatch
     onLinkButtonMoved = (e: PointerEvent) => {
         if (this.props.InMenu && this.props.StartLink) {
@@ -120,7 +121,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
             if (DocumentLinksButton.StartLink === this.props.View.props.Document) {
                 DocumentLinksButton.StartLink = undefined;
                 DocumentLinksButton.StartLinkView = undefined;
-            } else {
+            } else { //if this LinkButton's Document is undefined
                 DocumentLinksButton.StartLink = this.props.View.props.Document;
                 DocumentLinksButton.StartLinkView = this.props.View;
             }
@@ -131,6 +132,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
         }
     }
 
+
     completeLink = (e: React.PointerEvent): void => {
         setupMoveUpEvents(this, e, returnFalse, emptyFunction, undoBatch(action((e, doubleTap) => {
             if (doubleTap && !this.props.StartLink) {
@@ -141,7 +143,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
                 } else if (DocumentLinksButton.StartLink && DocumentLinksButton.StartLink !== this.props.View.props.Document) {
                     const sourceDoc = DocumentLinksButton.StartLink;
                     const targetDoc = this.props.View.ComponentView?.getAnchor?.() || this.props.View.Document;
-                    const linkDoc = DocUtils.MakeLink({ doc: sourceDoc }, { doc: targetDoc }, "long drag");
+                    const linkDoc = DocUtils.MakeLink({ doc: sourceDoc }, { doc: targetDoc }, "long drag"); //why is long drag here when this is used for completing links by clicking?
 
                     LinkManager.currentLink = linkDoc;
 
@@ -242,6 +244,9 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
         return results;
     }
 
+    /**
+     * gets the JSX of the link button (btn used to start/complete links) OR the link-view button (btn on bottom left of each linked node)
+     */
     @computed get linkButtonInner() {
         const btnDim = this.props.InMenu ? "20px" : "30px";
         const link = <img style={{ width: "22px", height: "16px" }} src={`/assets/${"link.png"}`} />;
@@ -263,7 +268,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
                         : link
                     : Array.from(this.filteredLinks).length}
             </div>
-            {this.props.InMenu && !this.props.StartLink && DocumentLinksButton.StartLink !== this.props.View.props.Document ?
+            {this.props.InMenu && !this.props.StartLink && DocumentLinksButton.StartLink !== this.props.View.props.Document ? //if the origin node is not this node
                 <div className={"documentLinksButton-endLink"}
                     style={{
                         width: btnDim, height: btnDim,
@@ -276,7 +281,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
                     onClick={e => DocumentLinksButton.StartLink && DocumentLinksButton.finishLinkClick(e.clientX, e.clientY, DocumentLinksButton.StartLink, this.props.View.props.Document, true, this.props.View)} />
                 : (null)
             }
-            {DocumentLinksButton.StartLink === this.props.View.props.Document && this.props.InMenu && this.props.StartLink ?
+            {DocumentLinksButton.StartLink === this.props.View.props.Document && this.props.InMenu && this.props.StartLink ? //if link has been started from current node, then set behavior of link button to deactivate linking when clicked again
                 <div className={"documentLinksButton-startLink"} onPointerDown={this.clearLinks} onClick={this.clearLinks} style={{ width: btnDim, height: btnDim }} />
                 : (null)
             }
@@ -290,6 +295,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
         const buttonTitle = "Tap to view links; double tap to open link collection";
         const title = this.props.InMenu ? menuTitle : buttonTitle;
 
+        //render circular tooltip if it isn't set to invisible and show the number of doc links the node has, and render inner-menu link button for starting/stopping links if currently in menu
         return !Array.from(this.filteredLinks).length && !this.props.AlwaysOn ? (null) :
             this.props.InMenu && (DocumentLinksButton.StartLink || this.props.StartLink) ?
                 <Tooltip title={<div className="dash-tooltip">{title}</div>}>
diff --git a/src/client/views/nodes/LinkDocPreview.tsx b/src/client/views/nodes/LinkDocPreview.tsx
index 65afbe131..b73fb10df 100644
--- a/src/client/views/nodes/LinkDocPreview.tsx
+++ b/src/client/views/nodes/LinkDocPreview.tsx
@@ -110,11 +110,11 @@ export class LinkDocPreview extends React.Component<LinkDocPreviewProps> {
         }
     }
     width = () => {
-        if (!this._targetDoc) return 500;
+        if (!this._targetDoc) return 225;
         if (this._targetDoc[WidthSym]() < this._targetDoc?.[HeightSym]()) {
             return Math.min(225, this._targetDoc[HeightSym]()) * this._targetDoc[WidthSym]() / this._targetDoc[HeightSym]();
         }
-        return Math.min(500, NumCast(this._targetDoc?.[WidthSym](), 500));
+        return Math.min(225, NumCast(this._targetDoc?.[WidthSym](), 225));
     }
     height = () => {
         if (!this._targetDoc) return 225;
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 911ec1560..5180732b9 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -1398,7 +1398,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
                 SelectionManager.DeselectAll();
                 RichTextMenu.Instance.updateMenu(undefined, undefined, undefined);
                 return;
-            case "Enter": this.insertTime();
+            case "Enter": this.insertTime(); 
             case "Tab": e.preventDefault(); break;
             default: if (this._lastTimedMark?.attrs.userid === Doc.CurrentUserEmail) break;
             case " ":
diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx
index 1e2d72254..4d9dbe7a0 100644
--- a/src/client/views/pdf/AnchorMenu.tsx
+++ b/src/client/views/pdf/AnchorMenu.tsx
@@ -10,6 +10,7 @@ import { AntimodeMenu, AntimodeMenuProps } from "../AntimodeMenu";
 import { ButtonDropdown } from "../nodes/formattedText/RichTextMenu";
 import "./AnchorMenu.scss";
 import { SelectionManager } from "../../util/SelectionManager";
+import { LinkPopup } from "../linking/LinkPopup";
 
 @observer
 export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
@@ -38,6 +39,7 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
     @observable private _valueValue: string = "";
     @observable private _added: boolean = false;
     @observable private highlightColor: string = "rgba(245, 230, 95, 0.616)";
+    @observable private _showLinkPopup: boolean = false;
 
     @observable public _colorBtn = false;
     @observable public Highlighting: boolean = false;
@@ -79,6 +81,14 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
         }
     }
 
+    @action
+    toggleLinkPopup = (e: React.MouseEvent) => {
+        //ignore the potential null type error because this method cannot be called unless the user selects text and clicks the link button
+        console.log(window.getSelection().toString())
+        //change popup visibility field to visible
+        this._showLinkPopup = !this._showLinkPopup;
+    }
+
     @computed get highlighter() {
         const button =
             <button className="antimodeMenu-button color-preview-button" title="" key="highlighter-button" onClick={this.highlightClicked}>
@@ -135,6 +145,13 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
                         <FontAwesomeIcon icon="comment-alt" size="lg" />
                     </button>
                 </Tooltip>,
+
+                <Tooltip key="link" title={<div className="dash-tooltip">{"Link selected text to document or URL"}</div>}>
+                    <button className="antimodeMenu-button link" onPointerDown={this.toggleLinkPopup} style={{}}>
+                        <FontAwesomeIcon icon="link" size="lg" />
+                    </button>
+                </Tooltip>,
+                <LinkPopup showPopup={this._showLinkPopup} />
             ] : [
                 <Tooltip key="trash" title={<div className="dash-tooltip">{"Remove Link Anchor"}</div>}>
                     <button className="antimodeMenu-button" onPointerDown={this.Delete}>
-- 
cgit v1.2.3-70-g09d2


From 4fe24111c6eafc58927fcca9d8c46a5b92cc4078 Mon Sep 17 00:00:00 2001
From: Ashley Cai <ashley.lcai@gmail.com>
Date: Sat, 10 Jul 2021 00:17:09 -0700
Subject: Standardizing Colors, changing global CSS variables

---
 .VSCodeCounter/details.md                          |     4 +-
 .VSCodeCounter/results.csv                         |     4 +-
 .VSCodeCounter/results.txt                         |     4 +-
 package-lock.json                                  | 23038 ++++++++++++++++++-
 src/client/ClientRecommender.scss                  |     2 +-
 src/client/documents/Documents.ts                  |     2 +-
 src/client/util/CaptureManager.scss                |     2 +-
 src/client/util/DragManager.ts                     |     2 +-
 src/client/util/SettingsManager.scss               |     4 +-
 src/client/views/AntimodeMenu.scss                 |     2 +-
 src/client/views/ContextMenu.scss                  |    18 +-
 src/client/views/DocumentButtonBar.scss            |    12 +-
 src/client/views/DocumentDecorations.scss          |    20 +-
 src/client/views/Main.scss                         |     6 +-
 src/client/views/MainView.scss                     |     2 +-
 src/client/views/MainView.tsx                      |     6 +-
 src/client/views/PropertiesButtons.scss            |    16 +-
 src/client/views/TemplateMenu.scss                 |     6 +-
 src/client/views/animationtimeline/Keyframe.scss   |    10 +-
 src/client/views/animationtimeline/Keyframe.tsx    |     2 +-
 src/client/views/animationtimeline/Timeline.scss   |     4 +-
 .../views/animationtimeline/TimelineMenu.scss      |     6 +-
 .../views/animationtimeline/TimelineOverview.scss  |     2 +-
 src/client/views/animationtimeline/Track.scss      |     4 +-
 .../views/collections/CollectionDockingView.scss   |    16 +-
 .../views/collections/CollectionLinearView.scss    |     8 +-
 src/client/views/collections/CollectionMenu.scss   |     6 +-
 .../views/collections/CollectionSchemaCells.tsx    |     2 +-
 .../views/collections/CollectionSchemaView.scss    |    22 +-
 .../views/collections/CollectionSchemaView.tsx     |    24 +-
 .../views/collections/CollectionStackingView.scss  |    12 +-
 .../views/collections/CollectionTreeView.scss      |     8 +-
 src/client/views/collections/CollectionView.scss   |     4 +-
 src/client/views/collections/SchemaTable.tsx       |     2 +-
 src/client/views/collections/TreeView.scss         |     6 +-
 src/client/views/collections/TreeView.tsx          |     2 +-
 .../CollectionFreeFormRemoteCursors.scss           |     2 +-
 .../collectionFreeForm/CollectionFreeFormView.scss |     4 +-
 .../collectionFreeForm/CollectionFreeFormView.tsx  |    10 +-
 src/client/views/global/globalCssVariables.scss    |    52 +
 .../views/global/globalCssVariables.scss.d.ts      |    17 +
 src/client/views/global/globalEnums.tsx            |    19 +
 src/client/views/globalCssVariables.scss           |    56 -
 src/client/views/globalCssVariables.scss.d.ts      |    17 -
 src/client/views/linking/LinkEditor.scss           |    12 +-
 src/client/views/linking/LinkMenu.scss             |     2 +-
 src/client/views/linking/LinkMenuItem.scss         |    10 +-
 src/client/views/nodes/DocumentLinksButton.scss    |     4 +-
 src/client/views/nodes/DocumentView.scss           |     6 +-
 src/client/views/nodes/KeyValueBox.scss            |    20 +-
 src/client/views/nodes/KeyValuePair.scss           |     2 +-
 src/client/views/nodes/RadialMenu.scss             |     4 +-
 src/client/views/nodes/WebBox.scss                 |     2 +-
 .../nodes/formattedText/FormattedTextBox.scss      |     8 +-
 .../views/nodes/formattedText/RichTextMenu.scss    |     4 +-
 .../views/nodes/formattedText/TooltipTextMenu.scss |    10 +-
 src/client/views/search/CheckBox.scss              |     4 +-
 src/client/views/search/CollectionFilters.scss     |     2 +-
 src/client/views/search/IconBar.scss               |     2 +-
 src/client/views/search/IconButton.scss            |     4 +-
 src/client/views/search/IconButton.tsx             |     2 +-
 src/client/views/search/NaviconButton.scss         |     4 +-
 src/client/views/search/SearchBox.scss             |    10 +-
 src/client/views/search/SelectorContextMenu.scss   |     2 +-
 src/client/views/search/ToggleBar.scss             |     8 +-
 src/client/views/webcam/DashWebRTCVideo.scss       |     2 +-
 src/mobile/AudioUpload.scss                        |     2 +-
 src/mobile/ImageUpload.scss                        |     2 +-
 src/mobile/ImageUpload.tsx                         |     2 +-
 69 files changed, 23266 insertions(+), 331 deletions(-)
 create mode 100644 src/client/views/global/globalCssVariables.scss
 create mode 100644 src/client/views/global/globalCssVariables.scss.d.ts
 create mode 100644 src/client/views/global/globalEnums.tsx
 delete mode 100644 src/client/views/globalCssVariables.scss
 delete mode 100644 src/client/views/globalCssVariables.scss.d.ts

(limited to 'src')

diff --git a/.VSCodeCounter/details.md b/.VSCodeCounter/details.md
index 2f988953b..157c5ef33 100644
--- a/.VSCodeCounter/details.md
+++ b/.VSCodeCounter/details.md
@@ -424,8 +424,8 @@ Total : 646 files,  224911 codes, 32987 comments, 15880 blanks, all 273778 lines
 | [src/client/views/collections/collectionMulticolumn/MulticolumnWidthLabel.tsx](file:///Users/bcz/Documents/GitHub/Dash-Web/src/client/views/collections/collectionMulticolumn/MulticolumnWidthLabel.tsx) | TypeScript React | 51 | 0 | 5 | 56 |
 | [src/client/views/collections/collectionMulticolumn/MultirowHeightLabel.tsx](file:///Users/bcz/Documents/GitHub/Dash-Web/src/client/views/collections/collectionMulticolumn/MultirowHeightLabel.tsx) | TypeScript React | 51 | 0 | 5 | 56 |
 | [src/client/views/collections/collectionMulticolumn/MultirowResizer.tsx](file:///Users/bcz/Documents/GitHub/Dash-Web/src/client/views/collections/collectionMulticolumn/MultirowResizer.tsx) | TypeScript React | 92 | 0 | 9 | 101 |
-| [src/client/views/globalCssVariables.scss](file:///Users/bcz/Documents/GitHub/Dash-Web/src/client/views/globalCssVariables.scss) | SCSS | 30 | 10 | 3 | 43 |
-| [src/client/views/globalCssVariables.scss.d.ts](file:///Users/bcz/Documents/GitHub/Dash-Web/src/client/views/globalCssVariables.scss.d.ts) | TypeScript | 9 | 0 | 2 | 11 |
+| [src/client/views/global/global/globalCssVariables.scss](file:///Users/bcz/Documents/GitHub/Dash-Web/src/client/views/global/global/globalCssVariables.scss) | SCSS | 30 | 10 | 3 | 43 |
+| [src/client/views/global/global/globalCssVariables.scss.d.ts](file:///Users/bcz/Documents/GitHub/Dash-Web/src/client/views/global/global/globalCssVariables.scss.d.ts) | TypeScript | 9 | 0 | 2 | 11 |
 | [src/client/views/linking/LinkEditor.scss](file:///Users/bcz/Documents/GitHub/Dash-Web/src/client/views/linking/LinkEditor.scss) | SCSS | 124 | 1 | 25 | 150 |
 | [src/client/views/linking/LinkEditor.tsx](file:///Users/bcz/Documents/GitHub/Dash-Web/src/client/views/linking/LinkEditor.tsx) | TypeScript React | 252 | 7 | 50 | 309 |
 | [src/client/views/linking/LinkMenu.scss](file:///Users/bcz/Documents/GitHub/Dash-Web/src/client/views/linking/LinkMenu.scss) | SCSS | 40 | 0 | 13 | 53 |
diff --git a/.VSCodeCounter/results.csv b/.VSCodeCounter/results.csv
index b31bc8262..a346fa08d 100644
--- a/.VSCodeCounter/results.csv
+++ b/.VSCodeCounter/results.csv
@@ -412,8 +412,8 @@ src/client/views/collections/collectionMulticolumn/MulticolumnResizer.tsx, TypeS
 src/client/views/collections/collectionMulticolumn/MulticolumnWidthLabel.tsx, TypeScript React, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 51, 0, 0, 0, 0, 0, 0, 0, 5, 56
 src/client/views/collections/collectionMulticolumn/MultirowHeightLabel.tsx, TypeScript React, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 51, 0, 0, 0, 0, 0, 0, 0, 5, 56
 src/client/views/collections/collectionMulticolumn/MultirowResizer.tsx, TypeScript React, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 92, 0, 0, 0, 0, 0, 0, 0, 9, 101
-src/client/views/globalCssVariables.scss, SCSS, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 30, 0, 0, 0, 0, 0, 10, 3, 43
-src/client/views/globalCssVariables.scss.d.ts, TypeScript, 0, 0, 0, 0, 0, 9, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 11
+src/client/views/global/globalCssVariables.scss, SCSS, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 30, 0, 0, 0, 0, 0, 10, 3, 43
+src/client/views/global/globalCssVariables.scss.d.ts, TypeScript, 0, 0, 0, 0, 0, 9, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 11
 src/client/views/linking/LinkEditor.scss, SCSS, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 124, 0, 0, 0, 0, 0, 1, 25, 150
 src/client/views/linking/LinkEditor.tsx, TypeScript React, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 252, 0, 0, 0, 0, 0, 0, 7, 50, 309
 src/client/views/linking/LinkMenu.scss, SCSS, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 40, 0, 0, 0, 0, 0, 0, 13, 53
diff --git a/.VSCodeCounter/results.txt b/.VSCodeCounter/results.txt
index aaf54b147..c14fccb18 100644
--- a/.VSCodeCounter/results.txt
+++ b/.VSCodeCounter/results.txt
@@ -576,8 +576,8 @@ Files
 | src/client/views/collections/collectionMulticolumn/MulticolumnWidthLabel.tsx                                | TypeScript React |         51 |          0 |          5 |         56 |
 | src/client/views/collections/collectionMulticolumn/MultirowHeightLabel.tsx                                  | TypeScript React |         51 |          0 |          5 |         56 |
 | src/client/views/collections/collectionMulticolumn/MultirowResizer.tsx                                      | TypeScript React |         92 |          0 |          9 |        101 |
-| src/client/views/globalCssVariables.scss                                                                    | SCSS             |         30 |         10 |          3 |         43 |
-| src/client/views/globalCssVariables.scss.d.ts                                                               | TypeScript       |          9 |          0 |          2 |         11 |
+| src/client/views/global/globalCssVariables.scss                                                                    | SCSS             |         30 |         10 |          3 |         43 |
+| src/client/views/global/globalCssVariables.scss.d.ts                                                               | TypeScript       |          9 |          0 |          2 |         11 |
 | src/client/views/linking/LinkEditor.scss                                                                    | SCSS             |        124 |          1 |         25 |        150 |
 | src/client/views/linking/LinkEditor.tsx                                                                     | TypeScript React |        252 |          7 |         50 |        309 |
 | src/client/views/linking/LinkMenu.scss                                                                      | SCSS             |         40 |          0 |         13 |         53 |
diff --git a/package-lock.json b/package-lock.json
index 3637b14ac..05e46ee09 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,8 +1,22928 @@
 {
     "name": "dash",
     "version": "1.0.0",
-    "lockfileVersion": 1,
+    "lockfileVersion": 2,
     "requires": true,
+    "packages": {
+        "": {
+            "name": "dash",
+            "version": "1.0.0",
+            "dependencies": {
+                "@fortawesome/fontawesome-svg-core": "^1.2.29",
+                "@fortawesome/free-brands-svg-icons": "^5.14.0",
+                "@fortawesome/free-regular-svg-icons": "^5.13.1",
+                "@fortawesome/free-solid-svg-icons": "^5.13.1",
+                "@fortawesome/react-fontawesome": "^0.1.11",
+                "@hig/flyout": "^1.2.1",
+                "@hig/theme-context": "^2.1.3",
+                "@hig/theme-data": "^2.16.1",
+                "@material-ui/core": "^4.11.0",
+                "@react-three/fiber": "^6.0.16",
+                "@types/cors": "^2.8.8",
+                "@types/d3-axis": "^2.0.0",
+                "@types/d3-color": "^2.0.1",
+                "@types/d3-scale": "^3.2.2",
+                "@types/d3-selection": "^2.0.0",
+                "@types/google-maps": "^3.2.2",
+                "@types/react-reconciler": "^0.26.1",
+                "@types/reveal": "^3.3.33",
+                "@types/three": "^0.126.2",
+                "@types/webscopeio__react-textarea-autocomplete": "^4.6.1",
+                "@webscopeio/react-textarea-autocomplete": "^4.7.0",
+                "adm-zip": "^0.4.16",
+                "archiver": "^3.1.1",
+                "array-batcher": "^1.2.3",
+                "async": "^2.6.2",
+                "axios": "^0.19.2",
+                "babel-runtime": "^6.26.0",
+                "bcrypt-nodejs": "0.0.3",
+                "bezier-curve": "^1.0.0",
+                "bluebird": "^3.7.2",
+                "body-parser": "^1.18.3",
+                "bootstrap": "^4.5.0",
+                "canvas": "^2.5.0",
+                "child_process": "^1.0.2",
+                "chrome": "^0.1.0",
+                "class-transformer": "^0.2.0",
+                "color": "^3.1.2",
+                "colors": "^1.4.0",
+                "connect-flash": "^0.1.1",
+                "connect-mongo": "^2.0.3",
+                "cookie-parser": "^1.4.4",
+                "cookie-session": "^2.0.0-rc.1",
+                "cors": "^2.8.5",
+                "depcheck": "^0.9.2",
+                "equation-editor-react": "github:bobzel/equation-editor-react#useLocally",
+                "exif": "^0.6.0",
+                "express": "^4.16.4",
+                "express-flash": "0.0.2",
+                "express-session": "^1.17.0",
+                "express-validator": "^5.3.1",
+                "expressjs": "^1.0.1",
+                "file-saver": "^2.0.2",
+                "find-in-files": "^0.5.0",
+                "fit-curve": "^0.1.7",
+                "flexlayout-react": "^0.3.11",
+                "fluent-ffmpeg": "^2.1.2",
+                "formidable": "^1.2.1",
+                "function-plot": "^1.22.7",
+                "golden-layout": "^1.5.9",
+                "google-auth-library": "^4.2.4",
+                "google-maps-react": "^2.0.6",
+                "googleapis": "^40.0.0",
+                "googlephotos": "^0.2.5",
+                "howler": "^2.2.0",
+                "html-to-image": "^0.1.0",
+                "html-to-text": "^5.1.1",
+                "i": "^0.3.6",
+                "image-data-uri": "^2.0.1",
+                "image-size": "^0.7.5",
+                "image-size-stream": "^1.1.0",
+                "js-datepicker": "^4.6.6",
+                "jsonschema": "^1.2.5",
+                "jszip": "^3.5.0",
+                "libxmljs": "^0.19.7",
+                "lodash": "^4.17.15",
+                "material-ui": "^0.20.2",
+                "mobile-detect": "^1.4.4",
+                "mobx": "^5.15.7",
+                "mobx-react": "^5.4.4",
+                "mobx-react-devtools": "^6.1.1",
+                "mobx-utils": "^5.6.1",
+                "mongodb": "^3.5.9",
+                "mongoose": "^5.9.20",
+                "node-sass": "^4.14.1",
+                "node-stream-zip": "^1.11.2",
+                "nodemailer": "^5.1.1",
+                "nodemon": "^1.19.4",
+                "normalize.css": "^8.0.1",
+                "npm": "^6.14.5",
+                "p-limit": "^2.2.0",
+                "passport": "^0.4.0",
+                "passport-google-oauth20": "^2.0.0",
+                "passport-local": "^1.0.0",
+                "pdf-parse": "^1.1.1",
+                "pdfjs": "^2.3.9",
+                "pdfjs-dist": "^2.4.456",
+                "probe-image-size": "^4.0.0",
+                "prosemirror-commands": "^1.1.3",
+                "prosemirror-dev-tools": "^3.0.1",
+                "prosemirror-find-replace": "^0.9.0",
+                "prosemirror-history": "^1.1.3",
+                "prosemirror-inputrules": "^1.1.2",
+                "prosemirror-keymap": "^1.1.4",
+                "prosemirror-model": "^1.10.0",
+                "prosemirror-schema-list": "^1.1.2",
+                "prosemirror-state": "^1.3.2",
+                "prosemirror-transform": "^1.2.6",
+                "prosemirror-view": "^1.15.0",
+                "pug": "^2.0.4",
+                "puppeteer": "^3.3.0",
+                "query-string": "^6.13.1",
+                "raw-loader": "^1.0.0",
+                "rc-switch": "^1.9.0",
+                "react": "^16.12.0",
+                "react-audio-waveform": "0.0.5",
+                "react-autosuggest": "^9.4.3",
+                "react-beautiful-dnd": "^13.0.0",
+                "react-color": "^2.18.1",
+                "react-compound-slider": "^2.5.0",
+                "react-datepicker": "^3.0.0",
+                "react-dom": "^16.12.0",
+                "react-grid-layout": "^0.18.3",
+                "react-image-lightbox-with-rotate": "^5.1.1",
+                "react-jsx-parser": "^1.25.1",
+                "react-loading": "^2.0.3",
+                "react-measure": "^2.2.4",
+                "react-resizable": "^1.10.1",
+                "react-resizable-rotatable-draggable": "^0.2.0",
+                "react-reveal": "^1.2.2",
+                "react-select": "^3.1.0",
+                "react-table": "^6.11.5",
+                "readline": "^1.3.0",
+                "request": "^2.88.0",
+                "request-promise": "^4.2.5",
+                "reveal.js": "^4.0.2",
+                "rimraf": "^3.0.0",
+                "serializr": "^1.5.4",
+                "sharp": "^0.23.4",
+                "shelljs": "^0.8.3",
+                "socket.io": "^2.3.0",
+                "socket.io-client": "^2.3.0",
+                "solr-node": "^1.2.1",
+                "standard-http-error": "^2.0.1",
+                "styled-components": "^4.4.1",
+                "textarea-caret": "^3.1.0",
+                "three": "^0.127.0",
+                "translate-google-api": "^1.0.4",
+                "typescript-collections": "^1.3.3",
+                "typescript-language-server": "^0.4.0",
+                "url-loader": "^1.1.2",
+                "uuid": "^3.4.0",
+                "valid-url": "^1.0.9",
+                "web-request": "^1.0.7",
+                "webrtc-adapter": "^7.6.3",
+                "wikijs": "^6.0.1",
+                "words-to-numbers": "^1.5.1",
+                "xoauth2": "^1.2.0",
+                "xregexp": "^4.3.0"
+            },
+            "devDependencies": {
+                "@types/adm-zip": "^0.4.32",
+                "@types/animejs": "^2.0.2",
+                "@types/archiver": "^3.0.0",
+                "@types/async": "^2.4.1",
+                "@types/bcrypt-nodejs": "0.0.30",
+                "@types/bluebird": "^3.5.32",
+                "@types/body-parser": "^1.17.1",
+                "@types/chai": "^4.2.7",
+                "@types/color": "^3.0.1",
+                "@types/connect-flash": "0.0.34",
+                "@types/cookie-parser": "^1.4.2",
+                "@types/cookie-session": "^2.0.41",
+                "@types/dotenv": "^6.1.1",
+                "@types/exif": "^0.6.1",
+                "@types/express": "^4.17.2",
+                "@types/express-flash": "0.0.0",
+                "@types/express-session": "^1.15.16",
+                "@types/express-validator": "^3.0.0",
+                "@types/file-saver": "^2.0.1",
+                "@types/formidable": "^1.0.31",
+                "@types/google-maps-react": "^2.0.5",
+                "@types/jquery": "^3.5.0",
+                "@types/libxmljs": "^0.18.5",
+                "@types/lodash": "^4.14.157",
+                "@types/mobile-detect": "^1.3.4",
+                "@types/mocha": "^5.2.6",
+                "@types/mongodb": "^3.5.25",
+                "@types/mongoose": "^5.7.28",
+                "@types/node": "^10.17.26",
+                "@types/nodemailer": "^4.6.6",
+                "@types/passport": "^1.0.2",
+                "@types/passport-google-oauth20": "^2.0.3",
+                "@types/passport-local": "^1.0.33",
+                "@types/pdfjs-dist": "^2.1.4",
+                "@types/prosemirror-commands": "^1.0.1",
+                "@types/prosemirror-dev-tools": "^2.1.0",
+                "@types/prosemirror-history": "^1.0.1",
+                "@types/prosemirror-inputrules": "^1.0.2",
+                "@types/prosemirror-keymap": "^1.0.2",
+                "@types/prosemirror-menu": "^1.0.2",
+                "@types/prosemirror-model": "^1.7.0",
+                "@types/prosemirror-schema-list": "^1.0.1",
+                "@types/prosemirror-state": "^1.2.4",
+                "@types/prosemirror-transform": "^1.1.1",
+                "@types/prosemirror-view": "^1.11.2",
+                "@types/rc-switch": "^1.9.0",
+                "@types/react": "^16.9.41",
+                "@types/react-autosuggest": "^9.3.14",
+                "@types/react-color": "^2.17.4",
+                "@types/react-datepicker": "^3.0.2",
+                "@types/react-dom": "^16.9.8",
+                "@types/react-grid-layout": "^0.17.1",
+                "@types/react-measure": "^2.0.6",
+                "@types/react-select": "^3.0.13",
+                "@types/react-table": "^6.8.6",
+                "@types/request": "^2.48.5",
+                "@types/request-promise": "^4.1.45",
+                "@types/rimraf": "^2.0.3",
+                "@types/sharp": "^0.23.1",
+                "@types/shelljs": "^0.8.8",
+                "@types/socket.io": "^2.1.8",
+                "@types/socket.io-client": "^1.4.33",
+                "@types/typescript": "^2.0.0",
+                "@types/uuid": "^3.4.6",
+                "@types/valid-url": "^1.0.3",
+                "@types/webpack": "^4.41.27",
+                "@types/webpack-dev-middleware": "^2.0.7",
+                "@types/webpack-hot-middleware": "^2.25.4",
+                "@types/xregexp": "^4.3.0",
+                "@types/youtube": "0.0.39",
+                "awesome-typescript-loader": "^5.2.1",
+                "chai": "^4.2.0",
+                "copy-webpack-plugin": "^4.6.0",
+                "cross-env": "^5.2.1",
+                "css-loader": "^2.1.1",
+                "dotenv": "^8.2.0",
+                "file-loader": "^3.0.1",
+                "fork-ts-checker-webpack-plugin": "^1.6.0",
+                "jsdom": "^15.2.1",
+                "mocha": "^5.2.0",
+                "sass-loader": "^7.3.1",
+                "scss-loader": "0.0.1",
+                "style-loader": "^0.23.1",
+                "ts-loader": "^5.3.3",
+                "ts-node": "^7.0.1",
+                "ts-node-dev": "^1.0.0-pre.49",
+                "tslint": "^5.20.1",
+                "tslint-loader": "^3.6.0",
+                "typescript": "^3.9.9",
+                "webpack": "^4.46.0",
+                "webpack-cli": "^3.3.12",
+                "webpack-dev-middleware": "^3.7.3",
+                "webpack-dev-server": "^3.11.0",
+                "webpack-hot-middleware": "^2.24.3"
+            }
+        },
+        "node_modules/@babel/code-frame": {
+            "version": "7.8.3",
+            "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.8.3.tgz",
+            "integrity": "sha512-a9gxpmdXtZEInkCSHUJDLHZVBgb1QS0jhss4cPP93EW7s+uC5bikET2twEF3KV+7rDblJcmNvTR7VJejqd2C2g==",
+            "dependencies": {
+                "@babel/highlight": "^7.8.3"
+            }
+        },
+        "node_modules/@babel/generator": {
+            "version": "7.9.6",
+            "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.9.6.tgz",
+            "integrity": "sha512-+htwWKJbH2bL72HRluF8zumBxzuX0ZZUFl3JLNyoUjM/Ho8wnVpPXM6aUz8cfKDqQ/h7zHqKt4xzJteUosckqQ==",
+            "dependencies": {
+                "@babel/types": "^7.9.6",
+                "jsesc": "^2.5.1",
+                "lodash": "^4.17.13",
+                "source-map": "^0.5.0"
+            }
+        },
+        "node_modules/@babel/generator/node_modules/@babel/types": {
+            "version": "7.9.6",
+            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.9.6.tgz",
+            "integrity": "sha512-qxXzvBO//jO9ZnoasKF1uJzHd2+M6Q2ZPIVfnFps8JJvXy0ZBbwbNOmE6SGIY5XOY6d1Bo5lb9d9RJ8nv3WSeA==",
+            "dependencies": {
+                "@babel/helper-validator-identifier": "^7.9.5",
+                "lodash": "^4.17.13",
+                "to-fast-properties": "^2.0.0"
+            }
+        },
+        "node_modules/@babel/helper-annotate-as-pure": {
+            "version": "7.10.4",
+            "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.10.4.tgz",
+            "integrity": "sha512-XQlqKQP4vXFB7BN8fEEerrmYvHp3fK/rBkRFz9jaJbzK0B1DSfej9Kc7ZzE8Z/OnId1jpJdNAZ3BFQjWG68rcA==",
+            "dependencies": {
+                "@babel/types": "^7.10.4"
+            }
+        },
+        "node_modules/@babel/helper-annotate-as-pure/node_modules/@babel/helper-validator-identifier": {
+            "version": "7.10.4",
+            "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.10.4.tgz",
+            "integrity": "sha512-3U9y+43hz7ZM+rzG24Qe2mufW5KhvFg/NhnNph+i9mgCtdTCtMJuI1TMkrIUiK7Ix4PYlRF9I5dhqaLYA/ADXw=="
+        },
+        "node_modules/@babel/helper-annotate-as-pure/node_modules/@babel/types": {
+            "version": "7.10.5",
+            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.10.5.tgz",
+            "integrity": "sha512-ixV66KWfCI6GKoA/2H9v6bQdbfXEwwpOdQ8cRvb4F+eyvhlaHxWFMQB4+3d9QFJXZsiiiqVrewNV0DFEQpyT4Q==",
+            "dependencies": {
+                "@babel/helper-validator-identifier": "^7.10.4",
+                "lodash": "^4.17.19",
+                "to-fast-properties": "^2.0.0"
+            }
+        },
+        "node_modules/@babel/helper-annotate-as-pure/node_modules/lodash": {
+            "version": "4.17.19",
+            "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.19.tgz",
+            "integrity": "sha512-JNvd8XER9GQX0v2qJgsaN/mzFCNA5BRe/j8JN9d+tWyGLSodKQHKFicdwNYzWwI3wjRnaKPsGj1XkBjx/F96DQ=="
+        },
+        "node_modules/@babel/helper-function-name": {
+            "version": "7.9.5",
+            "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.9.5.tgz",
+            "integrity": "sha512-JVcQZeXM59Cd1qanDUxv9fgJpt3NeKUaqBqUEvfmQ+BCOKq2xUgaWZW2hr0dkbyJgezYuplEoh5knmrnS68efw==",
+            "dependencies": {
+                "@babel/helper-get-function-arity": "^7.8.3",
+                "@babel/template": "^7.8.3",
+                "@babel/types": "^7.9.5"
+            }
+        },
+        "node_modules/@babel/helper-get-function-arity": {
+            "version": "7.8.3",
+            "resolved": "https://registry.npmjs.org/@babel/helper-get-function-arity/-/helper-get-function-arity-7.8.3.tgz",
+            "integrity": "sha512-FVDR+Gd9iLjUMY1fzE2SR0IuaJToR4RkCDARVfsBBPSP53GEqSFjD8gNyxg246VUyc/ALRxFaAK8rVG7UT7xRA==",
+            "dependencies": {
+                "@babel/types": "^7.8.3"
+            }
+        },
+        "node_modules/@babel/helper-module-imports": {
+            "version": "7.10.3",
+            "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.10.3.tgz",
+            "integrity": "sha512-Jtqw5M9pahLSUWA+76nhK9OG8nwYXzhQzVIGFoNaHnXF/r4l7kz4Fl0UAW7B6mqC5myoJiBP5/YQlXQTMfHI9w==",
+            "dependencies": {
+                "@babel/types": "^7.10.3"
+            }
+        },
+        "node_modules/@babel/helper-module-imports/node_modules/@babel/helper-validator-identifier": {
+            "version": "7.10.3",
+            "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.10.3.tgz",
+            "integrity": "sha512-bU8JvtlYpJSBPuj1VUmKpFGaDZuLxASky3LhaKj3bmpSTY6VWooSM8msk+Z0CZoErFye2tlABF6yDkT3FOPAXw=="
+        },
+        "node_modules/@babel/helper-module-imports/node_modules/@babel/types": {
+            "version": "7.10.3",
+            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.10.3.tgz",
+            "integrity": "sha512-nZxaJhBXBQ8HVoIcGsf9qWep3Oh3jCENK54V4mRF7qaJabVsAYdbTtmSD8WmAp1R6ytPiu5apMwSXyxB1WlaBA==",
+            "dependencies": {
+                "@babel/helper-validator-identifier": "^7.10.3",
+                "lodash": "^4.17.13",
+                "to-fast-properties": "^2.0.0"
+            }
+        },
+        "node_modules/@babel/helper-split-export-declaration": {
+            "version": "7.8.3",
+            "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.8.3.tgz",
+            "integrity": "sha512-3x3yOeyBhW851hroze7ElzdkeRXQYQbFIb7gLK1WQYsw2GWDay5gAJNw1sWJ0VFP6z5J1whqeXH/WCdCjZv6dA==",
+            "dependencies": {
+                "@babel/types": "^7.8.3"
+            }
+        },
+        "node_modules/@babel/helper-validator-identifier": {
+            "version": "7.9.5",
+            "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.9.5.tgz",
+            "integrity": "sha512-/8arLKUFq882w4tWGj9JYzRpAlZgiWUJ+dtteNTDqrRBz9Iguck9Rn3ykuBDoUwh2TO4tSAJlrxDUOXWklJe4g=="
+        },
+        "node_modules/@babel/highlight": {
+            "version": "7.9.0",
+            "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.9.0.tgz",
+            "integrity": "sha512-lJZPilxX7Op3Nv/2cvFdnlepPXDxi29wxteT57Q965oc5R9v86ztx0jfxVrTcBk8C2kcPkkDa2Z4T3ZsPPVWsQ==",
+            "dependencies": {
+                "@babel/helper-validator-identifier": "^7.9.0",
+                "chalk": "^2.0.0",
+                "js-tokens": "^4.0.0"
+            }
+        },
+        "node_modules/@babel/parser": {
+            "version": "7.9.6",
+            "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.9.6.tgz",
+            "integrity": "sha512-AoeIEJn8vt+d/6+PXDRPaksYhnlbMIiejioBZvvMQsOjW/JYK6k/0dKnvvP3EhK5GfMBWDPtrxRtegWdAcdq9Q==",
+            "bin": {
+                "parser": "bin/babel-parser.js"
+            },
+            "engines": {
+                "node": ">=6.0.0"
+            }
+        },
+        "node_modules/@babel/runtime": {
+            "version": "7.9.2",
+            "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.9.2.tgz",
+            "integrity": "sha512-NE2DtOdufG7R5vnfQUTehdTfNycfUANEtCa9PssN9O/xmTzP4E08UI797ixaei6hBEVL9BI/PsdJS5x7mWoB9Q==",
+            "dependencies": {
+                "regenerator-runtime": "^0.13.4"
+            }
+        },
+        "node_modules/@babel/runtime-corejs3": {
+            "version": "7.9.2",
+            "resolved": "https://registry.npmjs.org/@babel/runtime-corejs3/-/runtime-corejs3-7.9.2.tgz",
+            "integrity": "sha512-HHxmgxbIzOfFlZ+tdeRKtaxWOMUoCG5Mu3wKeUmOxjYrwb3AAHgnmtCUbPPK11/raIWLIBK250t8E2BPO0p7jA==",
+            "dependencies": {
+                "core-js-pure": "^3.0.0",
+                "regenerator-runtime": "^0.13.4"
+            }
+        },
+        "node_modules/@babel/template": {
+            "version": "7.8.6",
+            "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.8.6.tgz",
+            "integrity": "sha512-zbMsPMy/v0PWFZEhQJ66bqjhH+z0JgMoBWuikXybgG3Gkd/3t5oQ1Rw2WQhnSrsOmsKXnZOx15tkC4qON/+JPg==",
+            "dependencies": {
+                "@babel/code-frame": "^7.8.3",
+                "@babel/parser": "^7.8.6",
+                "@babel/types": "^7.8.6"
+            }
+        },
+        "node_modules/@babel/traverse": {
+            "version": "7.9.6",
+            "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.9.6.tgz",
+            "integrity": "sha512-b3rAHSjbxy6VEAvlxM8OV/0X4XrG72zoxme6q1MOoe2vd0bEc+TwayhuC1+Dfgqh1QEG+pj7atQqvUprHIccsg==",
+            "dependencies": {
+                "@babel/code-frame": "^7.8.3",
+                "@babel/generator": "^7.9.6",
+                "@babel/helper-function-name": "^7.9.5",
+                "@babel/helper-split-export-declaration": "^7.8.3",
+                "@babel/parser": "^7.9.6",
+                "@babel/types": "^7.9.6",
+                "debug": "^4.1.0",
+                "globals": "^11.1.0",
+                "lodash": "^4.17.13"
+            }
+        },
+        "node_modules/@babel/traverse/node_modules/@babel/types": {
+            "version": "7.9.6",
+            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.9.6.tgz",
+            "integrity": "sha512-qxXzvBO//jO9ZnoasKF1uJzHd2+M6Q2ZPIVfnFps8JJvXy0ZBbwbNOmE6SGIY5XOY6d1Bo5lb9d9RJ8nv3WSeA==",
+            "dependencies": {
+                "@babel/helper-validator-identifier": "^7.9.5",
+                "lodash": "^4.17.13",
+                "to-fast-properties": "^2.0.0"
+            }
+        },
+        "node_modules/@babel/traverse/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/@babel/types": {
+            "version": "7.9.5",
+            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.9.5.tgz",
+            "integrity": "sha512-XjnvNqenk818r5zMaba+sLQjnbda31UfUURv3ei0qPQw4u+j2jMyJ5b11y8ZHYTRSI3NnInQkkkRT4fLqqPdHg==",
+            "dependencies": {
+                "@babel/helper-validator-identifier": "^7.9.5",
+                "lodash": "^4.17.13",
+                "to-fast-properties": "^2.0.0"
+            }
+        },
+        "node_modules/@emotion/cache": {
+            "version": "10.0.29",
+            "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-10.0.29.tgz",
+            "integrity": "sha512-fU2VtSVlHiF27empSbxi1O2JFdNWZO+2NFHfwO0pxgTep6Xa3uGb+3pVKfLww2l/IBGLNEZl5Xf/++A4wAYDYQ==",
+            "dependencies": {
+                "@emotion/sheet": "0.9.4",
+                "@emotion/stylis": "0.8.5",
+                "@emotion/utils": "0.11.3",
+                "@emotion/weak-memoize": "0.2.5"
+            }
+        },
+        "node_modules/@emotion/core": {
+            "version": "10.0.28",
+            "resolved": "https://registry.npmjs.org/@emotion/core/-/core-10.0.28.tgz",
+            "integrity": "sha512-pH8UueKYO5jgg0Iq+AmCLxBsvuGtvlmiDCOuv8fGNYn3cowFpLN98L8zO56U0H1PjDIyAlXymgL3Wu7u7v6hbA==",
+            "dependencies": {
+                "@babel/runtime": "^7.5.5",
+                "@emotion/cache": "^10.0.27",
+                "@emotion/css": "^10.0.27",
+                "@emotion/serialize": "^0.11.15",
+                "@emotion/sheet": "0.9.4",
+                "@emotion/utils": "0.11.3"
+            }
+        },
+        "node_modules/@emotion/css": {
+            "version": "10.0.27",
+            "resolved": "https://registry.npmjs.org/@emotion/css/-/css-10.0.27.tgz",
+            "integrity": "sha512-6wZjsvYeBhyZQYNrGoR5yPMYbMBNEnanDrqmsqS1mzDm1cOTu12shvl2j4QHNS36UaTE0USIJawCH9C8oW34Zw==",
+            "dependencies": {
+                "@emotion/serialize": "^0.11.15",
+                "@emotion/utils": "0.11.3",
+                "babel-plugin-emotion": "^10.0.27"
+            }
+        },
+        "node_modules/@emotion/hash": {
+            "version": "0.8.0",
+            "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz",
+            "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow=="
+        },
+        "node_modules/@emotion/is-prop-valid": {
+            "version": "0.8.8",
+            "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz",
+            "integrity": "sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==",
+            "dependencies": {
+                "@emotion/memoize": "0.7.4"
+            }
+        },
+        "node_modules/@emotion/memoize": {
+            "version": "0.7.4",
+            "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz",
+            "integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw=="
+        },
+        "node_modules/@emotion/serialize": {
+            "version": "0.11.16",
+            "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-0.11.16.tgz",
+            "integrity": "sha512-G3J4o8by0VRrO+PFeSc3js2myYNOXVJ3Ya+RGVxnshRYgsvErfAOglKAiy1Eo1vhzxqtUvjCyS5gtewzkmvSSg==",
+            "dependencies": {
+                "@emotion/hash": "0.8.0",
+                "@emotion/memoize": "0.7.4",
+                "@emotion/unitless": "0.7.5",
+                "@emotion/utils": "0.11.3",
+                "csstype": "^2.5.7"
+            }
+        },
+        "node_modules/@emotion/sheet": {
+            "version": "0.9.4",
+            "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-0.9.4.tgz",
+            "integrity": "sha512-zM9PFmgVSqBw4zL101Q0HrBVTGmpAxFZH/pYx/cjJT5advXguvcgjHFTCaIO3enL/xr89vK2bh0Mfyj9aa0ANA=="
+        },
+        "node_modules/@emotion/styled": {
+            "version": "10.0.27",
+            "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-10.0.27.tgz",
+            "integrity": "sha512-iK/8Sh7+NLJzyp9a5+vIQIXTYxfT4yB/OJbjzQanB2RZpvmzBQOHZWhpAMZWYEKRNNbsD6WfBw5sVWkb6WzS/Q==",
+            "dependencies": {
+                "@emotion/styled-base": "^10.0.27",
+                "babel-plugin-emotion": "^10.0.27"
+            }
+        },
+        "node_modules/@emotion/styled-base": {
+            "version": "10.0.31",
+            "resolved": "https://registry.npmjs.org/@emotion/styled-base/-/styled-base-10.0.31.tgz",
+            "integrity": "sha512-wTOE1NcXmqMWlyrtwdkqg87Mu6Rj1MaukEoEmEkHirO5IoHDJ8LgCQL4MjJODgxWxXibGR3opGp1p7YvkNEdXQ==",
+            "dependencies": {
+                "@babel/runtime": "^7.5.5",
+                "@emotion/is-prop-valid": "0.8.8",
+                "@emotion/serialize": "^0.11.15",
+                "@emotion/utils": "0.11.3"
+            }
+        },
+        "node_modules/@emotion/stylis": {
+            "version": "0.8.5",
+            "resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.8.5.tgz",
+            "integrity": "sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ=="
+        },
+        "node_modules/@emotion/unitless": {
+            "version": "0.7.5",
+            "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz",
+            "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg=="
+        },
+        "node_modules/@emotion/utils": {
+            "version": "0.11.3",
+            "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-0.11.3.tgz",
+            "integrity": "sha512-0o4l6pZC+hI88+bzuaX/6BgOvQVhbt2PfmxauVaYOGgbsAw14wdKyvMCZXnsnsHys94iadcF+RG/wZyx6+ZZBw=="
+        },
+        "node_modules/@emotion/weak-memoize": {
+            "version": "0.2.5",
+            "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz",
+            "integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA=="
+        },
+        "node_modules/@fortawesome/fontawesome-common-types": {
+            "version": "0.2.29",
+            "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.29.tgz",
+            "integrity": "sha512-cY+QfDTbZ7XVxzx7jxbC98Oxr/zc7R2QpTLqTxqlfyXDrAJjzi/xUIqAUsygELB62JIrbsWxtSRhayKFkGI7MA==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/@fortawesome/fontawesome-svg-core": {
+            "version": "1.2.29",
+            "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.29.tgz",
+            "integrity": "sha512-xmPmP2t8qrdo8RyKihTkGb09RnZoc+7HFBCnr0/6ZhStdGDSLeEd7ajV181+2W29NWIFfylO13rU+s3fpy3cnA==",
+            "dependencies": {
+                "@fortawesome/fontawesome-common-types": "^0.2.29"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/@fortawesome/free-brands-svg-icons": {
+            "version": "5.14.0",
+            "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-5.14.0.tgz",
+            "integrity": "sha512-WsqPFTvJFI7MYkcy0jeFE2zY+blC4OrnB9MJOcn1NxRXT/sSfEEhrI7CwzIkiYajLiVDBKWeErYOvpsMeodmCQ==",
+            "dependencies": {
+                "@fortawesome/fontawesome-common-types": "^0.2.30"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/@fortawesome/free-brands-svg-icons/node_modules/@fortawesome/fontawesome-common-types": {
+            "version": "0.2.30",
+            "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.30.tgz",
+            "integrity": "sha512-TsRwpTuKwFNiPhk1UfKgw7zNPeV5RhNp2Uw3pws+9gDAkPGKrtjR1y2lI3SYn7+YzyfuNknflpBA1LRKjt7hMg==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/@fortawesome/free-regular-svg-icons": {
+            "version": "5.13.1",
+            "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-5.13.1.tgz",
+            "integrity": "sha512-sSeaqqmv2ovA5LKcrbh3VnEDZHVhaxijWKm4R0AdT0eG21pgxNsJbStD8lW9z6bgSuWXRNHhbhOmARuRCLS8tw==",
+            "dependencies": {
+                "@fortawesome/fontawesome-common-types": "^0.2.29"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/@fortawesome/free-solid-svg-icons": {
+            "version": "5.13.1",
+            "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.13.1.tgz",
+            "integrity": "sha512-LQH/0L1p4+rqtoSHa9qFYR84hpuRZKqaQ41cfBQx8b68p21zoWSekTAeA54I/2x9VlCHDLFlG74Nmdg4iTPQOg==",
+            "dependencies": {
+                "@fortawesome/fontawesome-common-types": "^0.2.29"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/@fortawesome/react-fontawesome": {
+            "version": "0.1.11",
+            "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.1.11.tgz",
+            "integrity": "sha512-sClfojasRifQKI0OPqTy8Ln8iIhnxR/Pv/hukBhWnBz9kQRmqi6JSH3nghlhAY7SUeIIM7B5/D2G8WjX0iepVg==",
+            "dependencies": {
+                "prop-types": "^15.7.2"
+            }
+        },
+        "node_modules/@hig/flyout": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/@hig/flyout/-/flyout-1.2.1.tgz",
+            "integrity": "sha512-oNybmhStyMmEC07DPsjMZg4Dgm65X7Jcp2nDFR9zZghVof/1C3WJtJvdouVgqx7BJw2IedVj8CUGoPuoll/0IQ==",
+            "dependencies": {
+                "@hig/utils": "^0.4.0",
+                "emotion": "^10.0.0",
+                "prop-types": "^15.7.1",
+                "react-transition-group": "^2.3.1"
+            }
+        },
+        "node_modules/@hig/theme-context": {
+            "version": "2.1.3",
+            "resolved": "https://registry.npmjs.org/@hig/theme-context/-/theme-context-2.1.3.tgz",
+            "integrity": "sha512-c0Ju+Z8C532ZZtjwOLzN+XeO+pL3kqUawu6ZG3J084MH5RM9W8JCKyMf4D9Qr38jFWoiX6u8yiSxxjV/mz9Sqw==",
+            "dependencies": {
+                "create-react-context": "^0.2.3",
+                "prop-types": "^15.6.1"
+            }
+        },
+        "node_modules/@hig/theme-data": {
+            "version": "2.16.1",
+            "resolved": "https://registry.npmjs.org/@hig/theme-data/-/theme-data-2.16.1.tgz",
+            "integrity": "sha512-3nBnzRqYyc6ejoCgA+zBjQGqe6LAXlcemTs0257E5bWu/JyZe8YyOLN+psq2zyjF+FUk35p38wWNPyaOcPnhvw==",
+            "dependencies": {
+                "tinycolor2": "^1.4.1"
+            }
+        },
+        "node_modules/@hig/utils": {
+            "version": "0.4.0",
+            "resolved": "https://registry.npmjs.org/@hig/utils/-/utils-0.4.0.tgz",
+            "integrity": "sha512-EQnMGZKdPh9UJaBUKLKXp92sSoCo+PTpgrGNd8q+71uRFdD0udMu/+yeVekTEtNOJcCk1gnKfyg1rRvIbTcpRw==",
+            "dependencies": {
+                "emotion": "^10.0.0",
+                "lodash.memoize": "^4.1.2"
+            }
+        },
+        "node_modules/@icons/material": {
+            "version": "0.2.4",
+            "resolved": "https://registry.npmjs.org/@icons/material/-/material-0.2.4.tgz",
+            "integrity": "sha512-QPcGmICAPbGLGb6F/yNf/KzKqvFx8z5qx3D1yFqVAjoFmXK35EgyW+cJ57Te3CNsmzblwtzakLGFqHPqrfb4Tw=="
+        },
+        "node_modules/@log4js-node/log4js-api": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/@log4js-node/log4js-api/-/log4js-api-1.0.2.tgz",
+            "integrity": "sha512-6SJfx949YEWooh/CUPpJ+F491y4BYJmknz4hUN1+RHvKoUEynKbRmhnwbk/VLmh4OthLLDNCyWXfbh4DG1cTXA=="
+        },
+        "node_modules/@material-ui/core": {
+            "version": "4.11.0",
+            "resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.11.0.tgz",
+            "integrity": "sha512-bYo9uIub8wGhZySHqLQ833zi4ZML+XCBE1XwJ8EuUVSpTWWG57Pm+YugQToJNFsEyiKFhPh8DPD0bgupz8n01g==",
+            "dependencies": {
+                "@babel/runtime": "^7.4.4",
+                "@material-ui/styles": "^4.10.0",
+                "@material-ui/system": "^4.9.14",
+                "@material-ui/types": "^5.1.0",
+                "@material-ui/utils": "^4.10.2",
+                "@types/react-transition-group": "^4.2.0",
+                "clsx": "^1.0.4",
+                "hoist-non-react-statics": "^3.3.2",
+                "popper.js": "1.16.1-lts",
+                "prop-types": "^15.7.2",
+                "react-is": "^16.8.0",
+                "react-transition-group": "^4.4.0"
+            },
+            "engines": {
+                "node": ">=8.0.0"
+            }
+        },
+        "node_modules/@material-ui/core/node_modules/dom-helpers": {
+            "version": "5.1.4",
+            "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.1.4.tgz",
+            "integrity": "sha512-TjMyeVUvNEnOnhzs6uAn9Ya47GmMo3qq7m+Lr/3ON0Rs5kHvb8I+SQYjLUSYn7qhEm0QjW0yrBkvz9yOrwwz1A==",
+            "dependencies": {
+                "@babel/runtime": "^7.8.7",
+                "csstype": "^2.6.7"
+            }
+        },
+        "node_modules/@material-ui/core/node_modules/popper.js": {
+            "version": "1.16.1-lts",
+            "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz",
+            "integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA=="
+        },
+        "node_modules/@material-ui/core/node_modules/react-transition-group": {
+            "version": "4.4.1",
+            "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.1.tgz",
+            "integrity": "sha512-Djqr7OQ2aPUiYurhPalTrVy9ddmFCCzwhqQmtN+J3+3DzLO209Fdr70QrN8Z3DsglWql6iY1lDWAfpFiBtuKGw==",
+            "dependencies": {
+                "@babel/runtime": "^7.5.5",
+                "dom-helpers": "^5.0.1",
+                "loose-envify": "^1.4.0",
+                "prop-types": "^15.6.2"
+            }
+        },
+        "node_modules/@material-ui/styles": {
+            "version": "4.10.0",
+            "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.10.0.tgz",
+            "integrity": "sha512-XPwiVTpd3rlnbfrgtEJ1eJJdFCXZkHxy8TrdieaTvwxNYj42VnnCyFzxYeNW9Lhj4V1oD8YtQ6S5Gie7bZDf7Q==",
+            "dependencies": {
+                "@babel/runtime": "^7.4.4",
+                "@emotion/hash": "^0.8.0",
+                "@material-ui/types": "^5.1.0",
+                "@material-ui/utils": "^4.9.6",
+                "clsx": "^1.0.4",
+                "csstype": "^2.5.2",
+                "hoist-non-react-statics": "^3.3.2",
+                "jss": "^10.0.3",
+                "jss-plugin-camel-case": "^10.0.3",
+                "jss-plugin-default-unit": "^10.0.3",
+                "jss-plugin-global": "^10.0.3",
+                "jss-plugin-nested": "^10.0.3",
+                "jss-plugin-props-sort": "^10.0.3",
+                "jss-plugin-rule-value-function": "^10.0.3",
+                "jss-plugin-vendor-prefixer": "^10.0.3",
+                "prop-types": "^15.7.2"
+            },
+            "engines": {
+                "node": ">=8.0.0"
+            }
+        },
+        "node_modules/@material-ui/system": {
+            "version": "4.9.14",
+            "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.9.14.tgz",
+            "integrity": "sha512-oQbaqfSnNlEkXEziDcJDDIy8pbvwUmZXWNqlmIwDqr/ZdCK8FuV3f4nxikUh7hvClKV2gnQ9djh5CZFTHkZj3w==",
+            "dependencies": {
+                "@babel/runtime": "^7.4.4",
+                "@material-ui/utils": "^4.9.6",
+                "csstype": "^2.5.2",
+                "prop-types": "^15.7.2"
+            },
+            "engines": {
+                "node": ">=8.0.0"
+            }
+        },
+        "node_modules/@material-ui/types": {
+            "version": "5.1.0",
+            "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz",
+            "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A=="
+        },
+        "node_modules/@material-ui/utils": {
+            "version": "4.10.2",
+            "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.10.2.tgz",
+            "integrity": "sha512-eg29v74P7W5r6a4tWWDAAfZldXIzfyO1am2fIsC39hdUUHm/33k6pGOKPbgDjg/U/4ifmgAePy/1OjkKN6rFRw==",
+            "dependencies": {
+                "@babel/runtime": "^7.4.4",
+                "prop-types": "^15.7.2",
+                "react-is": "^16.8.0"
+            },
+            "engines": {
+                "node": ">=8.0.0"
+            }
+        },
+        "node_modules/@react-three/fiber": {
+            "version": "6.0.16",
+            "resolved": "https://registry.npmjs.org/@react-three/fiber/-/fiber-6.0.16.tgz",
+            "integrity": "sha512-oKMYNJOd5t+V4o18aRMhaRhcDQ1NeeCDy52yJvXpu7zrsR04YZtXD4RacW0FDH0KnwkOLDst95LCCphm3Thk/A==",
+            "dependencies": {
+                "@babel/runtime": "^7.13.10",
+                "react-merge-refs": "^1.1.0",
+                "react-reconciler": "^0.26.2",
+                "react-three-fiber": "0.0.0-deprecated",
+                "react-use-measure": "^2.0.4",
+                "resize-observer-polyfill": "^1.5.1",
+                "scheduler": "^0.20.2",
+                "use-asset": "^1.0.4",
+                "utility-types": "^3.10.0",
+                "zustand": "^3.3.3"
+            }
+        },
+        "node_modules/@react-three/fiber/node_modules/@babel/runtime": {
+            "version": "7.13.17",
+            "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.13.17.tgz",
+            "integrity": "sha512-NCdgJEelPTSh+FEFylhnP1ylq848l1z9t9N0j1Lfbcw0+KXGjsTvUmkxy+voLLXB5SOKMbLLx4jxYliGrYQseA==",
+            "dependencies": {
+                "regenerator-runtime": "^0.13.4"
+            }
+        },
+        "node_modules/@react-three/fiber/node_modules/scheduler": {
+            "version": "0.20.2",
+            "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
+            "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
+            "dependencies": {
+                "loose-envify": "^1.1.0",
+                "object-assign": "^4.1.1"
+            }
+        },
+        "node_modules/@rkusa/linebreak": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/@rkusa/linebreak/-/linebreak-1.0.0.tgz",
+            "integrity": "sha512-yCSm87XA1aYMgfcABSxcIkk3JtCw3AihNceHY+DnZGLvVP/g2z3UWZbi0xIoYpZWAJEVPr5Zt3QE37Q80wF1pA==",
+            "dependencies": {
+                "unicode-trie": "^0.3.0"
+            }
+        },
+        "node_modules/@types/adm-zip": {
+            "version": "0.4.33",
+            "resolved": "https://registry.npmjs.org/@types/adm-zip/-/adm-zip-0.4.33.tgz",
+            "integrity": "sha512-WM0DCWFLjXtddl0fu0+iN2ZF+qz8RF9RddG5OSy/S90AQz01Fu8lHn/3oTIZDxvG8gVcnBLAHMHOdBLbV6m6Mw==",
+            "dev": true,
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/animejs": {
+            "version": "2.0.2",
+            "resolved": "https://registry.npmjs.org/@types/animejs/-/animejs-2.0.2.tgz",
+            "integrity": "sha512-ACymFQ5qgSrZNR1Fqjk7Wv9gH6dFgejn2gpLkkceWxTKzivRJsshX4xhBVALgvF79gUdXiMCRIdusN728XpeGA==",
+            "dev": true
+        },
+        "node_modules/@types/anymatch": {
+            "version": "1.3.1",
+            "resolved": "https://registry.npmjs.org/@types/anymatch/-/anymatch-1.3.1.tgz",
+            "integrity": "sha512-/+CRPXpBDpo2RK9C68N3b2cOvO0Cf5B9aPijHsoDQTHivnGSObdOF2BRQOYjojWTDy6nQvMjmqRXIxH55VjxxA==",
+            "dev": true
+        },
+        "node_modules/@types/archiver": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/@types/archiver/-/archiver-3.1.0.tgz",
+            "integrity": "sha512-nTvHwgWONL+iXG+9CX+gnQ/tTOV+qucAjwpXqeUn4OCRMxP42T29FFP/7XaOo0EqqO3TlENhObeZEe7RUJAriw==",
+            "dev": true,
+            "dependencies": {
+                "@types/glob": "*"
+            }
+        },
+        "node_modules/@types/assert": {
+            "version": "1.5.4",
+            "resolved": "https://registry.npmjs.org/@types/assert/-/assert-1.5.4.tgz",
+            "integrity": "sha512-CaFVW21Ulu0J9sUaEWJjwmhkDkeoxa4fniVSERzZC13sU9v8NNM2lMlkfZZv60j47D+qDt0Lyo8skVP3CTXUdA=="
+        },
+        "node_modules/@types/async": {
+            "version": "2.4.2",
+            "resolved": "https://registry.npmjs.org/@types/async/-/async-2.4.2.tgz",
+            "integrity": "sha512-bWBbC7VG2jdjbgZMX0qpds8U/3h3anfIqE81L8jmVrgFZw/urEDnBA78ymGGKTTK6ciBXmmJ/xlok+Re41S8ww==",
+            "dev": true
+        },
+        "node_modules/@types/babel-types": {
+            "version": "7.0.7",
+            "resolved": "https://registry.npmjs.org/@types/babel-types/-/babel-types-7.0.7.tgz",
+            "integrity": "sha512-dBtBbrc+qTHy1WdfHYjBwRln4+LWqASWakLHsWHR2NWHIFkv4W3O070IGoGLEBrJBvct3r0L1BUPuvURi7kYUQ=="
+        },
+        "node_modules/@types/babylon": {
+            "version": "6.16.5",
+            "resolved": "https://registry.npmjs.org/@types/babylon/-/babylon-6.16.5.tgz",
+            "integrity": "sha512-xH2e58elpj1X4ynnKp9qSnWlsRTIs6n3tgLGNfwAGHwePw0mulHQllV34n0T25uYSu1k0hRKkWXF890B1yS47w==",
+            "dependencies": {
+                "@types/babel-types": "*"
+            }
+        },
+        "node_modules/@types/bcrypt-nodejs": {
+            "version": "0.0.30",
+            "resolved": "https://registry.npmjs.org/@types/bcrypt-nodejs/-/bcrypt-nodejs-0.0.30.tgz",
+            "integrity": "sha1-TN2WtJKTs5MhIuS34pVD415rrlg=",
+            "dev": true
+        },
+        "node_modules/@types/bluebird": {
+            "version": "3.5.32",
+            "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.32.tgz",
+            "integrity": "sha512-dIOxFfI0C+jz89g6lQ+TqhGgPQ0MxSnh/E4xuC0blhFtyW269+mPG5QeLgbdwst/LvdP8o1y0o/Gz5EHXLec/g==",
+            "dev": true
+        },
+        "node_modules/@types/body-parser": {
+            "version": "1.19.0",
+            "resolved": "https://registry.npmjs.org/@types/body-parser/-/body-parser-1.19.0.tgz",
+            "integrity": "sha512-W98JrE0j2K78swW4ukqMleo8R7h/pFETjM2DQ90MF6XK2i4LO4W3gQ71Lt4w3bfm2EvVSyWHplECvB5sK22yFQ==",
+            "dependencies": {
+                "@types/connect": "*",
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/bson": {
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/@types/bson/-/bson-4.0.2.tgz",
+            "integrity": "sha512-+uWmsejEHfmSjyyM/LkrP0orfE2m5Mx9Xel4tXNeqi1ldK5XMQcDsFkBmLDtuyKUbxj2jGDo0H240fbCRJZo7Q==",
+            "dev": true,
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/caseless": {
+            "version": "0.12.2",
+            "resolved": "https://registry.npmjs.org/@types/caseless/-/caseless-0.12.2.tgz",
+            "integrity": "sha512-6ckxMjBBD8URvjB6J3NcnuAn5Pkl7t3TizAg+xdlzzQGSPSmBcXf8KoIH0ua/i+tio+ZRUHEXp0HEmvaR4kt0w==",
+            "dev": true
+        },
+        "node_modules/@types/chai": {
+            "version": "4.2.11",
+            "resolved": "https://registry.npmjs.org/@types/chai/-/chai-4.2.11.tgz",
+            "integrity": "sha512-t7uW6eFafjO+qJ3BIV2gGUyZs27egcNRkUdalkud+Qa3+kg//f129iuOFivHDXQ+vnU3fDXuwgv0cqMCbcE8sw==",
+            "dev": true
+        },
+        "node_modules/@types/color": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/@types/color/-/color-3.0.1.tgz",
+            "integrity": "sha512-oeUWVaAwI+xINDUx+3F2vJkl/vVB03VChFF/Gl3iQCdbcakjuoJyMOba+3BXRtnBhxZ7uBYqQBi9EpLnvSoztA==",
+            "dev": true,
+            "dependencies": {
+                "@types/color-convert": "*"
+            }
+        },
+        "node_modules/@types/color-convert": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@types/color-convert/-/color-convert-1.9.0.tgz",
+            "integrity": "sha512-OKGEfULrvSL2VRbkl/gnjjgbbF7ycIlpSsX7Nkab4MOWi5XxmgBYvuiQ7lcCFY5cPDz7MUNaKgxte2VRmtr4Fg==",
+            "dev": true,
+            "dependencies": {
+                "@types/color-name": "*"
+            }
+        },
+        "node_modules/@types/color-name": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/@types/color-name/-/color-name-1.1.1.tgz",
+            "integrity": "sha512-rr+OQyAjxze7GgWrSaJwydHStIhHq2lvY3BOC2Mj7KnzI7XK0Uw1TOOdI9lDoajEbSWLiYgoo4f1R51erQfhPQ=="
+        },
+        "node_modules/@types/connect": {
+            "version": "3.4.33",
+            "resolved": "https://registry.npmjs.org/@types/connect/-/connect-3.4.33.tgz",
+            "integrity": "sha512-2+FrkXY4zllzTNfJth7jOqEHC+enpLeGslEhpnTAkg21GkRrWV4SsAtqchtT4YS9/nODBU2/ZfsBY2X4J/dX7A==",
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/connect-flash": {
+            "version": "0.0.34",
+            "resolved": "https://registry.npmjs.org/@types/connect-flash/-/connect-flash-0.0.34.tgz",
+            "integrity": "sha512-QC93TwnTZ0sk//bfT81o7U4GOedbOZAcgvqi0v1vJqCESC8tqIVnhzB1CHiAUBUWFjoxG5JQF0TYaNa6DMb6Ig==",
+            "dev": true,
+            "dependencies": {
+                "@types/express": "*"
+            }
+        },
+        "node_modules/@types/cookie-parser": {
+            "version": "1.4.2",
+            "resolved": "https://registry.npmjs.org/@types/cookie-parser/-/cookie-parser-1.4.2.tgz",
+            "integrity": "sha512-uwcY8m6SDQqciHsqcKDGbo10GdasYsPCYkH3hVegj9qAah6pX5HivOnOuI3WYmyQMnOATV39zv/Ybs0bC/6iVg==",
+            "dev": true,
+            "dependencies": {
+                "@types/express": "*"
+            }
+        },
+        "node_modules/@types/cookie-session": {
+            "version": "2.0.41",
+            "resolved": "https://registry.npmjs.org/@types/cookie-session/-/cookie-session-2.0.41.tgz",
+            "integrity": "sha512-Ytd7zWY3WvC7TP9rKVjlnYHus8Hq+lJuioHOtKJ7dXg2Nt+O+9UpelygYy5Eb67QQN92HPO5qEG0vnmAlqRLLw==",
+            "dev": true,
+            "dependencies": {
+                "@types/express": "*",
+                "@types/keygrip": "*"
+            }
+        },
+        "node_modules/@types/cors": {
+            "version": "2.8.8",
+            "resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.8.tgz",
+            "integrity": "sha512-fO3gf3DxU2Trcbr75O7obVndW/X5k8rJNZkLXlQWStTHhP71PkRqjwPIEI0yMnJdg9R9OasjU+Bsr+Hr1xy/0w==",
+            "dependencies": {
+                "@types/express": "*"
+            }
+        },
+        "node_modules/@types/d3-axis": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/@types/d3-axis/-/d3-axis-2.0.0.tgz",
+            "integrity": "sha512-gUdlEwGBLl3tXGiBnBNmNzph9W3bCfa4tBgWZD60Z1eDQKTY4zyCAcZ3LksignGfKawYatmDYcBdjJ5h/54sqA==",
+            "dependencies": {
+                "@types/d3-selection": "*"
+            }
+        },
+        "node_modules/@types/d3-color": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/@types/d3-color/-/d3-color-2.0.1.tgz",
+            "integrity": "sha512-u7LTCL7RnaavFSmob2rIAJLNwu50i6gFwY9cHFr80BrQURYQBRkJ+Yv47nA3Fm7FeRhdWTiVTeqvSeOuMAOzBQ=="
+        },
+        "node_modules/@types/d3-scale": {
+            "version": "3.2.2",
+            "resolved": "https://registry.npmjs.org/@types/d3-scale/-/d3-scale-3.2.2.tgz",
+            "integrity": "sha512-qpQe8G02tzUwt9sdWX1h8A/W0Q1+N48wMnYXVOkrzeLUkCfvzJYV9Ee3aORCS4dN4ONRLFmMvaXdziQ29XGLjQ==",
+            "dependencies": {
+                "@types/d3-time": "*"
+            }
+        },
+        "node_modules/@types/d3-selection": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/@types/d3-selection/-/d3-selection-2.0.0.tgz",
+            "integrity": "sha512-EF0lWZ4tg7oDFg4YQFlbOU3936e3a9UmoQ2IXlBy1+cv2c2Pv7knhKUzGlH5Hq2sF/KeDTH1amiRPey2rrLMQA=="
+        },
+        "node_modules/@types/d3-time": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/@types/d3-time/-/d3-time-2.0.0.tgz",
+            "integrity": "sha512-Abz8bTzy8UWDeYs9pCa3D37i29EWDjNTjemdk0ei1ApYVNqulYlGUKip/jLOpogkPSsPz/GvZCYiC7MFlEk0iQ=="
+        },
+        "node_modules/@types/dotenv": {
+            "version": "6.1.1",
+            "resolved": "https://registry.npmjs.org/@types/dotenv/-/dotenv-6.1.1.tgz",
+            "integrity": "sha512-ftQl3DtBvqHl9L16tpqqzA4YzCSXZfi7g8cQceTz5rOlYtk/IZbFjAv3mLOQlNIgOaylCQWQoBdDQHPgEBJPHg==",
+            "dev": true,
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/engine.io": {
+            "version": "3.1.4",
+            "resolved": "https://registry.npmjs.org/@types/engine.io/-/engine.io-3.1.4.tgz",
+            "integrity": "sha512-98rXVukLD6/ozrQ2O80NAlWDGA4INg+tqsEReWJldqyi2fulC9V7Use/n28SWgROXKm6003ycWV4gZHoF8GA6w==",
+            "dev": true,
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/events": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/@types/events/-/events-3.0.0.tgz",
+            "integrity": "sha512-EaObqwIvayI5a8dCzhFrjKzVwKLxjoG9T6Ppd5CEo07LRKfQ8Yokw54r5+Wq7FaBQ+yXRvQAYPrHwya1/UFt9g==",
+            "dev": true
+        },
+        "node_modules/@types/exif": {
+            "version": "0.6.1",
+            "resolved": "https://registry.npmjs.org/@types/exif/-/exif-0.6.1.tgz",
+            "integrity": "sha512-hw4RQiuu+L//CpZ1vL3EopGY3L6mGvPFK2CpWCmvlwUAquvosWfCU3ZFq9jsZ2rmIun71XJm2I2KPx7tT1VuxA==",
+            "dev": true,
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/express": {
+            "version": "4.17.6",
+            "resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.6.tgz",
+            "integrity": "sha512-n/mr9tZI83kd4azlPG5y997C/M4DNABK9yErhFM6hKdym4kkmd9j0vtsJyjFIwfRBxtrxZtAfGZCNRIBMFLK5w==",
+            "dependencies": {
+                "@types/body-parser": "*",
+                "@types/express-serve-static-core": "*",
+                "@types/qs": "*",
+                "@types/serve-static": "*"
+            }
+        },
+        "node_modules/@types/express-flash": {
+            "version": "0.0.0",
+            "resolved": "https://registry.npmjs.org/@types/express-flash/-/express-flash-0.0.0.tgz",
+            "integrity": "sha512-zs1xXRIZOjghUBriJPSnhPmfDpqf/EQxT21ggi/9XZ9/RHYrUi+5vK2jnQrP2pD1abbuZvm7owLICiNCLBQzEQ==",
+            "dev": true,
+            "dependencies": {
+                "@types/connect-flash": "*",
+                "@types/express": "*"
+            }
+        },
+        "node_modules/@types/express-serve-static-core": {
+            "version": "4.17.5",
+            "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.17.5.tgz",
+            "integrity": "sha512-578YH5Lt88AKoADy0b2jQGwJtrBxezXtVe/MBqWXKZpqx91SnC0pVkVCcxcytz3lWW+cHBYDi3Ysh0WXc+rAYw==",
+            "dependencies": {
+                "@types/node": "*",
+                "@types/range-parser": "*"
+            }
+        },
+        "node_modules/@types/express-session": {
+            "version": "1.17.0",
+            "resolved": "https://registry.npmjs.org/@types/express-session/-/express-session-1.17.0.tgz",
+            "integrity": "sha512-OQEHeBFE1UhChVIBhRh9qElHUvTp4BzKKHxMDkGHT7WuYk5eL93hPG7D8YAIkoBSbhNEY0RjreF15zn+U0eLjA==",
+            "dev": true,
+            "dependencies": {
+                "@types/express": "*",
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/express-validator": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/@types/express-validator/-/express-validator-3.0.0.tgz",
+            "integrity": "sha512-LusnB0YhTXpBT25PXyGPQlK7leE1e41Vezq1hHEUwjfkopM1Pkv2X2Ppxqh9c+w/HZ6Udzki8AJotKNjDTGdkQ==",
+            "dev": true,
+            "dependencies": {
+                "express-validator": "*"
+            }
+        },
+        "node_modules/@types/file-saver": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/@types/file-saver/-/file-saver-2.0.1.tgz",
+            "integrity": "sha512-g1QUuhYVVAamfCifK7oB7G3aIl4BbOyzDOqVyUfEr4tfBKrXfeH+M+Tg7HKCXSrbzxYdhyCP7z9WbKo0R2hBCw==",
+            "dev": true
+        },
+        "node_modules/@types/formidable": {
+            "version": "1.0.31",
+            "resolved": "https://registry.npmjs.org/@types/formidable/-/formidable-1.0.31.tgz",
+            "integrity": "sha512-dIhM5t8lRP0oWe2HF8MuPvdd1TpPTjhDMAqemcq6oIZQCBQTovhBAdTQ5L5veJB4pdQChadmHuxtB0YzqvfU3Q==",
+            "dev": true,
+            "dependencies": {
+                "@types/events": "*",
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/glob": {
+            "version": "7.1.1",
+            "resolved": "https://registry.npmjs.org/@types/glob/-/glob-7.1.1.tgz",
+            "integrity": "sha512-1Bh06cbWJUHMC97acuD6UMG29nMt0Aqz1vF3guLfG+kHHJhy3AyohZFFxYk2f7Q1SQIrNwvncxAE0N/9s70F2w==",
+            "dev": true,
+            "dependencies": {
+                "@types/events": "*",
+                "@types/minimatch": "*",
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/google-maps": {
+            "version": "3.2.2",
+            "resolved": "https://registry.npmjs.org/@types/google-maps/-/google-maps-3.2.2.tgz",
+            "integrity": "sha512-/XPVfS28VzUdE/HlmBRoe5ii1nNMyWujyRfRY08bD/JgmPlWSiY8enB2dqTe9mlc3kULq7LfFa1wcupM+lQfqA==",
+            "dependencies": {
+                "@types/googlemaps": "*"
+            }
+        },
+        "node_modules/@types/google-maps-react": {
+            "version": "2.0.5",
+            "resolved": "https://registry.npmjs.org/@types/google-maps-react/-/google-maps-react-2.0.5.tgz",
+            "integrity": "sha512-qcsYlHiNH169Vf7jmkEwbzBDqBfqqzYkTgK1vL7qkWVZI04wFESADYVITuQunrZ9swY/SG+tTWUIXMlY4W8byw==",
+            "dev": true,
+            "dependencies": {
+                "google-maps-react": "*"
+            }
+        },
+        "node_modules/@types/googlemaps": {
+            "version": "3.39.8",
+            "resolved": "https://registry.npmjs.org/@types/googlemaps/-/googlemaps-3.39.8.tgz",
+            "integrity": "sha512-z03u79t1v8QIktoUXypWD06Fzl499/hA162hurA+eCDlWXxFynuU+hMZIaferILF5Gzr4PMX1ShHszT666sUHQ=="
+        },
+        "node_modules/@types/jquery": {
+            "version": "3.5.0",
+            "resolved": "https://registry.npmjs.org/@types/jquery/-/jquery-3.5.0.tgz",
+            "integrity": "sha512-C7qQUjpMWDUNYQRTXsP5nbYYwCwwgy84yPgoTT7fPN69NH92wLeCtFaMsWeolJD1AF/6uQw3pYt62rzv83sMmw==",
+            "dev": true,
+            "dependencies": {
+                "@types/sizzle": "*"
+            }
+        },
+        "node_modules/@types/keygrip": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/@types/keygrip/-/keygrip-1.0.2.tgz",
+            "integrity": "sha512-GJhpTepz2udxGexqos8wgaBx4I/zWIDPh/KOGEwAqtuGDkOUJu5eFvwmdBX4AmB8Odsr+9pHCQqiAqDL/yKMKw==",
+            "dev": true
+        },
+        "node_modules/@types/libxmljs": {
+            "version": "0.18.6",
+            "resolved": "https://registry.npmjs.org/@types/libxmljs/-/libxmljs-0.18.6.tgz",
+            "integrity": "sha512-xVUs71CwL5wYYfx5oH344DYWdoE2hVWlnRxlXFYyA8BcueN+Ey/h4FyhzEikbIJSXBKyPpJKhGu5c3NOx15nww==",
+            "dev": true,
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/lodash": {
+            "version": "4.14.157",
+            "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.157.tgz",
+            "integrity": "sha512-Ft5BNFmv2pHDgxV5JDsndOWTRJ+56zte0ZpYLowp03tW+K+t8u8YMOzAnpuqPgzX6WO1XpDIUm7u04M8vdDiVQ==",
+            "dev": true
+        },
+        "node_modules/@types/memory-fs": {
+            "version": "0.3.3",
+            "resolved": "https://registry.npmjs.org/@types/memory-fs/-/memory-fs-0.3.3.tgz",
+            "integrity": "sha512-rLEYzl1xODshz+Lm+YX8NYws8Xw7/qcYbQInMkotl96VpLZmUvoCfYYGxfajMSiugANV02QO5Fc+R98KKeE4gQ==",
+            "dev": true,
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/mime": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/@types/mime/-/mime-2.0.1.tgz",
+            "integrity": "sha512-FwI9gX75FgVBJ7ywgnq/P7tw+/o1GUbtP0KzbtusLigAOgIgNISRK0ZPl4qertvXSIE8YbsVJueQ90cDt9YYyw=="
+        },
+        "node_modules/@types/minimatch": {
+            "version": "3.0.3",
+            "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz",
+            "integrity": "sha512-tHq6qdbT9U1IRSGf14CL0pUlULksvY9OZ+5eEgl1N7t+OA3tGvNpxJCzuKQlsNgCVwbAs670L1vcVQi8j9HjnA==",
+            "dev": true
+        },
+        "node_modules/@types/mobile-detect": {
+            "version": "1.3.4",
+            "resolved": "https://registry.npmjs.org/@types/mobile-detect/-/mobile-detect-1.3.4.tgz",
+            "integrity": "sha512-MGBTvT5c7aH8eX6szFYP3dWPryNLt5iGlo31XNaJtt8o6jsg6tjn99eEMq9l8T6cPZymsr+J4Jth8+/G/04ZDw==",
+            "dev": true,
+            "dependencies": {
+                "mobile-detect": "*"
+            }
+        },
+        "node_modules/@types/mocha": {
+            "version": "5.2.7",
+            "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-5.2.7.tgz",
+            "integrity": "sha512-NYrtPht0wGzhwe9+/idPaBB+TqkY9AhTvOLMkThm0IoEfLaiVQZwBwyJ5puCkO3AUCWrmcoePjp2mbFocKy4SQ==",
+            "dev": true
+        },
+        "node_modules/@types/mongodb": {
+            "version": "3.5.25",
+            "resolved": "https://registry.npmjs.org/@types/mongodb/-/mongodb-3.5.25.tgz",
+            "integrity": "sha512-2H/Owt+pHCl9YmBOYnXc3VdnxejJEjVdH+QCWL5ZAfPehEn3evygKBX3/vKRv7aTwfNbUd0E5vjJdQklH/9a6w==",
+            "dev": true,
+            "dependencies": {
+                "@types/bson": "*",
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/mongoose": {
+            "version": "5.7.28",
+            "resolved": "https://registry.npmjs.org/@types/mongoose/-/mongoose-5.7.28.tgz",
+            "integrity": "sha512-ll74S2QhC34MSSSk30NHlU8ILESIA2l4mDfAfDse/VM20tT9MRV9WGKWK3HglKRmdL77iMUYMcgHdKJebabtzA==",
+            "dev": true,
+            "dependencies": {
+                "@types/mongodb": "*",
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/node": {
+            "version": "10.17.26",
+            "resolved": "https://registry.npmjs.org/@types/node/-/node-10.17.26.tgz",
+            "integrity": "sha512-myMwkO2Cr82kirHY8uknNRHEVtn0wV3DTQfkrjx17jmkstDRZ24gNUdl8AHXVyVclTYI/bNjgTPTAWvWLqXqkw=="
+        },
+        "node_modules/@types/nodemailer": {
+            "version": "4.6.8",
+            "resolved": "https://registry.npmjs.org/@types/nodemailer/-/nodemailer-4.6.8.tgz",
+            "integrity": "sha512-IX1P3bxDP1VIdZf6/kIWYNmSejkYm9MOyMEtoDFi4DVzKjJ3kY4GhOcOAKs6lZRjqVVmF9UjPOZXuQczlpZThw==",
+            "dev": true,
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/oauth": {
+            "version": "0.9.1",
+            "resolved": "https://registry.npmjs.org/@types/oauth/-/oauth-0.9.1.tgz",
+            "integrity": "sha512-a1iY62/a3yhZ7qH7cNUsxoI3U/0Fe9+RnuFrpTKr+0WVOzbKlSLojShCKe20aOD1Sppv+i8Zlq0pLDuTJnwS4A==",
+            "dev": true,
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/orderedmap": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/@types/orderedmap/-/orderedmap-1.0.0.tgz",
+            "integrity": "sha512-dxKo80TqYx3YtBipHwA/SdFmMMyLCnP+5mkEqN0eMjcTBzHkiiX0ES118DsjDBjvD+zeSsSU9jULTZ+frog+Gw==",
+            "dev": true
+        },
+        "node_modules/@types/parse-json": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.0.tgz",
+            "integrity": "sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA=="
+        },
+        "node_modules/@types/passport": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/@types/passport/-/passport-1.0.3.tgz",
+            "integrity": "sha512-nyztuxtDPQv9utCzU0qW7Gl8BY2Dn8BKlYAFFyxKipFxjaVd96celbkLCV/tRqqBUZ+JB8If3UfgV8347DTo3Q==",
+            "dev": true,
+            "dependencies": {
+                "@types/express": "*"
+            }
+        },
+        "node_modules/@types/passport-google-oauth20": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/@types/passport-google-oauth20/-/passport-google-oauth20-2.0.3.tgz",
+            "integrity": "sha512-6EUEGzEg4acwowvgR/yVZIj8S2Kkwc6JmlY2/wnM1wJHNz20o7s1TIGrxnah8ymLgJasYDpy95P3TMMqlmetPw==",
+            "dev": true,
+            "dependencies": {
+                "@types/express": "*",
+                "@types/passport": "*",
+                "@types/passport-oauth2": "*"
+            }
+        },
+        "node_modules/@types/passport-local": {
+            "version": "1.0.33",
+            "resolved": "https://registry.npmjs.org/@types/passport-local/-/passport-local-1.0.33.tgz",
+            "integrity": "sha512-+rn6ZIxje0jZ2+DAiWFI8vGG7ZFKB0hXx2cUdMmudSWsigSq6ES7Emso46r4HJk0qCgrZVfI8sJiM7HIYf4SbA==",
+            "dev": true,
+            "dependencies": {
+                "@types/express": "*",
+                "@types/passport": "*",
+                "@types/passport-strategy": "*"
+            }
+        },
+        "node_modules/@types/passport-oauth2": {
+            "version": "1.4.9",
+            "resolved": "https://registry.npmjs.org/@types/passport-oauth2/-/passport-oauth2-1.4.9.tgz",
+            "integrity": "sha512-QP0q+NVQOaIu2r0e10QWkiUA0Ya5mOBHRJN0UrI+LolMLOP1/VN4EVIpJ3xVwFo+xqNFRoFvFwJhBvKnk7kpUA==",
+            "dev": true,
+            "dependencies": {
+                "@types/express": "*",
+                "@types/oauth": "*",
+                "@types/passport": "*"
+            }
+        },
+        "node_modules/@types/passport-strategy": {
+            "version": "0.2.35",
+            "resolved": "https://registry.npmjs.org/@types/passport-strategy/-/passport-strategy-0.2.35.tgz",
+            "integrity": "sha512-o5D19Jy2XPFoX2rKApykY15et3Apgax00RRLf0RUotPDUsYrQa7x4howLYr9El2mlUApHmCMv5CZ1IXqKFQ2+g==",
+            "dev": true,
+            "dependencies": {
+                "@types/express": "*",
+                "@types/passport": "*"
+            }
+        },
+        "node_modules/@types/pdfjs-dist": {
+            "version": "2.1.4",
+            "resolved": "https://registry.npmjs.org/@types/pdfjs-dist/-/pdfjs-dist-2.1.4.tgz",
+            "integrity": "sha512-KnEc8W2IcntVL/SKfRWy2lcJax07xEaO7ghcT0/hc2Lp5UOcmaXAi887RKOLhP8BLKsVGJ7uYH0mYo1uSvbu2A==",
+            "dev": true
+        },
+        "node_modules/@types/prop-types": {
+            "version": "15.7.3",
+            "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz",
+            "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw=="
+        },
+        "node_modules/@types/prosemirror-commands": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/@types/prosemirror-commands/-/prosemirror-commands-1.0.1.tgz",
+            "integrity": "sha512-GeE12m8VT9N1JrzoY//946IX8ZyQOLNmvryJ+BNQs/HvhmXW9EWOcWUE6OBRtxK7Y8SrzSOwx4XmqSgVmK3tGQ==",
+            "dev": true,
+            "dependencies": {
+                "@types/prosemirror-model": "*",
+                "@types/prosemirror-state": "*",
+                "@types/prosemirror-view": "*"
+            }
+        },
+        "node_modules/@types/prosemirror-dev-tools": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/@types/prosemirror-dev-tools/-/prosemirror-dev-tools-2.1.0.tgz",
+            "integrity": "sha512-OhnSaC4yrrEMLPRUkEWcHAIPVqgKlLkE4kISqL3cHeAYxASouSPvPMLqhBIbWkGwaozy43DjjVC1OXkxTo+y5Q==",
+            "dev": true,
+            "dependencies": {
+                "@types/prosemirror-state": "*",
+                "@types/prosemirror-view": "*"
+            }
+        },
+        "node_modules/@types/prosemirror-history": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/@types/prosemirror-history/-/prosemirror-history-1.0.1.tgz",
+            "integrity": "sha512-BYyPJlWDo3VEnWS5X2DCHXrrAKEjdbCe1DUjGL6R/8hmwMFe3iMJGYdBkOXU1FfkTpw7Z+PlwY/pMyeelVydmg==",
+            "dev": true,
+            "dependencies": {
+                "@types/prosemirror-model": "*",
+                "@types/prosemirror-state": "*"
+            }
+        },
+        "node_modules/@types/prosemirror-inputrules": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/@types/prosemirror-inputrules/-/prosemirror-inputrules-1.0.2.tgz",
+            "integrity": "sha512-bKFneQUPnkZmzCJ1uoitpKH6PFW0hc4q55NsC7mFUCvX0eZl0GRKxyfV47jkJbsbyUQoO/QFv0WwLDz2bo15sA==",
+            "dev": true,
+            "dependencies": {
+                "@types/prosemirror-model": "*",
+                "@types/prosemirror-state": "*"
+            }
+        },
+        "node_modules/@types/prosemirror-keymap": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/@types/prosemirror-keymap/-/prosemirror-keymap-1.0.2.tgz",
+            "integrity": "sha512-94aDnpdrdI5S2UM7MQIjauFeo0MI5S7uU+SMT01m5NXT5CZ/NLHhzN0d1V5zKxe7Nh7fVxuZ7l9DTu5nSMN9sw==",
+            "dev": true,
+            "dependencies": {
+                "@types/prosemirror-model": "*",
+                "@types/prosemirror-state": "*",
+                "@types/prosemirror-view": "*"
+            }
+        },
+        "node_modules/@types/prosemirror-menu": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/@types/prosemirror-menu/-/prosemirror-menu-1.0.2.tgz",
+            "integrity": "sha512-u79CwEQR271k/kjdvRXyPGG7Rn+vPKbJfgSO7vOR/zEYcvSz7lLhBg1OZiSKqfSuhnIAbQh53qLylmB8PTw+WA==",
+            "dev": true,
+            "dependencies": {
+                "@types/prosemirror-model": "*",
+                "@types/prosemirror-state": "*",
+                "@types/prosemirror-view": "*"
+            }
+        },
+        "node_modules/@types/prosemirror-model": {
+            "version": "1.7.2",
+            "resolved": "https://registry.npmjs.org/@types/prosemirror-model/-/prosemirror-model-1.7.2.tgz",
+            "integrity": "sha512-2l+yXvidg3AUHN07mO4Jd8Q84fo6ksFsy7LHUurLYrZ74uTahBp2fzcO49AKZMzww2EulXJ40Kl/OFaQ/7A1fw==",
+            "dev": true,
+            "dependencies": {
+                "@types/orderedmap": "*"
+            }
+        },
+        "node_modules/@types/prosemirror-schema-list": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/@types/prosemirror-schema-list/-/prosemirror-schema-list-1.0.1.tgz",
+            "integrity": "sha512-+iUYq+pj2wVHSThj0MjNDzkkGwq8aDQ6j0UJK8a0cNCL8v44Ftcx1noGPtBIEUJgitH960VnfBNoTWfQoQZfRA==",
+            "dev": true,
+            "dependencies": {
+                "@types/orderedmap": "*",
+                "@types/prosemirror-model": "*",
+                "@types/prosemirror-state": "*"
+            }
+        },
+        "node_modules/@types/prosemirror-state": {
+            "version": "1.2.4",
+            "resolved": "https://registry.npmjs.org/@types/prosemirror-state/-/prosemirror-state-1.2.4.tgz",
+            "integrity": "sha512-Gch4THfZ9QNsRQ7myibU8cG99F3b8/3Gto083ZuutNG72E0VmS8yfQzA5ahbndr5GUIbmKyOD5LqKTBvx/M0qw==",
+            "dev": true,
+            "dependencies": {
+                "@types/prosemirror-model": "*",
+                "@types/prosemirror-transform": "*",
+                "@types/prosemirror-view": "*"
+            }
+        },
+        "node_modules/@types/prosemirror-transform": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/@types/prosemirror-transform/-/prosemirror-transform-1.1.1.tgz",
+            "integrity": "sha512-yYCYSoiRH+Wcbl8GJc0PFCzeyMzNQ1vL2xrHHSXZuNcIlH75VoiKrZFeZ6BS9cl8mYXjZrlmdBe8YOxYvyKM6A==",
+            "dev": true,
+            "dependencies": {
+                "@types/prosemirror-model": "*"
+            }
+        },
+        "node_modules/@types/prosemirror-view": {
+            "version": "1.11.4",
+            "resolved": "https://registry.npmjs.org/@types/prosemirror-view/-/prosemirror-view-1.11.4.tgz",
+            "integrity": "sha512-Hh8v2tpCEMaIesQuw7Y7Pz6imoC1T/bR5OlNGVtp944PZvctXiBvFRkQIb0YvZpt7vVkFzeq2kmR+7mnUfvWiw==",
+            "dev": true,
+            "dependencies": {
+                "@types/prosemirror-model": "*",
+                "@types/prosemirror-state": "*",
+                "@types/prosemirror-transform": "*"
+            }
+        },
+        "node_modules/@types/qs": {
+            "version": "6.9.1",
+            "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.1.tgz",
+            "integrity": "sha512-lhbQXx9HKZAPgBkISrBcmAcMpZsmpe/Cd/hY7LGZS5OfkySUBItnPZHgQPssWYUET8elF+yCFBbP1Q0RZPTdaw=="
+        },
+        "node_modules/@types/range-parser": {
+            "version": "1.2.3",
+            "resolved": "https://registry.npmjs.org/@types/range-parser/-/range-parser-1.2.3.tgz",
+            "integrity": "sha512-ewFXqrQHlFsgc09MK5jP5iR7vumV/BYayNC6PgJO2LPe8vrnNFyjQjSppfEngITi0qvfKtzFvgKymGheFM9UOA=="
+        },
+        "node_modules/@types/rc-switch": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@types/rc-switch/-/rc-switch-1.9.0.tgz",
+            "integrity": "sha512-L3ZQ2/1GAaiKuQTMO/2sRdhnNNVtnnvdE0ZOL3/+v54j5LguOvYqTSOHPk9nLPi5va3pdRN1MTce3JkJvGZ65A==",
+            "dev": true,
+            "dependencies": {
+                "@types/react": "*"
+            }
+        },
+        "node_modules/@types/react": {
+            "version": "16.9.41",
+            "resolved": "https://registry.npmjs.org/@types/react/-/react-16.9.41.tgz",
+            "integrity": "sha512-6cFei7F7L4wwuM+IND/Q2cV1koQUvJ8iSV+Gwn0c3kvABZ691g7sp3hfEQHOUBJtccl1gPi+EyNjMIl9nGA0ug==",
+            "dependencies": {
+                "@types/prop-types": "*",
+                "csstype": "^2.2.0"
+            }
+        },
+        "node_modules/@types/react-autosuggest": {
+            "version": "9.3.14",
+            "resolved": "https://registry.npmjs.org/@types/react-autosuggest/-/react-autosuggest-9.3.14.tgz",
+            "integrity": "sha512-cvGpKaQaNsFbDxTwP56VKVj2FO6SpJ9PsrQtlVzN7aVa/SsMZoQrBLEUx5HQKfIS4Zupb6K4tHmIyTjF7AEcow==",
+            "dev": true,
+            "dependencies": {
+                "@types/react": "*"
+            }
+        },
+        "node_modules/@types/react-color": {
+            "version": "2.17.4",
+            "resolved": "https://registry.npmjs.org/@types/react-color/-/react-color-2.17.4.tgz",
+            "integrity": "sha512-pAO3+7uHoESg5QMqjnGjw9F7sALjEZsaU41yGiUZbmHiJMoSXH1UklFJ1bZkwhYskaJgiY+AS6wirl17yBh5GA==",
+            "dev": true,
+            "dependencies": {
+                "@types/react": "*",
+                "@types/reactcss": "*"
+            }
+        },
+        "node_modules/@types/react-datepicker": {
+            "version": "3.0.2",
+            "resolved": "https://registry.npmjs.org/@types/react-datepicker/-/react-datepicker-3.0.2.tgz",
+            "integrity": "sha512-xW04NZRF+9ZnzOD3XrlIzBEKgUsN6LVgZJJsXH8NIUlVjyPh+sdtLPfVoDp+GQzGq1M0TuMLNZsv0sJ3N9XwDA==",
+            "dev": true,
+            "dependencies": {
+                "@types/react": "*",
+                "date-fns": "^2.0.1",
+                "popper.js": "^1.14.1"
+            }
+        },
+        "node_modules/@types/react-dom": {
+            "version": "16.9.8",
+            "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-16.9.8.tgz",
+            "integrity": "sha512-ykkPQ+5nFknnlU6lDd947WbQ6TE3NNzbQAkInC2EKY1qeYdTKp7onFusmYZb+ityzx2YviqT6BXSu+LyWWJwcA==",
+            "dev": true,
+            "dependencies": {
+                "@types/react": "*"
+            }
+        },
+        "node_modules/@types/react-grid-layout": {
+            "version": "0.17.1",
+            "resolved": "https://registry.npmjs.org/@types/react-grid-layout/-/react-grid-layout-0.17.1.tgz",
+            "integrity": "sha512-1ssQjX3X2A89jx94jECJ0Ze2EHFRYlBHjRh2pnlwjJj1WaEijXUNvwKnUzKwgNFnyZ91Pzqu9Z3V7Atzi9ge7A==",
+            "dev": true,
+            "dependencies": {
+                "@types/react": "*"
+            }
+        },
+        "node_modules/@types/react-measure": {
+            "version": "2.0.6",
+            "resolved": "https://registry.npmjs.org/@types/react-measure/-/react-measure-2.0.6.tgz",
+            "integrity": "sha512-FxAwgDVKvxm4SPXu24x9cwzsty8x33UueazHcpxM1UWZlGJI57yIHM2djE3xUJhYVxuzNzi4E8UL3kmCkdh+4A==",
+            "dev": true,
+            "dependencies": {
+                "@types/react": "*"
+            }
+        },
+        "node_modules/@types/react-reconciler": {
+            "version": "0.26.1",
+            "resolved": "https://registry.npmjs.org/@types/react-reconciler/-/react-reconciler-0.26.1.tgz",
+            "integrity": "sha512-jeizEH5o/k6tv42RYNbaulR9KvoSM4RAUq1Q2SXd2HZ7dqgTxN9OIf+GU/sErT7CohB/mUxy9hSjaRLiCPGF5w==",
+            "dependencies": {
+                "@types/react": "*"
+            }
+        },
+        "node_modules/@types/react-select": {
+            "version": "3.0.13",
+            "resolved": "https://registry.npmjs.org/@types/react-select/-/react-select-3.0.13.tgz",
+            "integrity": "sha512-JxmSArGgzAOtb37+Jz2+3av8rVmp/3s3DGwlcP+g59/a3owkiuuU4/Jajd+qA32beDPHy4gJR2kkxagPY3j9kg==",
+            "dev": true,
+            "dependencies": {
+                "@types/react": "*",
+                "@types/react-dom": "*",
+                "@types/react-transition-group": "*"
+            }
+        },
+        "node_modules/@types/react-table": {
+            "version": "6.8.7",
+            "resolved": "https://registry.npmjs.org/@types/react-table/-/react-table-6.8.7.tgz",
+            "integrity": "sha512-1U0xl47jk0BzE+HNHgxZYSLvtybSvnlLhOpW9Mfqf9iuRm/fGqgRab3TKivPCY6Tl7WPFM2hWEJ1GnsuSFc9AQ==",
+            "dependencies": {
+                "@types/react": "*"
+            }
+        },
+        "node_modules/@types/react-transition-group": {
+            "version": "4.4.0",
+            "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.0.tgz",
+            "integrity": "sha512-/QfLHGpu+2fQOqQaXh8MG9q03bFENooTb/it4jr5kKaZlDQfWvjqWZg48AwzPVMBHlRuTRAY7hRHCEOXz5kV6w==",
+            "dependencies": {
+                "@types/react": "*"
+            }
+        },
+        "node_modules/@types/reactcss": {
+            "version": "1.2.3",
+            "resolved": "https://registry.npmjs.org/@types/reactcss/-/reactcss-1.2.3.tgz",
+            "integrity": "sha512-d2gQQ0IL6hXLnoRfVYZukQNWHuVsE75DzFTLPUuyyEhJS8G2VvlE+qfQQ91SJjaMqlURRCNIsX7Jcsw6cEuJlA==",
+            "dev": true,
+            "dependencies": {
+                "@types/react": "*"
+            }
+        },
+        "node_modules/@types/request": {
+            "version": "2.48.5",
+            "resolved": "https://registry.npmjs.org/@types/request/-/request-2.48.5.tgz",
+            "integrity": "sha512-/LO7xRVnL3DxJ1WkPGDQrp4VTV1reX9RkC85mJ+Qzykj2Bdw+mG15aAfDahc76HtknjzE16SX/Yddn6MxVbmGQ==",
+            "dev": true,
+            "dependencies": {
+                "@types/caseless": "*",
+                "@types/node": "*",
+                "@types/tough-cookie": "*",
+                "form-data": "^2.5.0"
+            }
+        },
+        "node_modules/@types/request-promise": {
+            "version": "4.1.46",
+            "resolved": "https://registry.npmjs.org/@types/request-promise/-/request-promise-4.1.46.tgz",
+            "integrity": "sha512-3Thpj2Va5m0ji3spaCk8YKrjkZyZc6RqUVOphA0n/Xet66AW/AiOAs5vfXhQIL5NmkaO7Jnun7Nl9NEjJ2zBaw==",
+            "dev": true,
+            "dependencies": {
+                "@types/bluebird": "*",
+                "@types/request": "*"
+            }
+        },
+        "node_modules/@types/reveal": {
+            "version": "3.3.33",
+            "resolved": "https://registry.npmjs.org/@types/reveal/-/reveal-3.3.33.tgz",
+            "integrity": "sha512-lKbezA9Oa5LfdSRwFDc/FHEGH4+FjiXh/a/PCSZAmN+KCeQJL/3ClOdAQwOxt3zdHc8XyioT+cNvIOletwRI7A=="
+        },
+        "node_modules/@types/rimraf": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/@types/rimraf/-/rimraf-2.0.4.tgz",
+            "integrity": "sha512-8gBudvllD2A/c0CcEX/BivIDorHFt5UI5m46TsNj8DjWCCTTZT74kEe4g+QsY7P/B9WdO98d82zZgXO/RQzu2Q==",
+            "dev": true,
+            "dependencies": {
+                "@types/glob": "*",
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/serve-static": {
+            "version": "1.13.3",
+            "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.13.3.tgz",
+            "integrity": "sha512-oprSwp094zOglVrXdlo/4bAHtKTAxX6VT8FOZlBKrmyLbNvE1zxZyJ6yikMVtHIvwP45+ZQGJn+FdXGKTozq0g==",
+            "dependencies": {
+                "@types/express-serve-static-core": "*",
+                "@types/mime": "*"
+            }
+        },
+        "node_modules/@types/sharp": {
+            "version": "0.23.1",
+            "resolved": "https://registry.npmjs.org/@types/sharp/-/sharp-0.23.1.tgz",
+            "integrity": "sha512-iBRM9RjRF9pkIkukk6imlxfaKMRuiRND8L0yYKl5PJu5uLvxuNzp5f0x8aoTG5VX85M8O//BwbttzFVZL1j/FQ==",
+            "dev": true,
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/shelljs": {
+            "version": "0.8.8",
+            "resolved": "https://registry.npmjs.org/@types/shelljs/-/shelljs-0.8.8.tgz",
+            "integrity": "sha512-lD3LWdg6j8r0VRBFahJVaxoW0SIcswxKaFUrmKl33RJVeeoNYQAz4uqCJ5Z6v4oIBOsC5GozX+I5SorIKiTcQA==",
+            "dev": true,
+            "dependencies": {
+                "@types/glob": "*",
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/sizzle": {
+            "version": "2.3.2",
+            "resolved": "https://registry.npmjs.org/@types/sizzle/-/sizzle-2.3.2.tgz",
+            "integrity": "sha512-7EJYyKTL7tFR8+gDbB6Wwz/arpGa0Mywk1TJbNzKzHtzbwVmY4HR9WqS5VV7dsBUKQmPNr192jHr/VpBluj/hg==",
+            "dev": true
+        },
+        "node_modules/@types/socket.io": {
+            "version": "2.1.8",
+            "resolved": "https://registry.npmjs.org/@types/socket.io/-/socket.io-2.1.8.tgz",
+            "integrity": "sha512-NIQfh9WwJuJKlgmby4NgwMpoBOmNPCDgaRNPiLYZBtkbHkszK/9R52B5yGkd5a34rbVdAADuo8FhOS/5AZDemw==",
+            "dev": true,
+            "dependencies": {
+                "@types/engine.io": "*",
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/socket.io-client": {
+            "version": "1.4.33",
+            "resolved": "https://registry.npmjs.org/@types/socket.io-client/-/socket.io-client-1.4.33.tgz",
+            "integrity": "sha512-m4LnxkljsI9fMsjwpW5QhRpMixo2BeeLpFmg0AE+sS4H1pzAd/cs/ftTiL60FLZgfFa8PFRPx5KsHu8O0bADKQ==",
+            "dev": true
+        },
+        "node_modules/@types/source-list-map": {
+            "version": "0.1.2",
+            "resolved": "https://registry.npmjs.org/@types/source-list-map/-/source-list-map-0.1.2.tgz",
+            "integrity": "sha512-K5K+yml8LTo9bWJI/rECfIPrGgxdpeNbj+d53lwN4QjW1MCwlkhUms+gtdzigTeUyBr09+u8BwOIY3MXvHdcsA==",
+            "dev": true
+        },
+        "node_modules/@types/strip-bom": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/@types/strip-bom/-/strip-bom-3.0.0.tgz",
+            "integrity": "sha1-FKjsOVbC6B7bdSB5CuzyHCkK69I=",
+            "dev": true
+        },
+        "node_modules/@types/strip-json-comments": {
+            "version": "0.0.30",
+            "resolved": "https://registry.npmjs.org/@types/strip-json-comments/-/strip-json-comments-0.0.30.tgz",
+            "integrity": "sha512-7NQmHra/JILCd1QqpSzl8+mJRc8ZHz3uDm8YV1Ks9IhK0epEiTw8aIErbvH9PI+6XbqhyIQy3462nEsn7UVzjQ==",
+            "dev": true
+        },
+        "node_modules/@types/tapable": {
+            "version": "1.0.7",
+            "resolved": "https://registry.npmjs.org/@types/tapable/-/tapable-1.0.7.tgz",
+            "integrity": "sha512-0VBprVqfgFD7Ehb2vd8Lh9TG3jP98gvr8rgehQqzztZNI7o8zS8Ad4jyZneKELphpuE212D8J70LnSNQSyO6bQ==",
+            "dev": true
+        },
+        "node_modules/@types/three": {
+            "version": "0.126.2",
+            "resolved": "https://registry.npmjs.org/@types/three/-/three-0.126.2.tgz",
+            "integrity": "sha512-6JqTgijtfXcTJik8NtiNxr2L90ex6ElM00qilOGeUcrEsJLOdzLJSIkXHUYS+KPAYQYtRJQKD6XaXds3HjS+gg=="
+        },
+        "node_modules/@types/tough-cookie": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/@types/tough-cookie/-/tough-cookie-4.0.0.tgz",
+            "integrity": "sha512-I99sngh224D0M7XgW1s120zxCt3VYQ3IQsuw3P3jbq5GG4yc79+ZjyKznyOGIQrflfylLgcfekeZW/vk0yng6A==",
+            "dev": true
+        },
+        "node_modules/@types/typescript": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/@types/typescript/-/typescript-2.0.0.tgz",
+            "integrity": "sha1-xDNTnJi64oaCswfqp6D9IRW4PCg=",
+            "dev": true,
+            "dependencies": {
+                "typescript": "*"
+            }
+        },
+        "node_modules/@types/uglify-js": {
+            "version": "3.13.0",
+            "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-3.13.0.tgz",
+            "integrity": "sha512-EGkrJD5Uy+Pg0NUR8uA4bJ5WMfljyad0G+784vLCNUkD+QwOJXUbBYExXfVGf7YtyzdQp3L/XMYcliB987kL5Q==",
+            "dev": true,
+            "dependencies": {
+                "source-map": "^0.6.1"
+            }
+        },
+        "node_modules/@types/uglify-js/node_modules/source-map": {
+            "version": "0.6.1",
+            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/@types/uuid": {
+            "version": "3.4.9",
+            "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-3.4.9.tgz",
+            "integrity": "sha512-XDwyIlt/47l2kWLTzw/mtrpLdB+GPSskR2n/PIcPn+VYhVO77rGhRncIR5GPU0KRzXuqkDO+J5qqrG0Y8P6jzQ==",
+            "dev": true
+        },
+        "node_modules/@types/valid-url": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/@types/valid-url/-/valid-url-1.0.3.tgz",
+            "integrity": "sha512-+33x29mg+ecU88ODdWpqaie2upIuRkhujVLA7TuJjM823cNMbeggfI6NhxewaRaRF8dy+g33e4uIg/m5Mb3xDQ==",
+            "dev": true
+        },
+        "node_modules/@types/webpack": {
+            "version": "4.41.27",
+            "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-4.41.27.tgz",
+            "integrity": "sha512-wK/oi5gcHi72VMTbOaQ70VcDxSQ1uX8S2tukBK9ARuGXrYM/+u4ou73roc7trXDNmCxCoerE8zruQqX/wuHszA==",
+            "dev": true,
+            "dependencies": {
+                "@types/anymatch": "*",
+                "@types/node": "*",
+                "@types/tapable": "^1",
+                "@types/uglify-js": "*",
+                "@types/webpack-sources": "*",
+                "source-map": "^0.6.0"
+            }
+        },
+        "node_modules/@types/webpack-dev-middleware": {
+            "version": "2.0.7",
+            "resolved": "https://registry.npmjs.org/@types/webpack-dev-middleware/-/webpack-dev-middleware-2.0.7.tgz",
+            "integrity": "sha512-pArv7YnqpbSCOBWiRlR1KgqVorlzkIiwto66hI8Gdgp5ATQAC+Ug4QVz69ZI1dP+D5Rs8QWnbT81tE4tcMuTag==",
+            "dev": true,
+            "dependencies": {
+                "@types/connect": "*",
+                "@types/memory-fs": "*",
+                "@types/webpack": "^4",
+                "loglevel": "^1.6.2"
+            }
+        },
+        "node_modules/@types/webpack-hot-middleware": {
+            "version": "2.25.4",
+            "resolved": "https://registry.npmjs.org/@types/webpack-hot-middleware/-/webpack-hot-middleware-2.25.4.tgz",
+            "integrity": "sha512-6tQb9EBKIANZYUVLQYWiWfDFVe7FhXSj4bB2EF5QB7VtYWL3HDR+y/zqjZPAnCorv0spLqVMRqjRK8AmhfocMw==",
+            "dev": true,
+            "dependencies": {
+                "@types/connect": "*",
+                "@types/webpack": "^4"
+            }
+        },
+        "node_modules/@types/webpack-sources": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/@types/webpack-sources/-/webpack-sources-2.1.0.tgz",
+            "integrity": "sha512-LXn/oYIpBeucgP1EIJbKQ2/4ZmpvRl+dlrFdX7+94SKRUV3Evy3FsfMZY318vGhkWUS5MPhtOM3w1/hCOAOXcg==",
+            "dev": true,
+            "dependencies": {
+                "@types/node": "*",
+                "@types/source-list-map": "*",
+                "source-map": "^0.7.3"
+            }
+        },
+        "node_modules/@types/webpack-sources/node_modules/source-map": {
+            "version": "0.7.3",
+            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.3.tgz",
+            "integrity": "sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==",
+            "dev": true,
+            "engines": {
+                "node": ">= 8"
+            }
+        },
+        "node_modules/@types/webpack/node_modules/source-map": {
+            "version": "0.6.1",
+            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/@types/webscopeio__react-textarea-autocomplete": {
+            "version": "4.6.1",
+            "resolved": "https://registry.npmjs.org/@types/webscopeio__react-textarea-autocomplete/-/webscopeio__react-textarea-autocomplete-4.6.1.tgz",
+            "integrity": "sha512-rdiDMsTbyFJRbC2BYKIgiAFG/SFkaDGYQYfzo3U2T+EjMCE0JZ8IHZ9nZrJ2Tm83Blrj66cnaEc0H3iwwRqQMA==",
+            "dependencies": {
+                "@types/react": "*"
+            }
+        },
+        "node_modules/@types/xregexp": {
+            "version": "4.3.0",
+            "resolved": "https://registry.npmjs.org/@types/xregexp/-/xregexp-4.3.0.tgz",
+            "integrity": "sha512-3gJTS9gt27pS7U9q5IVqo4YvKSlkf2ck8ish6etuDj6LIRxkL/2Y8RMUtK/QzvE1Yv2zwWV5yemI2BS0GGGFnA==",
+            "dev": true
+        },
+        "node_modules/@types/yauzl": {
+            "version": "2.9.1",
+            "resolved": "https://registry.npmjs.org/@types/yauzl/-/yauzl-2.9.1.tgz",
+            "integrity": "sha512-A1b8SU4D10uoPjwb0lnHmmu8wZhR9d+9o2PKBQT2jU5YPTKsxac6M2qGAdY7VcL+dHHhARVUDmeg0rOrcd9EjA==",
+            "optional": true,
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
+        "node_modules/@types/youtube": {
+            "version": "0.0.39",
+            "resolved": "https://registry.npmjs.org/@types/youtube/-/youtube-0.0.39.tgz",
+            "integrity": "sha512-naVjyTZT/CoNwEQW3+mf9E/x6sgB7QIPbRDtVlPUpHlmuQTk+j6gQBy0T5CRkV8oC0GYQjMgfr3VdueTSVLTjw==",
+            "dev": true
+        },
+        "node_modules/@webassemblyjs/ast": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.9.0.tgz",
+            "integrity": "sha512-C6wW5L+b7ogSDVqymbkkvuW9kruN//YisMED04xzeBBqjHa2FYnmvOlS6Xj68xWQRgWvI9cIglsjFowH/RJyEA==",
+            "dev": true,
+            "dependencies": {
+                "@webassemblyjs/helper-module-context": "1.9.0",
+                "@webassemblyjs/helper-wasm-bytecode": "1.9.0",
+                "@webassemblyjs/wast-parser": "1.9.0"
+            }
+        },
+        "node_modules/@webassemblyjs/floating-point-hex-parser": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.9.0.tgz",
+            "integrity": "sha512-TG5qcFsS8QB4g4MhrxK5TqfdNe7Ey/7YL/xN+36rRjl/BlGE/NcBvJcqsRgCP6Z92mRE+7N50pRIi8SmKUbcQA==",
+            "dev": true
+        },
+        "node_modules/@webassemblyjs/helper-api-error": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-api-error/-/helper-api-error-1.9.0.tgz",
+            "integrity": "sha512-NcMLjoFMXpsASZFxJ5h2HZRcEhDkvnNFOAKneP5RbKRzaWJN36NC4jqQHKwStIhGXu5mUWlUUk7ygdtrO8lbmw==",
+            "dev": true
+        },
+        "node_modules/@webassemblyjs/helper-buffer": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-buffer/-/helper-buffer-1.9.0.tgz",
+            "integrity": "sha512-qZol43oqhq6yBPx7YM3m9Bv7WMV9Eevj6kMi6InKOuZxhw+q9hOkvq5e/PpKSiLfyetpaBnogSbNCfBwyB00CA==",
+            "dev": true
+        },
+        "node_modules/@webassemblyjs/helper-code-frame": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-code-frame/-/helper-code-frame-1.9.0.tgz",
+            "integrity": "sha512-ERCYdJBkD9Vu4vtjUYe8LZruWuNIToYq/ME22igL+2vj2dQ2OOujIZr3MEFvfEaqKoVqpsFKAGsRdBSBjrIvZA==",
+            "dev": true,
+            "dependencies": {
+                "@webassemblyjs/wast-printer": "1.9.0"
+            }
+        },
+        "node_modules/@webassemblyjs/helper-fsm": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-fsm/-/helper-fsm-1.9.0.tgz",
+            "integrity": "sha512-OPRowhGbshCb5PxJ8LocpdX9Kl0uB4XsAjl6jH/dWKlk/mzsANvhwbiULsaiqT5GZGT9qinTICdj6PLuM5gslw==",
+            "dev": true
+        },
+        "node_modules/@webassemblyjs/helper-module-context": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-module-context/-/helper-module-context-1.9.0.tgz",
+            "integrity": "sha512-MJCW8iGC08tMk2enck1aPW+BE5Cw8/7ph/VGZxwyvGbJwjktKkDK7vy7gAmMDx88D7mhDTCNKAW5tED+gZ0W8g==",
+            "dev": true,
+            "dependencies": {
+                "@webassemblyjs/ast": "1.9.0"
+            }
+        },
+        "node_modules/@webassemblyjs/helper-wasm-bytecode": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.9.0.tgz",
+            "integrity": "sha512-R7FStIzyNcd7xKxCZH5lE0Bqy+hGTwS3LJjuv1ZVxd9O7eHCedSdrId/hMOd20I+v8wDXEn+bjfKDLzTepoaUw==",
+            "dev": true
+        },
+        "node_modules/@webassemblyjs/helper-wasm-section": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.9.0.tgz",
+            "integrity": "sha512-XnMB8l3ek4tvrKUUku+IVaXNHz2YsJyOOmz+MMkZvh8h1uSJpSen6vYnw3IoQ7WwEuAhL8Efjms1ZWjqh2agvw==",
+            "dev": true,
+            "dependencies": {
+                "@webassemblyjs/ast": "1.9.0",
+                "@webassemblyjs/helper-buffer": "1.9.0",
+                "@webassemblyjs/helper-wasm-bytecode": "1.9.0",
+                "@webassemblyjs/wasm-gen": "1.9.0"
+            }
+        },
+        "node_modules/@webassemblyjs/ieee754": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/ieee754/-/ieee754-1.9.0.tgz",
+            "integrity": "sha512-dcX8JuYU/gvymzIHc9DgxTzUUTLexWwt8uCTWP3otys596io0L5aW02Gb1RjYpx2+0Jus1h4ZFqjla7umFniTg==",
+            "dev": true,
+            "dependencies": {
+                "@xtuc/ieee754": "^1.2.0"
+            }
+        },
+        "node_modules/@webassemblyjs/leb128": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/leb128/-/leb128-1.9.0.tgz",
+            "integrity": "sha512-ENVzM5VwV1ojs9jam6vPys97B/S65YQtv/aanqnU7D8aSoHFX8GyhGg0CMfyKNIHBuAVjy3tlzd5QMMINa7wpw==",
+            "dev": true,
+            "dependencies": {
+                "@xtuc/long": "4.2.2"
+            }
+        },
+        "node_modules/@webassemblyjs/utf8": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/utf8/-/utf8-1.9.0.tgz",
+            "integrity": "sha512-GZbQlWtopBTP0u7cHrEx+73yZKrQoBMpwkGEIqlacljhXCkVM1kMQge/Mf+csMJAjEdSwhOyLAS0AoR3AG5P8w==",
+            "dev": true
+        },
+        "node_modules/@webassemblyjs/wasm-edit": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-edit/-/wasm-edit-1.9.0.tgz",
+            "integrity": "sha512-FgHzBm80uwz5M8WKnMTn6j/sVbqilPdQXTWraSjBwFXSYGirpkSWE2R9Qvz9tNiTKQvoKILpCuTjBKzOIm0nxw==",
+            "dev": true,
+            "dependencies": {
+                "@webassemblyjs/ast": "1.9.0",
+                "@webassemblyjs/helper-buffer": "1.9.0",
+                "@webassemblyjs/helper-wasm-bytecode": "1.9.0",
+                "@webassemblyjs/helper-wasm-section": "1.9.0",
+                "@webassemblyjs/wasm-gen": "1.9.0",
+                "@webassemblyjs/wasm-opt": "1.9.0",
+                "@webassemblyjs/wasm-parser": "1.9.0",
+                "@webassemblyjs/wast-printer": "1.9.0"
+            }
+        },
+        "node_modules/@webassemblyjs/wasm-gen": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-gen/-/wasm-gen-1.9.0.tgz",
+            "integrity": "sha512-cPE3o44YzOOHvlsb4+E9qSqjc9Qf9Na1OO/BHFy4OI91XDE14MjFN4lTMezzaIWdPqHnsTodGGNP+iRSYfGkjA==",
+            "dev": true,
+            "dependencies": {
+                "@webassemblyjs/ast": "1.9.0",
+                "@webassemblyjs/helper-wasm-bytecode": "1.9.0",
+                "@webassemblyjs/ieee754": "1.9.0",
+                "@webassemblyjs/leb128": "1.9.0",
+                "@webassemblyjs/utf8": "1.9.0"
+            }
+        },
+        "node_modules/@webassemblyjs/wasm-opt": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-opt/-/wasm-opt-1.9.0.tgz",
+            "integrity": "sha512-Qkjgm6Anhm+OMbIL0iokO7meajkzQD71ioelnfPEj6r4eOFuqm4YC3VBPqXjFyyNwowzbMD+hizmprP/Fwkl2A==",
+            "dev": true,
+            "dependencies": {
+                "@webassemblyjs/ast": "1.9.0",
+                "@webassemblyjs/helper-buffer": "1.9.0",
+                "@webassemblyjs/wasm-gen": "1.9.0",
+                "@webassemblyjs/wasm-parser": "1.9.0"
+            }
+        },
+        "node_modules/@webassemblyjs/wasm-parser": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-parser/-/wasm-parser-1.9.0.tgz",
+            "integrity": "sha512-9+wkMowR2AmdSWQzsPEjFU7njh8HTO5MqO8vjwEHuM+AMHioNqSBONRdr0NQQ3dVQrzp0s8lTcYqzUdb7YgELA==",
+            "dev": true,
+            "dependencies": {
+                "@webassemblyjs/ast": "1.9.0",
+                "@webassemblyjs/helper-api-error": "1.9.0",
+                "@webassemblyjs/helper-wasm-bytecode": "1.9.0",
+                "@webassemblyjs/ieee754": "1.9.0",
+                "@webassemblyjs/leb128": "1.9.0",
+                "@webassemblyjs/utf8": "1.9.0"
+            }
+        },
+        "node_modules/@webassemblyjs/wast-parser": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/wast-parser/-/wast-parser-1.9.0.tgz",
+            "integrity": "sha512-qsqSAP3QQ3LyZjNC/0jBJ/ToSxfYJ8kYyuiGvtn/8MK89VrNEfwj7BPQzJVHi0jGTRK2dGdJ5PRqhtjzoww+bw==",
+            "dev": true,
+            "dependencies": {
+                "@webassemblyjs/ast": "1.9.0",
+                "@webassemblyjs/floating-point-hex-parser": "1.9.0",
+                "@webassemblyjs/helper-api-error": "1.9.0",
+                "@webassemblyjs/helper-code-frame": "1.9.0",
+                "@webassemblyjs/helper-fsm": "1.9.0",
+                "@xtuc/long": "4.2.2"
+            }
+        },
+        "node_modules/@webassemblyjs/wast-printer": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/@webassemblyjs/wast-printer/-/wast-printer-1.9.0.tgz",
+            "integrity": "sha512-2J0nE95rHXHyQ24cWjMKJ1tqB/ds8z/cyeOZxJhcb+rW+SQASVjuznUSmdz5GpVJTzU8JkhYut0D3siFDD6wsA==",
+            "dev": true,
+            "dependencies": {
+                "@webassemblyjs/ast": "1.9.0",
+                "@webassemblyjs/wast-parser": "1.9.0",
+                "@xtuc/long": "4.2.2"
+            }
+        },
+        "node_modules/@webscopeio/react-textarea-autocomplete": {
+            "version": "4.7.0",
+            "resolved": "https://registry.npmjs.org/@webscopeio/react-textarea-autocomplete/-/react-textarea-autocomplete-4.7.0.tgz",
+            "integrity": "sha512-uzH7PUlXQk6jCTh1eGZdXjvjxveZpznhQywX5I5ojsXgre+XSzlK66chdDdfi+lQABC3N3TzfSq6Hlxa8hlrLA==",
+            "dependencies": {
+                "custom-event": "^1.0.1",
+                "textarea-caret": "3.0.2"
+            }
+        },
+        "node_modules/@webscopeio/react-textarea-autocomplete/node_modules/textarea-caret": {
+            "version": "3.0.2",
+            "resolved": "https://registry.npmjs.org/textarea-caret/-/textarea-caret-3.0.2.tgz",
+            "integrity": "sha1-82DEhpmqGr9xhoCkOjGoUGZcLK8="
+        },
+        "node_modules/@xtuc/ieee754": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
+            "integrity": "sha512-DX8nKgqcGwsc0eJSqYt5lwP4DH5FlHnmuWWBRy7X0NcaGR0ZtuyeESgMwTYVEtxmsNGY+qit4QYT/MIYTOTPeA==",
+            "dev": true
+        },
+        "node_modules/@xtuc/long": {
+            "version": "4.2.2",
+            "resolved": "https://registry.npmjs.org/@xtuc/long/-/long-4.2.2.tgz",
+            "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==",
+            "dev": true
+        },
+        "node_modules/abab": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.3.tgz",
+            "integrity": "sha512-tsFzPpcttalNjFBCFMqsKYQcWxxen1pgJR56by//QwvJc4/OUS3kPOOttx2tSIfjsylB0pYu7f5D3K1RCxUnUg==",
+            "dev": true
+        },
+        "node_modules/abbrev": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
+            "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q=="
+        },
+        "node_modules/abort-controller": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/abort-controller/-/abort-controller-3.0.0.tgz",
+            "integrity": "sha512-h8lQ8tacZYnR3vNQTgibj+tODHI5/+l06Au2Pcriv/Gmet0eaj4TwWH41sO9wnHDiQsEj19q0drzdWdeAHtweg==",
+            "dependencies": {
+                "event-target-shim": "^5.0.0"
+            },
+            "engines": {
+                "node": ">=6.5"
+            }
+        },
+        "node_modules/accepts": {
+            "version": "1.3.7",
+            "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.7.tgz",
+            "integrity": "sha512-Il80Qs2WjYlJIBNzNkK6KYqlVMTbZLXgHx2oT0pU/fjRHyEp+PEfEPY0R3WCwAGVOtauxh1hOxNgIf5bv7dQpA==",
+            "dependencies": {
+                "mime-types": "~2.1.24",
+                "negotiator": "0.6.2"
+            },
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/acorn": {
+            "version": "3.3.0",
+            "resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz",
+            "integrity": "sha1-ReN/s56No/JbruP/U2niu18iAXo=",
+            "bin": {
+                "acorn": "bin/acorn"
+            },
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/acorn-globals": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-3.1.0.tgz",
+            "integrity": "sha1-/YJw9x+7SZawBPqIDuXUZXOnMb8=",
+            "dependencies": {
+                "acorn": "^4.0.4"
+            }
+        },
+        "node_modules/acorn-globals/node_modules/acorn": {
+            "version": "4.0.13",
+            "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
+            "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c=",
+            "bin": {
+                "acorn": "bin/acorn"
+            },
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/acorn-jsx": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.2.0.tgz",
+            "integrity": "sha512-HiUX/+K2YpkpJ+SzBffkM/AQ2YE03S0U1kjTLVpoJdhZMOWy8qvXVN9JdLqv2QsaQ6MPYQIuNmwD8zOiYUofLQ=="
+        },
+        "node_modules/acorn-walk": {
+            "version": "6.2.0",
+            "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-6.2.0.tgz",
+            "integrity": "sha512-7evsyfH1cLOCdAzZAd43Cic04yKydNx0cF+7tiA19p1XnLLPU4dpCQOqpjqwokFe//vS0QqfqqjCS2JkiIs0cA==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/adm-zip": {
+            "version": "0.4.16",
+            "resolved": "https://registry.npmjs.org/adm-zip/-/adm-zip-0.4.16.tgz",
+            "integrity": "sha512-TFi4HBKSGfIKsK5YCkKaaFG2m4PEDyViZmEwof3MTIgzimHLto6muaHVpbrljdIvIrFZzEq/p4nafOeLcYegrg==",
+            "engines": {
+                "node": ">=0.3.0"
+            }
+        },
+        "node_modules/after": {
+            "version": "0.8.2",
+            "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz",
+            "integrity": "sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8="
+        },
+        "node_modules/agent-base": {
+            "version": "6.0.0",
+            "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.0.tgz",
+            "integrity": "sha512-j1Q7cSCqN+AwrmDd+pzgqc0/NpC655x2bUf5ZjRIO77DcNBFmh+OgRNzF6OKdCC9RSCb19fGd99+bhXFdkRNqw==",
+            "dependencies": {
+                "debug": "4"
+            },
+            "engines": {
+                "node": ">= 6.0.0"
+            }
+        },
+        "node_modules/agent-base/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/ajv": {
+            "version": "6.12.2",
+            "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.2.tgz",
+            "integrity": "sha512-k+V+hzjm5q/Mr8ef/1Y9goCmlsK4I6Sm74teeyGvFk1XrOsbsKLjEdrvny42CZ+a8sXbk8KWpY/bDwS+FLL2UQ==",
+            "dependencies": {
+                "fast-deep-equal": "^3.1.1",
+                "fast-json-stable-stringify": "^2.0.0",
+                "json-schema-traverse": "^0.4.1",
+                "uri-js": "^4.2.2"
+            }
+        },
+        "node_modules/ajv-errors": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/ajv-errors/-/ajv-errors-1.0.1.tgz",
+            "integrity": "sha512-DCRfO/4nQ+89p/RK43i8Ezd41EqdGIU4ld7nGF8OQ14oc/we5rEntLCUa7+jrn3nn83BosfwZA0wb4pon2o8iQ=="
+        },
+        "node_modules/ajv-keywords": {
+            "version": "3.4.1",
+            "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.4.1.tgz",
+            "integrity": "sha512-RO1ibKvd27e6FEShVFfPALuHI3WjSVNeK5FIsmme/LYRNxjKuNj+Dt7bucLa6NdSv3JcVTyMlm9kGR84z1XpaQ=="
+        },
+        "node_modules/align-text": {
+            "version": "0.1.4",
+            "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz",
+            "integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc=",
+            "dependencies": {
+                "kind-of": "^3.0.2",
+                "longest": "^1.0.1",
+                "repeat-string": "^1.5.2"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/align-text/node_modules/is-buffer": {
+            "version": "1.1.6",
+            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
+            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
+        },
+        "node_modules/align-text/node_modules/kind-of": {
+            "version": "3.2.2",
+            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+            "dependencies": {
+                "is-buffer": "^1.1.5"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/amdefine": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
+            "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU=",
+            "engines": {
+                "node": ">=0.4.2"
+            }
+        },
+        "node_modules/ansi-align": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz",
+            "integrity": "sha1-w2rsy6VjuJzrVW82kPCx2eNUf38=",
+            "dependencies": {
+                "string-width": "^2.0.0"
+            }
+        },
+        "node_modules/ansi-colors": {
+            "version": "3.2.3",
+            "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-3.2.3.tgz",
+            "integrity": "sha512-LEHHyuhlPY3TmuUYMh2oz89lTShfvgbmzaBcxve9t/9Wuy7Dwf4yoAKcND7KFT1HAQfqZ12qtc+DUrBMeKF9nw==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/ansi-escape-sequences": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/ansi-escape-sequences/-/ansi-escape-sequences-4.1.0.tgz",
+            "integrity": "sha512-dzW9kHxH011uBsidTXd14JXgzye/YLb2LzeKZ4bsgl/Knwx8AtbSFkkGxagdNOoh0DlqHCmfiEjWKBaqjOanVw==",
+            "dependencies": {
+                "array-back": "^3.0.1"
+            },
+            "engines": {
+                "node": ">=8.0.0"
+            }
+        },
+        "node_modules/ansi-escape-sequences/node_modules/array-back": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/array-back/-/array-back-3.1.0.tgz",
+            "integrity": "sha512-TkuxA4UCOvxuDK6NZYXCalszEzj+TLszyASooky+i742l9TqsOdYCMJJupxRic61hwquNtppB3hgcuq9SVSH1Q==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/ansi-html": {
+            "version": "0.0.7",
+            "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
+            "integrity": "sha1-gTWEAhliqenm/QOflA0S9WynhZ4=",
+            "dev": true,
+            "engines": [
+                "node >= 0.8.0"
+            ],
+            "bin": {
+                "ansi-html": "bin/ansi-html"
+            }
+        },
+        "node_modules/ansi-regex": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+            "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/ansi-styles": {
+            "version": "3.2.1",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
+            "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+            "dependencies": {
+                "color-convert": "^1.9.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/any-promise": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz",
+            "integrity": "sha1-q8av7tzqUugJzcA3au0845Y10X8="
+        },
+        "node_modules/anymatch": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-2.0.0.tgz",
+            "integrity": "sha512-5teOsQWABXHHBFP9y3skS5P3d/WfWXpv3FUpy+LorMrNYaT9pI4oLMQX7jzQ2KklNpGpWHzdCXTDT2Y3XGlZBw==",
+            "dependencies": {
+                "micromatch": "^3.1.4",
+                "normalize-path": "^2.1.1"
+            }
+        },
+        "node_modules/anymatch/node_modules/normalize-path": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
+            "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk=",
+            "dependencies": {
+                "remove-trailing-separator": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/aproba": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz",
+            "integrity": "sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw=="
+        },
+        "node_modules/archiver": {
+            "version": "3.1.1",
+            "resolved": "https://registry.npmjs.org/archiver/-/archiver-3.1.1.tgz",
+            "integrity": "sha512-5Hxxcig7gw5Jod/8Gq0OneVgLYET+oNHcxgWItq4TbhOzRLKNAFUb9edAftiMKXvXfCB0vbGrJdZDNq0dWMsxg==",
+            "dependencies": {
+                "archiver-utils": "^2.1.0",
+                "async": "^2.6.3",
+                "buffer-crc32": "^0.2.1",
+                "glob": "^7.1.4",
+                "readable-stream": "^3.4.0",
+                "tar-stream": "^2.1.0",
+                "zip-stream": "^2.1.2"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/archiver-utils": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/archiver-utils/-/archiver-utils-2.1.0.tgz",
+            "integrity": "sha512-bEL/yUb/fNNiNTuUz979Z0Yg5L+LzLxGJz8x79lYmR54fmTIb6ob/hNQgkQnIUDWIFjZVQwl9Xs356I6BAMHfw==",
+            "dependencies": {
+                "glob": "^7.1.4",
+                "graceful-fs": "^4.2.0",
+                "lazystream": "^1.0.0",
+                "lodash.defaults": "^4.2.0",
+                "lodash.difference": "^4.5.0",
+                "lodash.flatten": "^4.4.0",
+                "lodash.isplainobject": "^4.0.6",
+                "lodash.union": "^4.6.0",
+                "normalize-path": "^3.0.0",
+                "readable-stream": "^2.0.0"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/archiver-utils/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/are-we-there-yet": {
+            "version": "1.1.5",
+            "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.5.tgz",
+            "integrity": "sha512-5hYdAkZlcG8tOLujVDTgCT+uPX0VnpAH28gWsLfzpXYm7wP6mp5Q/gYyR7YQ0cKVJcXJnl3j2kpBan13PtQf6w==",
+            "dependencies": {
+                "delegates": "^1.0.0",
+                "readable-stream": "^2.0.6"
+            }
+        },
+        "node_modules/are-we-there-yet/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/arg": {
+            "version": "4.1.3",
+            "resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz",
+            "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==",
+            "dev": true
+        },
+        "node_modules/argparse": {
+            "version": "1.0.10",
+            "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
+            "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
+            "dependencies": {
+                "sprintf-js": "~1.0.2"
+            }
+        },
+        "node_modules/arr-diff": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-4.0.0.tgz",
+            "integrity": "sha1-1kYQdP6/7HHn4VI1dhoyml3HxSA=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/arr-flatten": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.1.0.tgz",
+            "integrity": "sha512-L3hKV5R/p5o81R7O02IGnwpDmkp6E982XhtbuwSe3O4qOtMMMtodicASA1Cny2U+aCXcNpml+m4dPsvsJ3jatg==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/arr-union": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/arr-union/-/arr-union-3.1.0.tgz",
+            "integrity": "sha1-45sJrqne+Gao8gbiiK9jkZuuOcQ=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/array-back": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/array-back/-/array-back-2.0.0.tgz",
+            "integrity": "sha512-eJv4pLLufP3g5kcZry0j6WXpIbzYw9GUB4mVJZno9wfwiBxbizTnHCw3VJb07cBihbFX48Y7oSrW9y+gt4glyw==",
+            "dependencies": {
+                "typical": "^2.6.1"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/array-batcher": {
+            "version": "1.2.3",
+            "resolved": "https://registry.npmjs.org/array-batcher/-/array-batcher-1.2.3.tgz",
+            "integrity": "sha512-/IOrwn4ZJi7YqTZrs3k+wQN5nKhjtTqL5ZKkzB+sKJlPeJzpMnRc3o8T9yt8/ZJiSldd+PwTHjM+//UsaszOOw==",
+            "dependencies": {
+                "@types/node": "^12.7.5",
+                "chai": "^4.2.0",
+                "mocha": "^6.2.0",
+                "request": "^2.88.0",
+                "request-promise": "^4.2.4"
+            }
+        },
+        "node_modules/array-batcher/node_modules/@types/node": {
+            "version": "12.12.37",
+            "resolved": "https://registry.npmjs.org/@types/node/-/node-12.12.37.tgz",
+            "integrity": "sha512-4mXKoDptrXAwZErQHrLzpe0FN/0Wmf5JRniSVIdwUrtDf9wnmEV1teCNLBo/TwuXhkK/bVegoEn/wmb+x0AuPg=="
+        },
+        "node_modules/array-batcher/node_modules/glob": {
+            "version": "7.1.3",
+            "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.3.tgz",
+            "integrity": "sha512-vcfuiIxogLV4DlGBHIUOwI0IbrJ8HWPc4MU7HzviGeNho/UJDfi6B5p3sHeWIQ0KGIU0Jpxi5ZHxemQfLkkAwQ==",
+            "dependencies": {
+                "fs.realpath": "^1.0.0",
+                "inflight": "^1.0.4",
+                "inherits": "2",
+                "minimatch": "^3.0.4",
+                "once": "^1.3.0",
+                "path-is-absolute": "^1.0.0"
+            },
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/array-batcher/node_modules/mocha": {
+            "version": "6.2.3",
+            "resolved": "https://registry.npmjs.org/mocha/-/mocha-6.2.3.tgz",
+            "integrity": "sha512-0R/3FvjIGH3eEuG17ccFPk117XL2rWxatr81a57D+r/x2uTYZRbdZ4oVidEUMh2W2TJDa7MdAb12Lm2/qrKajg==",
+            "dependencies": {
+                "ansi-colors": "3.2.3",
+                "browser-stdout": "1.3.1",
+                "debug": "3.2.6",
+                "diff": "3.5.0",
+                "escape-string-regexp": "1.0.5",
+                "find-up": "3.0.0",
+                "glob": "7.1.3",
+                "growl": "1.10.5",
+                "he": "1.2.0",
+                "js-yaml": "3.13.1",
+                "log-symbols": "2.2.0",
+                "minimatch": "3.0.4",
+                "mkdirp": "0.5.4",
+                "ms": "2.1.1",
+                "node-environment-flags": "1.0.5",
+                "object.assign": "4.1.0",
+                "strip-json-comments": "2.0.1",
+                "supports-color": "6.0.0",
+                "which": "1.3.1",
+                "wide-align": "1.1.3",
+                "yargs": "13.3.2",
+                "yargs-parser": "13.1.2",
+                "yargs-unparser": "1.6.0"
+            },
+            "bin": {
+                "_mocha": "bin/_mocha",
+                "mocha": "bin/mocha"
+            },
+            "engines": {
+                "node": ">= 6.0.0"
+            }
+        },
+        "node_modules/array-batcher/node_modules/supports-color": {
+            "version": "6.0.0",
+            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.0.0.tgz",
+            "integrity": "sha512-on9Kwidc1IUQo+bQdhi8+Tijpo0e1SS6RoGo2guUwn5vdaxw8RXOF9Vb2ws+ihWOmh4JnCJOvaziZWP1VABaLg==",
+            "dependencies": {
+                "has-flag": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/array-equal": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
+            "integrity": "sha1-jCpe8kcv2ep0KwTHenUJO6J1fJM=",
+            "dev": true
+        },
+        "node_modules/array-find-index": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz",
+            "integrity": "sha1-3wEKoSh+Fku9pvlyOwqWoexBh6E=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/array-flatten": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
+            "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
+        },
+        "node_modules/array-union": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
+            "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk=",
+            "dev": true,
+            "dependencies": {
+                "array-uniq": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/array-uniq": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
+            "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/array-unique": {
+            "version": "0.3.2",
+            "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
+            "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/arraybuffer.slice": {
+            "version": "0.0.7",
+            "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.7.tgz",
+            "integrity": "sha512-wGUIVQXuehL5TCqQun8OW81jGzAWycqzFF8lFp+GOM5BXLYj3bKNsYC4daB7n6XjCqxQA/qgTJ+8ANR3acjrog=="
+        },
+        "node_modules/arrify": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/arrify/-/arrify-2.0.1.tgz",
+            "integrity": "sha512-3duEwti880xqi4eAMN8AyR4a0ByT90zoYdLlevfrvU43vb0YZwZVfxOgxWrLXXXpyugL0hNZc9G6BiB5B3nUug==",
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/asap": {
+            "version": "2.0.6",
+            "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
+            "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
+        },
+        "node_modules/asn1": {
+            "version": "0.2.4",
+            "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.4.tgz",
+            "integrity": "sha512-jxwzQpLQjSmWXgwaCZE9Nz+glAG01yF1QnWgbhGwHI5A6FRIEY6IVqtHhIepHqI7/kyEyQEagBC5mBEFlIYvdg==",
+            "dependencies": {
+                "safer-buffer": "~2.1.0"
+            }
+        },
+        "node_modules/asn1.js": {
+            "version": "5.4.1",
+            "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-5.4.1.tgz",
+            "integrity": "sha512-+I//4cYPccV8LdmBLiX8CYvf9Sp3vQsrqu2QNXRcrbiWvcx/UdlFiqUJJzxRQxgsZmvhXhn4cSKeSmoFjVdupA==",
+            "dev": true,
+            "dependencies": {
+                "bn.js": "^4.0.0",
+                "inherits": "^2.0.1",
+                "minimalistic-assert": "^1.0.0",
+                "safer-buffer": "^2.1.0"
+            }
+        },
+        "node_modules/asn1.js/node_modules/bn.js": {
+            "version": "4.12.0",
+            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
+            "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==",
+            "dev": true
+        },
+        "node_modules/assert": {
+            "version": "1.5.0",
+            "resolved": "https://registry.npmjs.org/assert/-/assert-1.5.0.tgz",
+            "integrity": "sha512-EDsgawzwoun2CZkCgtxJbv392v4nbk9XDD06zI+kQYoBM/3RBWLlEyJARDOmhAAosBjWACEkKL6S+lIZtcAubA==",
+            "dev": true,
+            "dependencies": {
+                "object-assign": "^4.1.1",
+                "util": "0.10.3"
+            }
+        },
+        "node_modules/assert-plus": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+            "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
+            "engines": {
+                "node": ">=0.8"
+            }
+        },
+        "node_modules/assert/node_modules/inherits": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.1.tgz",
+            "integrity": "sha1-sX0I0ya0Qj5Wjv9xn5GwscvfafE=",
+            "dev": true
+        },
+        "node_modules/assert/node_modules/util": {
+            "version": "0.10.3",
+            "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
+            "integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=",
+            "dev": true,
+            "dependencies": {
+                "inherits": "2.0.1"
+            }
+        },
+        "node_modules/assertion-error": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.1.0.tgz",
+            "integrity": "sha512-jgsaNduz+ndvGyFt3uSuWqvy4lCnIJiovtouQN5JZHOKCS2QuhEdbcQHFhVksz2N2U9hXJo8odG7ETyWlEeuDw==",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/assign-symbols": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/assign-symbols/-/assign-symbols-1.0.0.tgz",
+            "integrity": "sha1-WWZ/QfrdTyDMvCu5a41Pf3jsA2c=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/async": {
+            "version": "2.6.3",
+            "resolved": "https://registry.npmjs.org/async/-/async-2.6.3.tgz",
+            "integrity": "sha512-zflvls11DCy+dQWzTW2dzuilv8Z5X/pjfmZOWba6TNIVDm+2UDaJmXSOXlasHKfNBs8oo3M0aT50fDEWfKZjXg==",
+            "dependencies": {
+                "lodash": "^4.17.14"
+            }
+        },
+        "node_modules/async-each": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.3.tgz",
+            "integrity": "sha512-z/WhQ5FPySLdvREByI2vZiTWwCnF0moMJ1hK9YQwDTHKh6I7/uSckMetoRGb5UBZPC1z0jlw+n/XCgjeH7y1AQ=="
+        },
+        "node_modules/async-foreach": {
+            "version": "0.1.3",
+            "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz",
+            "integrity": "sha1-NhIfhFwFeBct5Bmpfb6x0W7DRUI=",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/async-limiter": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/async-limiter/-/async-limiter-1.0.1.tgz",
+            "integrity": "sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ=="
+        },
+        "node_modules/asynckit": {
+            "version": "0.4.0",
+            "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+            "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
+        },
+        "node_modules/atob": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz",
+            "integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==",
+            "bin": {
+                "atob": "bin/atob.js"
+            },
+            "engines": {
+                "node": ">= 4.5.0"
+            }
+        },
+        "node_modules/awesome-typescript-loader": {
+            "version": "5.2.1",
+            "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-5.2.1.tgz",
+            "integrity": "sha512-slv66OAJB8orL+UUaTI3pKlLorwIvS4ARZzYR9iJJyGsEgOqueMfOMdKySWzZ73vIkEe3fcwFgsKMg4d8zyb1g==",
+            "dev": true,
+            "dependencies": {
+                "chalk": "^2.4.1",
+                "enhanced-resolve": "^4.0.0",
+                "loader-utils": "^1.1.0",
+                "lodash": "^4.17.5",
+                "micromatch": "^3.1.9",
+                "mkdirp": "^0.5.1",
+                "source-map-support": "^0.5.3",
+                "webpack-log": "^1.2.0"
+            }
+        },
+        "node_modules/aws-sign2": {
+            "version": "0.7.0",
+            "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.7.0.tgz",
+            "integrity": "sha1-tG6JCTSpWR8tL2+G1+ap8bP+dqg=",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/aws4": {
+            "version": "1.9.1",
+            "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.9.1.tgz",
+            "integrity": "sha512-wMHVg2EOHaMRxbzgFJ9gtjOOCrI80OHLG14rxi28XwOW8ux6IiEbRCGGGqCtdAIg4FQCbW20k9RsT4y3gJlFug=="
+        },
+        "node_modules/axios": {
+            "version": "0.19.2",
+            "resolved": "https://registry.npmjs.org/axios/-/axios-0.19.2.tgz",
+            "integrity": "sha512-fjgm5MvRHLhx+osE2xoekY70AhARk3a6hkN+3Io1jc00jtquGvxYlKlsFUhmUET0V5te6CcZI7lcv2Ym61mjHA==",
+            "dependencies": {
+                "follow-redirects": "1.5.10"
+            }
+        },
+        "node_modules/axios/node_modules/debug": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+            "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/axios/node_modules/follow-redirects": {
+            "version": "1.5.10",
+            "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
+            "integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
+            "dependencies": {
+                "debug": "=3.1.0"
+            },
+            "engines": {
+                "node": ">=4.0"
+            }
+        },
+        "node_modules/axios/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        },
+        "node_modules/babel-code-frame": {
+            "version": "6.26.0",
+            "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
+            "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=",
+            "dev": true,
+            "dependencies": {
+                "chalk": "^1.1.3",
+                "esutils": "^2.0.2",
+                "js-tokens": "^3.0.2"
+            }
+        },
+        "node_modules/babel-code-frame/node_modules/ansi-regex": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+            "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/babel-code-frame/node_modules/ansi-styles": {
+            "version": "2.2.1",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+            "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/babel-code-frame/node_modules/chalk": {
+            "version": "1.1.3",
+            "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+            "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+            "dev": true,
+            "dependencies": {
+                "ansi-styles": "^2.2.1",
+                "escape-string-regexp": "^1.0.2",
+                "has-ansi": "^2.0.0",
+                "strip-ansi": "^3.0.0",
+                "supports-color": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/babel-code-frame/node_modules/js-tokens": {
+            "version": "3.0.2",
+            "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz",
+            "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=",
+            "dev": true
+        },
+        "node_modules/babel-code-frame/node_modules/strip-ansi": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+            "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
+            "dev": true,
+            "dependencies": {
+                "ansi-regex": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/babel-code-frame/node_modules/supports-color": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+            "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.8.0"
+            }
+        },
+        "node_modules/babel-plugin-emotion": {
+            "version": "10.0.33",
+            "resolved": "https://registry.npmjs.org/babel-plugin-emotion/-/babel-plugin-emotion-10.0.33.tgz",
+            "integrity": "sha512-bxZbTTGz0AJQDHm8k6Rf3RQJ8tX2scsfsRyKVgAbiUPUNIRtlK+7JxP+TAd1kRLABFxe0CFm2VdK4ePkoA9FxQ==",
+            "dependencies": {
+                "@babel/helper-module-imports": "^7.0.0",
+                "@emotion/hash": "0.8.0",
+                "@emotion/memoize": "0.7.4",
+                "@emotion/serialize": "^0.11.16",
+                "babel-plugin-macros": "^2.0.0",
+                "babel-plugin-syntax-jsx": "^6.18.0",
+                "convert-source-map": "^1.5.0",
+                "escape-string-regexp": "^1.0.5",
+                "find-root": "^1.1.0",
+                "source-map": "^0.5.7"
+            }
+        },
+        "node_modules/babel-plugin-macros": {
+            "version": "2.8.0",
+            "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz",
+            "integrity": "sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg==",
+            "dependencies": {
+                "@babel/runtime": "^7.7.2",
+                "cosmiconfig": "^6.0.0",
+                "resolve": "^1.12.0"
+            }
+        },
+        "node_modules/babel-plugin-styled-components": {
+            "version": "1.10.7",
+            "resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-1.10.7.tgz",
+            "integrity": "sha512-MBMHGcIA22996n9hZRf/UJLVVgkEOITuR2SvjHLb5dSTUyR4ZRGn+ngITapes36FI3WLxZHfRhkA1ffHxihOrg==",
+            "dependencies": {
+                "@babel/helper-annotate-as-pure": "^7.0.0",
+                "@babel/helper-module-imports": "^7.0.0",
+                "babel-plugin-syntax-jsx": "^6.18.0",
+                "lodash": "^4.17.11"
+            }
+        },
+        "node_modules/babel-plugin-syntax-jsx": {
+            "version": "6.18.0",
+            "resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
+            "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY="
+        },
+        "node_modules/babel-runtime": {
+            "version": "6.26.0",
+            "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
+            "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
+            "dependencies": {
+                "core-js": "^2.4.0",
+                "regenerator-runtime": "^0.11.0"
+            }
+        },
+        "node_modules/babel-runtime/node_modules/core-js": {
+            "version": "2.6.11",
+            "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.11.tgz",
+            "integrity": "sha512-5wjnpaT/3dV+XB4borEsnAYQchn00XSgTAWKDkEqv+K8KevjbzmofK6hfJ9TZIlpj2N0xQpazy7PiRQiWHqzWg==",
+            "hasInstallScript": true
+        },
+        "node_modules/babel-runtime/node_modules/regenerator-runtime": {
+            "version": "0.11.1",
+            "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
+            "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg=="
+        },
+        "node_modules/babel-types": {
+            "version": "6.26.0",
+            "resolved": "https://registry.npmjs.org/babel-types/-/babel-types-6.26.0.tgz",
+            "integrity": "sha1-o7Bz+Uq0nrb6Vc1lInozQ4BjJJc=",
+            "dependencies": {
+                "babel-runtime": "^6.26.0",
+                "esutils": "^2.0.2",
+                "lodash": "^4.17.4",
+                "to-fast-properties": "^1.0.3"
+            }
+        },
+        "node_modules/babel-types/node_modules/to-fast-properties": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-1.0.3.tgz",
+            "integrity": "sha1-uDVx+k2MJbguIxsG46MFXeTKGkc=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/babylon": {
+            "version": "6.18.0",
+            "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.18.0.tgz",
+            "integrity": "sha512-q/UEjfGJ2Cm3oKV71DJz9d25TPnq5rhBVL2Q4fA5wcC3jcrdn7+SssEybFIxwAvvP+YCsCYNKughoF33GxgycQ==",
+            "bin": {
+                "babylon": "bin/babylon.js"
+            }
+        },
+        "node_modules/backo2": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
+            "integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc="
+        },
+        "node_modules/balanced-match": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
+            "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c="
+        },
+        "node_modules/base": {
+            "version": "0.11.2",
+            "resolved": "https://registry.npmjs.org/base/-/base-0.11.2.tgz",
+            "integrity": "sha512-5T6P4xPgpp0YDFvSWwEZ4NoE3aM4QBQXDzmVbraCkFj8zHM+mba8SyqB5DbZWyR7mYHo6Y7BdQo3MoA4m0TeQg==",
+            "dependencies": {
+                "cache-base": "^1.0.1",
+                "class-utils": "^0.3.5",
+                "component-emitter": "^1.2.1",
+                "define-property": "^1.0.0",
+                "isobject": "^3.0.1",
+                "mixin-deep": "^1.2.0",
+                "pascalcase": "^0.1.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/base/node_modules/define-property": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
+            "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
+            "dependencies": {
+                "is-descriptor": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/base/node_modules/is-accessor-descriptor": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-1.0.0.tgz",
+            "integrity": "sha512-m5hnHTkcVsPfqx3AKlyttIPb7J+XykHvJP2B9bZDjlhLIoEq4XoK64Vg7boZlVWYK6LUY94dYPEE7Lh0ZkZKcQ==",
+            "dependencies": {
+                "kind-of": "^6.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/base/node_modules/is-data-descriptor": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-1.0.0.tgz",
+            "integrity": "sha512-jbRXy1FmtAoCjQkVmIVYwuuqDFUbaOeDjmed1tOGPrsMhtJA4rD9tkgA0F1qJ3gRFRXcHYVkdeaP50Q5rE/jLQ==",
+            "dependencies": {
+                "kind-of": "^6.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/base/node_modules/is-descriptor": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.2.tgz",
+            "integrity": "sha512-2eis5WqQGV7peooDyLmNEPUrps9+SXX5c9pL3xEB+4e9HnGuDa7mB7kHxHw4CbqS9k1T2hOH3miL8n8WtiYVtg==",
+            "dependencies": {
+                "is-accessor-descriptor": "^1.0.0",
+                "is-data-descriptor": "^1.0.0",
+                "kind-of": "^6.0.2"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/base16": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/base16/-/base16-1.0.0.tgz",
+            "integrity": "sha1-4pf2DX7BAUp6lxo568ipjAtoHnA="
+        },
+        "node_modules/base64-arraybuffer": {
+            "version": "0.1.5",
+            "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz",
+            "integrity": "sha1-c5JncZI7Whl0etZmqlzUv5xunOg=",
+            "engines": {
+                "node": ">= 0.6.0"
+            }
+        },
+        "node_modules/base64-js": {
+            "version": "1.3.1",
+            "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.3.1.tgz",
+            "integrity": "sha512-mLQ4i2QO1ytvGWFWmcngKO//JXAQueZvwEKtjgQFM4jIK0kU+ytMfplL8j+n5mspOfjHwoAg+9yhb7BwAHm36g=="
+        },
+        "node_modules/base64id": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/base64id/-/base64id-2.0.0.tgz",
+            "integrity": "sha512-lGe34o6EHj9y3Kts9R4ZYs/Gr+6N7MCaMlIFA3F1R2O5/m7K06AxfSeO5530PEERE6/WyEg3lsuyw4GHlPZHog==",
+            "engines": {
+                "node": "^4.5.0 || >= 5.9"
+            }
+        },
+        "node_modules/base64url": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/base64url/-/base64url-3.0.1.tgz",
+            "integrity": "sha512-ir1UPr3dkwexU7FdV8qBBbNDRUhMmIekYMFZfi+C/sLNnRESKPl23nB9b2pltqfOQNnGzsDdId90AEtG5tCx4A==",
+            "engines": {
+                "node": ">=6.0.0"
+            }
+        },
+        "node_modules/batch": {
+            "version": "0.6.1",
+            "resolved": "https://registry.npmjs.org/batch/-/batch-0.6.1.tgz",
+            "integrity": "sha1-3DQxT05nkxgJP8dgJyUl+UvyXBY=",
+            "dev": true
+        },
+        "node_modules/bcrypt-nodejs": {
+            "version": "0.0.3",
+            "resolved": "https://registry.npmjs.org/bcrypt-nodejs/-/bcrypt-nodejs-0.0.3.tgz",
+            "integrity": "sha1-xgkX8m3CNWYVZsaBBhwwPCsohCs="
+        },
+        "node_modules/bcrypt-pbkdf": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.2.tgz",
+            "integrity": "sha1-pDAdOJtqQ/m2f/PKEaP2Y342Dp4=",
+            "dependencies": {
+                "tweetnacl": "^0.14.3"
+            }
+        },
+        "node_modules/better-assert": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz",
+            "integrity": "sha1-QIZrnhueC1W0gYlDEeaPr/rrxSI=",
+            "dependencies": {
+                "callsite": "1.0.0"
+            },
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/bezier-curve": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/bezier-curve/-/bezier-curve-1.0.0.tgz",
+            "integrity": "sha1-o9+v6rEqlMRicw1QeYxSqEBdc3k="
+        },
+        "node_modules/big.js": {
+            "version": "5.2.2",
+            "resolved": "https://registry.npmjs.org/big.js/-/big.js-5.2.2.tgz",
+            "integrity": "sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/bignumber.js": {
+            "version": "7.2.1",
+            "resolved": "https://registry.npmjs.org/bignumber.js/-/bignumber.js-7.2.1.tgz",
+            "integrity": "sha512-S4XzBk5sMB+Rcb/LNcpzXr57VRTxgAvaAEDAl1AwRx27j00hT84O6OkteE7u8UB3NuaaygCRrEpqox4uDOrbdQ==",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/binary-extensions": {
+            "version": "1.13.1",
+            "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.13.1.tgz",
+            "integrity": "sha512-Un7MIEDdUC5gNpcGDV97op1Ywk748MpHcFTHoYs6qnj1Z3j7I53VG3nwZhKzoBZmbdRNnb6WRdFlwl7tSDuZGw==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/bindings": {
+            "version": "1.3.1",
+            "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.3.1.tgz",
+            "integrity": "sha512-i47mqjF9UbjxJhxGf+pZ6kSxrnI3wBLlnGI2ArWJ4r0VrvDS7ZYXkprq/pLaBWYq4GM0r4zdHY+NNRqEMU7uew=="
+        },
+        "node_modules/bl": {
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/bl/-/bl-4.0.2.tgz",
+            "integrity": "sha512-j4OH8f6Qg2bGuWfRiltT2HYGx0e1QcBTrK9KAHNMwMZdQnDZFk0ZSYIpADjYCB3U12nicC5tVJwSIhwOWjb4RQ==",
+            "dependencies": {
+                "buffer": "^5.5.0",
+                "inherits": "^2.0.4",
+                "readable-stream": "^3.4.0"
+            }
+        },
+        "node_modules/blob": {
+            "version": "0.0.5",
+            "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.5.tgz",
+            "integrity": "sha512-gaqbzQPqOoamawKg0LGVd7SzLgXS+JH61oWprSLH+P+abTczqJbhTR8CmJ2u9/bUYNmHTGJx/UEmn6doAvvuig=="
+        },
+        "node_modules/block-stream": {
+            "version": "0.0.9",
+            "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz",
+            "integrity": "sha1-E+v+d4oDIFz+A3UUgeu0szAMEmo=",
+            "dependencies": {
+                "inherits": "~2.0.0"
+            },
+            "engines": {
+                "node": "0.4 || >=0.5.8"
+            }
+        },
+        "node_modules/bluebird": {
+            "version": "3.7.2",
+            "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz",
+            "integrity": "sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg=="
+        },
+        "node_modules/blueimp-load-image": {
+            "version": "2.31.0",
+            "resolved": "https://registry.npmjs.org/blueimp-load-image/-/blueimp-load-image-2.31.0.tgz",
+            "integrity": "sha512-6sTGh1OiUmuH8ftAYvUzALivoOmcnahinGmjZFI4puZVowXoKTn/bXtth7N1skW5AlezEOfjgFH4lNXHeNRQog=="
+        },
+        "node_modules/bn.js": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-5.2.0.tgz",
+            "integrity": "sha512-D7iWRBvnZE8ecXiLj/9wbxH7Tk79fAh8IHaTNq1RWRixsS02W+5qS+iE9yq6RYl0asXx5tw0bLhmT5pIfbSquw==",
+            "dev": true
+        },
+        "node_modules/body-parser": {
+            "version": "1.19.0",
+            "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.19.0.tgz",
+            "integrity": "sha512-dhEPs72UPbDnAQJ9ZKMNTP6ptJaionhP5cBb541nXPlW60Jepo9RV/a4fX4XWW9CuFNK22krhrj1+rgzifNCsw==",
+            "dependencies": {
+                "bytes": "3.1.0",
+                "content-type": "~1.0.4",
+                "debug": "2.6.9",
+                "depd": "~1.1.2",
+                "http-errors": "1.7.2",
+                "iconv-lite": "0.4.24",
+                "on-finished": "~2.3.0",
+                "qs": "6.7.0",
+                "raw-body": "2.4.0",
+                "type-is": "~1.6.17"
+            },
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/body-parser/node_modules/debug": {
+            "version": "2.6.9",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/body-parser/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        },
+        "node_modules/body-parser/node_modules/qs": {
+            "version": "6.7.0",
+            "resolved": "https://registry.npmjs.org/qs/-/qs-6.7.0.tgz",
+            "integrity": "sha512-VCdBRNFTX1fyE7Nb6FYoURo/SPe62QCaAyzJvUjwRaIsc+NePBEniHlvxFmmX56+HZphIGtV0XeCirBtpDrTyQ==",
+            "engines": {
+                "node": ">=0.6"
+            }
+        },
+        "node_modules/bonjour": {
+            "version": "3.5.0",
+            "resolved": "https://registry.npmjs.org/bonjour/-/bonjour-3.5.0.tgz",
+            "integrity": "sha1-jokKGD2O6aI5OzhExpGkK897yfU=",
+            "dev": true,
+            "dependencies": {
+                "array-flatten": "^2.1.0",
+                "deep-equal": "^1.0.1",
+                "dns-equal": "^1.0.0",
+                "dns-txt": "^2.0.2",
+                "multicast-dns": "^6.0.1",
+                "multicast-dns-service-types": "^1.1.0"
+            }
+        },
+        "node_modules/bonjour/node_modules/array-flatten": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-2.1.2.tgz",
+            "integrity": "sha512-hNfzcOV8W4NdualtqBFPyVO+54DSJuZGY9qT4pRroB6S9e3iiido2ISIC5h9R2sPJ8H3FHCIiEnsv1lPXO3KtQ==",
+            "dev": true
+        },
+        "node_modules/boolbase": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
+            "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
+        },
+        "node_modules/bootstrap": {
+            "version": "4.5.0",
+            "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.5.0.tgz",
+            "integrity": "sha512-Z93QoXvodoVslA+PWNdk23Hze4RBYIkpb5h8I2HY2Tu2h7A0LpAgLcyrhrSUyo2/Oxm2l1fRZPs1e5hnxnliXA=="
+        },
+        "node_modules/bowser": {
+            "version": "1.9.4",
+            "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.9.4.tgz",
+            "integrity": "sha512-9IdMmj2KjigRq6oWhmwv1W36pDuA4STQZ8q6YO9um+x07xgYNCD3Oou+WP/3L1HNz7iqythGet3/p4wvc8AAwQ=="
+        },
+        "node_modules/boxen": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.3.0.tgz",
+            "integrity": "sha512-TNPjfTr432qx7yOjQyaXm3dSR0MH9vXp7eT1BFSl/C51g+EFnOR9hTg1IreahGBmDNCehscshe45f+C1TBZbLw==",
+            "dependencies": {
+                "ansi-align": "^2.0.0",
+                "camelcase": "^4.0.0",
+                "chalk": "^2.0.1",
+                "cli-boxes": "^1.0.0",
+                "string-width": "^2.0.0",
+                "term-size": "^1.2.0",
+                "widest-line": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/boxen/node_modules/camelcase": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+            "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/brace-expansion": {
+            "version": "1.1.11",
+            "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
+            "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+            "dependencies": {
+                "balanced-match": "^1.0.0",
+                "concat-map": "0.0.1"
+            }
+        },
+        "node_modules/braces": {
+            "version": "2.3.2",
+            "resolved": "https://registry.npmjs.org/braces/-/braces-2.3.2.tgz",
+            "integrity": "sha512-aNdbnj9P8PjdXU4ybaWLK2IF3jc/EoDYbC7AazW6to3TRsfXxscC9UXOB5iDiEQrkyIbWp2SLQda4+QAa7nc3w==",
+            "dependencies": {
+                "arr-flatten": "^1.1.0",
+                "array-unique": "^0.3.2",
+                "extend-shallow": "^2.0.1",
+                "fill-range": "^4.0.0",
+                "isobject": "^3.0.1",
+                "repeat-element": "^1.1.2",
+                "snapdragon": "^0.8.1",
+                "snapdragon-node": "^2.0.1",
+                "split-string": "^3.0.2",
+                "to-regex": "^3.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/braces/node_modules/extend-shallow": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+            "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+            "dependencies": {
+                "is-extendable": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/braces/node_modules/is-extendable": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
+            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/brorand": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz",
+            "integrity": "sha1-EsJe/kCkXjwyPrhnWgoM5XsiNx8=",
+            "dev": true
+        },
+        "node_modules/browser-process-hrtime": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/browser-process-hrtime/-/browser-process-hrtime-1.0.0.tgz",
+            "integrity": "sha512-9o5UecI3GhkpM6DrXr69PblIuWxPKk9Y0jHBRhdocZ2y7YECBFCsHm79Pr3OyR2AvjhDkabFJaDJMYRazHgsow==",
+            "dev": true
+        },
+        "node_modules/browser-stdout": {
+            "version": "1.3.1",
+            "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.1.tgz",
+            "integrity": "sha512-qhAVI1+Av2X7qelOfAIYwXONood6XlZE/fXaBSmW/T5SzLAmCgzi+eiWE7fUvbHaeNBQH13UftjpXxsfLkMpgw=="
+        },
+        "node_modules/browserify-aes": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz",
+            "integrity": "sha512-+7CHXqGuspUn/Sl5aO7Ea0xWGAtETPXNSAjHo48JfLdPWcMng33Xe4znFvQweqc/uzk5zSOI3H52CYnjCfb5hA==",
+            "dev": true,
+            "dependencies": {
+                "buffer-xor": "^1.0.3",
+                "cipher-base": "^1.0.0",
+                "create-hash": "^1.1.0",
+                "evp_bytestokey": "^1.0.3",
+                "inherits": "^2.0.1",
+                "safe-buffer": "^5.0.1"
+            }
+        },
+        "node_modules/browserify-cipher": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/browserify-cipher/-/browserify-cipher-1.0.1.tgz",
+            "integrity": "sha512-sPhkz0ARKbf4rRQt2hTpAHqn47X3llLkUGn+xEJzLjwY8LRs2p0v7ljvI5EyoRO/mexrNunNECisZs+gw2zz1w==",
+            "dev": true,
+            "dependencies": {
+                "browserify-aes": "^1.0.4",
+                "browserify-des": "^1.0.0",
+                "evp_bytestokey": "^1.0.0"
+            }
+        },
+        "node_modules/browserify-des": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.2.tgz",
+            "integrity": "sha512-BioO1xf3hFwz4kc6iBhI3ieDFompMhrMlnDFC4/0/vd5MokpuAc3R+LYbwTA9A5Yc9pq9UYPqffKpW2ObuwX5A==",
+            "dev": true,
+            "dependencies": {
+                "cipher-base": "^1.0.1",
+                "des.js": "^1.0.0",
+                "inherits": "^2.0.1",
+                "safe-buffer": "^5.1.2"
+            }
+        },
+        "node_modules/browserify-rsa": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.1.0.tgz",
+            "integrity": "sha512-AdEER0Hkspgno2aR97SAf6vi0y0k8NuOpGnVH3O99rcA5Q6sh8QxcngtHuJ6uXwnfAXNM4Gn1Gb7/MV1+Ymbog==",
+            "dev": true,
+            "dependencies": {
+                "bn.js": "^5.0.0",
+                "randombytes": "^2.0.1"
+            }
+        },
+        "node_modules/browserify-sign": {
+            "version": "4.2.1",
+            "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.2.1.tgz",
+            "integrity": "sha512-/vrA5fguVAKKAVTNJjgSm1tRQDHUU6DbwO9IROu/0WAzC8PKhucDSh18J0RMvVeHAn5puMd+QHC2erPRNf8lmg==",
+            "dev": true,
+            "dependencies": {
+                "bn.js": "^5.1.1",
+                "browserify-rsa": "^4.0.1",
+                "create-hash": "^1.2.0",
+                "create-hmac": "^1.1.7",
+                "elliptic": "^6.5.3",
+                "inherits": "^2.0.4",
+                "parse-asn1": "^5.1.5",
+                "readable-stream": "^3.6.0",
+                "safe-buffer": "^5.2.0"
+            }
+        },
+        "node_modules/browserify-sign/node_modules/safe-buffer": {
+            "version": "5.2.1",
+            "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
+            "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
+            "dev": true
+        },
+        "node_modules/browserify-zlib": {
+            "version": "0.2.0",
+            "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.2.0.tgz",
+            "integrity": "sha512-Z942RysHXmJrhqk88FmKBVq/v5tqmSkDz7p54G/MGyjMnCFFnC79XWNbg+Vta8W6Wb2qtSZTSxIGkJrRpCFEiA==",
+            "dev": true,
+            "dependencies": {
+                "pako": "~1.0.5"
+            }
+        },
+        "node_modules/bson": {
+            "version": "1.0.9",
+            "resolved": "https://registry.npmjs.org/bson/-/bson-1.0.9.tgz",
+            "integrity": "sha512-IQX9/h7WdMBIW/q/++tGd+emQr0XMdeZ6icnT/74Xk9fnabWn+gZgpE+9V+gujL3hhJOoNrnDVY7tWdzc7NUTg==",
+            "engines": {
+                "node": ">=0.6.19"
+            }
+        },
+        "node_modules/buffer": {
+            "version": "5.6.0",
+            "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.6.0.tgz",
+            "integrity": "sha512-/gDYp/UtU0eA1ys8bOs9J6a+E/KWIY+DZ+Q2WESNUA0jFRsJOc0SNUO6xJ5SGA1xueg3NL65W6s+NY5l9cunuw==",
+            "dependencies": {
+                "base64-js": "^1.0.2",
+                "ieee754": "^1.1.4"
+            }
+        },
+        "node_modules/buffer-crc32": {
+            "version": "0.2.13",
+            "resolved": "https://registry.npmjs.org/buffer-crc32/-/buffer-crc32-0.2.13.tgz",
+            "integrity": "sha1-DTM+PwDqxQqhRUq9MO+MKl2ackI=",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/buffer-equal-constant-time": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/buffer-equal-constant-time/-/buffer-equal-constant-time-1.0.1.tgz",
+            "integrity": "sha1-+OcRMvf/5uAaXJaXpMbz5I1cyBk="
+        },
+        "node_modules/buffer-from": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.1.tgz",
+            "integrity": "sha512-MQcXEUbCKtEo7bhqEs6560Hyd4XaovZlO/k9V3hjVUF/zwW7KBVdSK4gIt/bzwS9MbR5qob+F5jusZsb0YQK2A=="
+        },
+        "node_modules/buffer-indexof": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/buffer-indexof/-/buffer-indexof-1.1.1.tgz",
+            "integrity": "sha512-4/rOEg86jivtPTeOUUT61jJO1Ya1TrR/OkqCSZDyq84WJh3LuuiphBYJN+fm5xufIk4XAFcEwte/8WzC8If/1g==",
+            "dev": true
+        },
+        "node_modules/buffer-shims": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/buffer-shims/-/buffer-shims-1.0.0.tgz",
+            "integrity": "sha1-mXjOMXOIxkmth5MCjDR37wRKi1E="
+        },
+        "node_modules/buffer-xor": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz",
+            "integrity": "sha1-JuYe0UIvtw3ULm42cp7VHYVf6Nk=",
+            "dev": true
+        },
+        "node_modules/built-in-math-eval": {
+            "version": "0.3.0",
+            "resolved": "https://registry.npmjs.org/built-in-math-eval/-/built-in-math-eval-0.3.0.tgz",
+            "integrity": "sha1-JA3CHLOJQ5WIxhxGDrAHZJfvxBw=",
+            "dependencies": {
+                "math-codegen": "^0.3.5"
+            }
+        },
+        "node_modules/builtin-modules": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
+            "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/builtin-status-codes": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz",
+            "integrity": "sha1-hZgoeOIbmOHGZCXgPQF0eI9Wnug=",
+            "dev": true
+        },
+        "node_modules/bytes": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.0.tgz",
+            "integrity": "sha512-zauLjrfCG+xvoyaqLoV8bLVXXNGC4JqlxFCutSDWA6fJrTo2ZuvLYTqZ7aHBLZSMOopbzwv8f+wZcVzfVTI2Dg==",
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/cacache": {
+            "version": "10.0.4",
+            "resolved": "https://registry.npmjs.org/cacache/-/cacache-10.0.4.tgz",
+            "integrity": "sha512-Dph0MzuH+rTQzGPNT9fAnrPmMmjKfST6trxJeK7NQuHRaVw24VzPRWTmg9MpcwOVQZO0E1FBICUlFeNaKPIfHA==",
+            "dev": true,
+            "dependencies": {
+                "bluebird": "^3.5.1",
+                "chownr": "^1.0.1",
+                "glob": "^7.1.2",
+                "graceful-fs": "^4.1.11",
+                "lru-cache": "^4.1.1",
+                "mississippi": "^2.0.0",
+                "mkdirp": "^0.5.1",
+                "move-concurrently": "^1.0.1",
+                "promise-inflight": "^1.0.1",
+                "rimraf": "^2.6.2",
+                "ssri": "^5.2.4",
+                "unique-filename": "^1.1.0",
+                "y18n": "^4.0.0"
+            }
+        },
+        "node_modules/cacache/node_modules/lru-cache": {
+            "version": "4.1.5",
+            "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.5.tgz",
+            "integrity": "sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==",
+            "dev": true,
+            "dependencies": {
+                "pseudomap": "^1.0.2",
+                "yallist": "^2.1.2"
+            }
+        },
+        "node_modules/cacache/node_modules/rimraf": {
+            "version": "2.7.1",
+            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+            "dev": true,
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/cacache/node_modules/yallist": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz",
+            "integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI=",
+            "dev": true
+        },
+        "node_modules/cache-base": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/cache-base/-/cache-base-1.0.1.tgz",
+            "integrity": "sha512-AKcdTnFSWATd5/GCPRxr2ChwIJ85CeyrEyjRHlKxQ56d4XJMGym0uAiKn0xbLOGOl3+yRpOTi484dVCEc5AUzQ==",
+            "dependencies": {
+                "collection-visit": "^1.0.0",
+                "component-emitter": "^1.2.1",
+                "get-value": "^2.0.6",
+                "has-value": "^1.0.0",
+                "isobject": "^3.0.1",
+                "set-value": "^2.0.0",
+                "to-object-path": "^0.3.0",
+                "union-value": "^1.0.0",
+                "unset-value": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/caller-callsite": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/caller-callsite/-/caller-callsite-2.0.0.tgz",
+            "integrity": "sha1-hH4PzgoiN1CpoCfFSzNzGtMVQTQ=",
+            "dependencies": {
+                "callsites": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/caller-callsite/node_modules/callsites": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
+            "integrity": "sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/caller-path": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/caller-path/-/caller-path-2.0.0.tgz",
+            "integrity": "sha1-Ro+DBE42mrIBD6xfBs7uFbsssfQ=",
+            "dependencies": {
+                "caller-callsite": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/callsite": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz",
+            "integrity": "sha1-KAOY5dZkvXQDi28JBRU+borxvCA=",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/callsites": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
+            "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/camelcase": {
+            "version": "5.3.1",
+            "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
+            "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/camelcase-keys": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz",
+            "integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc=",
+            "dependencies": {
+                "camelcase": "^2.0.0",
+                "map-obj": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/camelcase-keys/node_modules/camelcase": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
+            "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/camelize": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/camelize/-/camelize-1.0.0.tgz",
+            "integrity": "sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs="
+        },
+        "node_modules/canvas": {
+            "version": "2.6.1",
+            "resolved": "https://registry.npmjs.org/canvas/-/canvas-2.6.1.tgz",
+            "integrity": "sha512-S98rKsPcuhfTcYbtF53UIJhcbgIAK533d1kJKMwsMwAIFgfd58MOyxRud3kktlzWiEkFliaJtvyZCBtud/XVEA==",
+            "hasInstallScript": true,
+            "dependencies": {
+                "nan": "^2.14.0",
+                "node-pre-gyp": "^0.11.0",
+                "simple-get": "^3.0.3"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/canvas/node_modules/node-pre-gyp": {
+            "version": "0.11.0",
+            "resolved": "https://registry.npmjs.org/node-pre-gyp/-/node-pre-gyp-0.11.0.tgz",
+            "integrity": "sha512-TwWAOZb0j7e9eGaf9esRx3ZcLaE5tQ2lvYy1pb5IAaG1a2e2Kv5Lms1Y4hpj+ciXJRofIxxlt5haeQ/2ANeE0Q==",
+            "dependencies": {
+                "detect-libc": "^1.0.2",
+                "mkdirp": "^0.5.1",
+                "needle": "^2.2.1",
+                "nopt": "^4.0.1",
+                "npm-packlist": "^1.1.6",
+                "npmlog": "^4.0.2",
+                "rc": "^1.2.7",
+                "rimraf": "^2.6.1",
+                "semver": "^5.3.0",
+                "tar": "^4"
+            },
+            "bin": {
+                "node-pre-gyp": "bin/node-pre-gyp"
+            }
+        },
+        "node_modules/canvas/node_modules/rimraf": {
+            "version": "2.7.1",
+            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/capture-stack-trace": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/capture-stack-trace/-/capture-stack-trace-1.0.1.tgz",
+            "integrity": "sha512-mYQLZnx5Qt1JgB1WEiMCf2647plpGeQ2NMR/5L0HNZzGQo4fuSPnK+wjfPnKZV0aiJDgzmWqqkV/g7JD+DW0qw==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/caseless": {
+            "version": "0.12.0",
+            "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
+            "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw="
+        },
+        "node_modules/center-align": {
+            "version": "0.1.3",
+            "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz",
+            "integrity": "sha1-qg0yYptu6XIgBBHL1EYckHvCt60=",
+            "dependencies": {
+                "align-text": "^0.1.3",
+                "lazy-cache": "^1.0.3"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/chai": {
+            "version": "4.2.0",
+            "resolved": "https://registry.npmjs.org/chai/-/chai-4.2.0.tgz",
+            "integrity": "sha512-XQU3bhBukrOsQCuwZndwGcCVQHyZi53fQ6Ys1Fym7E4olpIqqZZhhoFJoaKVvV17lWQoXYwgWN2nF5crA8J2jw==",
+            "dependencies": {
+                "assertion-error": "^1.1.0",
+                "check-error": "^1.0.2",
+                "deep-eql": "^3.0.1",
+                "get-func-name": "^2.0.0",
+                "pathval": "^1.1.0",
+                "type-detect": "^4.0.5"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/chain-function": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/chain-function/-/chain-function-1.0.1.tgz",
+            "integrity": "sha512-SxltgMwL9uCko5/ZCLiyG2B7R9fY4pDZUw7hJ4MhirdjBLosoDqkWABi3XMucddHdLiFJMb7PD2MZifZriuMTg=="
+        },
+        "node_modules/chalk": {
+            "version": "2.4.2",
+            "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
+            "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
+            "dependencies": {
+                "ansi-styles": "^3.2.1",
+                "escape-string-regexp": "^1.0.5",
+                "supports-color": "^5.3.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/change-emitter": {
+            "version": "0.1.6",
+            "resolved": "https://registry.npmjs.org/change-emitter/-/change-emitter-0.1.6.tgz",
+            "integrity": "sha1-6LL+PX8at9aaMhma/5HqaTFAlRU="
+        },
+        "node_modules/character-parser": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/character-parser/-/character-parser-2.2.0.tgz",
+            "integrity": "sha1-x84o821LzZdE5f/CxfzeHHMmH8A=",
+            "dependencies": {
+                "is-regex": "^1.0.3"
+            }
+        },
+        "node_modules/check-error": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/check-error/-/check-error-1.0.2.tgz",
+            "integrity": "sha1-V00xLt2Iu13YkS6Sht1sCu1KrII=",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/cheerio": {
+            "version": "1.0.0-rc.3",
+            "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-1.0.0-rc.3.tgz",
+            "integrity": "sha512-0td5ijfUPuubwLUu0OBoe98gZj8C/AA+RW3v67GPlGOrvxWjZmBXiBCRU+I8VEiNyJzjth40POfHiz2RB3gImA==",
+            "dependencies": {
+                "css-select": "~1.2.0",
+                "dom-serializer": "~0.1.1",
+                "entities": "~1.1.1",
+                "htmlparser2": "^3.9.1",
+                "lodash": "^4.15.0",
+                "parse5": "^3.0.1"
+            },
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/cheerio/node_modules/dom-serializer": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.1.tgz",
+            "integrity": "sha512-l0IU0pPzLWSHBcieZbpOKgkIn3ts3vAh7ZuFyXNwJxJXk/c4Gwj9xaTJwIDVQCXawWD0qb3IzMGH5rglQaO0XA==",
+            "dependencies": {
+                "domelementtype": "^1.3.0",
+                "entities": "^1.1.1"
+            }
+        },
+        "node_modules/child_process": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/child_process/-/child_process-1.0.2.tgz",
+            "integrity": "sha1-sffn/HPSXn/R1FWtyU4UODAYK1o="
+        },
+        "node_modules/chokidar": {
+            "version": "2.1.8",
+            "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.1.8.tgz",
+            "integrity": "sha512-ZmZUazfOzf0Nve7duiCKD23PFSCs4JPoYyccjUFF3aQkQadqBhfzhjkwBH2mNOG9cTBwhamM37EIsIkZw3nRgg==",
+            "dependencies": {
+                "anymatch": "^2.0.0",
+                "async-each": "^1.0.1",
+                "braces": "^2.3.2",
+                "glob-parent": "^3.1.0",
+                "inherits": "^2.0.3",
+                "is-binary-path": "^1.0.0",
+                "is-glob": "^4.0.0",
+                "normalize-path": "^3.0.0",
+                "path-is-absolute": "^1.0.0",
+                "readdirp": "^2.2.1",
+                "upath": "^1.1.1"
+            },
+            "optionalDependencies": {
+                "fsevents": "^1.2.7"
+            }
+        },
+        "node_modules/chokidar/node_modules/bindings": {
+            "version": "1.5.0",
+            "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
+            "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
+            "optional": true,
+            "dependencies": {
+                "file-uri-to-path": "1.0.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents": {
+            "version": "1.2.12",
+            "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.12.tgz",
+            "integrity": "sha512-Ggd/Ktt7E7I8pxZRbGIs7vwqAPscSESMrCSkx2FtWeqmheJgCo2R74fTsZFCifr0VTPwqRpPv17+6b8Zp7th0Q==",
+            "bundleDependencies": [
+                "node-pre-gyp"
+            ],
+            "hasInstallScript": true,
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "dependencies": {
+                "bindings": "^1.5.0",
+                "nan": "^2.12.1",
+                "node-pre-gyp": "*"
+            },
+            "engines": {
+                "node": ">= 4.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/abbrev": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/ansi-regex": {
+            "version": "2.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/aproba": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/are-we-there-yet": {
+            "version": "1.1.5",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "delegates": "^1.0.0",
+                "readable-stream": "^2.0.6"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/balanced-match": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/brace-expansion": {
+            "version": "1.1.11",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "balanced-match": "^1.0.0",
+                "concat-map": "0.0.1"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/chownr": {
+            "version": "1.1.4",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/code-point-at": {
+            "version": "1.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/concat-map": {
+            "version": "0.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/console-control-strings": {
+            "version": "1.1.0",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/core-util-is": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/debug": {
+            "version": "3.2.6",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/deep-extend": {
+            "version": "0.6.0",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/delegates": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/detect-libc": {
+            "version": "1.0.3",
+            "inBundle": true,
+            "license": "Apache-2.0",
+            "optional": true,
+            "bin": {
+                "detect-libc": "bin/detect-libc.js"
+            },
+            "engines": {
+                "node": ">=0.10"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/fs-minipass": {
+            "version": "1.2.7",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "minipass": "^2.6.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/fs.realpath": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/gauge": {
+            "version": "2.7.4",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "aproba": "^1.0.3",
+                "console-control-strings": "^1.0.0",
+                "has-unicode": "^2.0.0",
+                "object-assign": "^4.1.0",
+                "signal-exit": "^3.0.0",
+                "string-width": "^1.0.1",
+                "strip-ansi": "^3.0.1",
+                "wide-align": "^1.1.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/glob": {
+            "version": "7.1.6",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "fs.realpath": "^1.0.0",
+                "inflight": "^1.0.4",
+                "inherits": "2",
+                "minimatch": "^3.0.4",
+                "once": "^1.3.0",
+                "path-is-absolute": "^1.0.0"
+            },
+            "engines": {
+                "node": "*"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/isaacs"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/has-unicode": {
+            "version": "2.0.1",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/iconv-lite": {
+            "version": "0.4.24",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "safer-buffer": ">= 2.1.2 < 3"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/ignore-walk": {
+            "version": "3.0.3",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "minimatch": "^3.0.4"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/inflight": {
+            "version": "1.0.6",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "once": "^1.3.0",
+                "wrappy": "1"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/inherits": {
+            "version": "2.0.4",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/ini": {
+            "version": "1.3.5",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/is-fullwidth-code-point": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "number-is-nan": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/isarray": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/minimatch": {
+            "version": "3.0.4",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "brace-expansion": "^1.1.7"
+            },
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/minimist": {
+            "version": "1.2.5",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/minipass": {
+            "version": "2.9.0",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "safe-buffer": "^5.1.2",
+                "yallist": "^3.0.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/minizlib": {
+            "version": "1.3.3",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "minipass": "^2.9.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/mkdirp": {
+            "version": "0.5.3",
+            "deprecated": "Legacy versions of mkdirp are no longer supported. Please update to mkdirp 1.x. (Note that the API surface has changed to use Promises in 1.x.)",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "minimist": "^1.2.5"
+            },
+            "bin": {
+                "mkdirp": "bin/cmd.js"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/ms": {
+            "version": "2.1.2",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/needle": {
+            "version": "2.3.3",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "debug": "^3.2.6",
+                "iconv-lite": "^0.4.4",
+                "sax": "^1.2.4"
+            },
+            "bin": {
+                "needle": "bin/needle"
+            },
+            "engines": {
+                "node": ">= 4.4.x"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/node-pre-gyp": {
+            "version": "0.14.0",
+            "inBundle": true,
+            "license": "BSD-3-Clause",
+            "optional": true,
+            "dependencies": {
+                "detect-libc": "^1.0.2",
+                "mkdirp": "^0.5.1",
+                "needle": "^2.2.1",
+                "nopt": "^4.0.1",
+                "npm-packlist": "^1.1.6",
+                "npmlog": "^4.0.2",
+                "rc": "^1.2.7",
+                "rimraf": "^2.6.1",
+                "semver": "^5.3.0",
+                "tar": "^4.4.2"
+            },
+            "bin": {
+                "node-pre-gyp": "bin/node-pre-gyp"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/nopt": {
+            "version": "4.0.3",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "abbrev": "1",
+                "osenv": "^0.1.4"
+            },
+            "bin": {
+                "nopt": "bin/nopt.js"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/npm-bundled": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "npm-normalize-package-bin": "^1.0.1"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/npm-normalize-package-bin": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/npm-packlist": {
+            "version": "1.4.8",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "ignore-walk": "^3.0.1",
+                "npm-bundled": "^1.0.1",
+                "npm-normalize-package-bin": "^1.0.1"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/npmlog": {
+            "version": "4.1.2",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "are-we-there-yet": "~1.1.2",
+                "console-control-strings": "~1.1.0",
+                "gauge": "~2.7.3",
+                "set-blocking": "~2.0.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/number-is-nan": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/object-assign": {
+            "version": "4.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/once": {
+            "version": "1.4.0",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "wrappy": "1"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/os-homedir": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/os-tmpdir": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/osenv": {
+            "version": "0.1.5",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "os-homedir": "^1.0.0",
+                "os-tmpdir": "^1.0.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/path-is-absolute": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/process-nextick-args": {
+            "version": "2.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/rc": {
+            "version": "1.2.8",
+            "inBundle": true,
+            "license": "(BSD-2-Clause OR MIT OR Apache-2.0)",
+            "optional": true,
+            "dependencies": {
+                "deep-extend": "^0.6.0",
+                "ini": "~1.3.0",
+                "minimist": "^1.2.0",
+                "strip-json-comments": "~2.0.1"
+            },
+            "bin": {
+                "rc": "cli.js"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/rimraf": {
+            "version": "2.7.1",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/safe-buffer": {
+            "version": "5.1.2",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/safer-buffer": {
+            "version": "2.1.2",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/sax": {
+            "version": "1.2.4",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/semver": {
+            "version": "5.7.1",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "bin": {
+                "semver": "bin/semver"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/set-blocking": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/signal-exit": {
+            "version": "3.0.2",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/string_decoder": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/string-width": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "code-point-at": "^1.0.0",
+                "is-fullwidth-code-point": "^1.0.0",
+                "strip-ansi": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/strip-ansi": {
+            "version": "3.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "ansi-regex": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/strip-json-comments": {
+            "version": "2.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/tar": {
+            "version": "4.4.13",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "chownr": "^1.1.1",
+                "fs-minipass": "^1.2.5",
+                "minipass": "^2.8.6",
+                "minizlib": "^1.2.1",
+                "mkdirp": "^0.5.0",
+                "safe-buffer": "^5.1.2",
+                "yallist": "^3.0.3"
+            },
+            "engines": {
+                "node": ">=4.5"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/util-deprecate": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/wide-align": {
+            "version": "1.1.3",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true,
+            "dependencies": {
+                "string-width": "^1.0.2 || 2"
+            }
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/wrappy": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true
+        },
+        "node_modules/chokidar/node_modules/fsevents/node_modules/yallist": {
+            "version": "3.1.1",
+            "inBundle": true,
+            "license": "ISC",
+            "optional": true
+        },
+        "node_modules/chownr": {
+            "version": "1.1.4",
+            "resolved": "https://registry.npmjs.org/chownr/-/chownr-1.1.4.tgz",
+            "integrity": "sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg=="
+        },
+        "node_modules/chrome": {
+            "version": "0.1.0",
+            "resolved": "https://registry.npmjs.org/chrome/-/chrome-0.1.0.tgz",
+            "integrity": "sha1-9h2beS/v6MGUxwVt3BAscmqGQyk=",
+            "dependencies": {
+                "exeq": "^2.2.0",
+                "plist": "^1.1.0"
+            },
+            "bin": {
+                "chrome": "index.js"
+            }
+        },
+        "node_modules/chrome-trace-event": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/chrome-trace-event/-/chrome-trace-event-1.0.3.tgz",
+            "integrity": "sha512-p3KULyQg4S7NIHixdwbGX+nFHkoBiA4YQmyWtjb8XngSKV124nJmRysgAeujbUVb15vh+RvFUfCPqU7rXk+hZg==",
+            "dev": true,
+            "engines": {
+                "node": ">=6.0"
+            }
+        },
+        "node_modules/ci-info": {
+            "version": "1.6.0",
+            "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.6.0.tgz",
+            "integrity": "sha512-vsGdkwSCDpWmP80ncATX7iea5DWQemg1UgCW5J8tqjU3lYw4FBYuj89J0CTVomA7BEfvSZd84GmHko+MxFQU2A=="
+        },
+        "node_modules/cipher-base": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.4.tgz",
+            "integrity": "sha512-Kkht5ye6ZGmwv40uUDZztayT2ThLQGfnj/T71N/XzeZeo3nf8foyW7zGTsPYkEya3m5f3cAypH+qe7YOrM1U2Q==",
+            "dev": true,
+            "dependencies": {
+                "inherits": "^2.0.1",
+                "safe-buffer": "^5.0.1"
+            }
+        },
+        "node_modules/clamp": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/clamp/-/clamp-1.0.1.tgz",
+            "integrity": "sha1-ZqDmQBGBbjcZaCj9yMjBRzEshjQ="
+        },
+        "node_modules/class-transformer": {
+            "version": "0.2.3",
+            "resolved": "https://registry.npmjs.org/class-transformer/-/class-transformer-0.2.3.tgz",
+            "integrity": "sha512-qsP+0xoavpOlJHuYsQJsN58HXSl8Jvveo+T37rEvCEeRfMWoytAyR0Ua/YsFgpM6AZYZ/og2PJwArwzJl1aXtQ=="
+        },
+        "node_modules/class-utils": {
+            "version": "0.3.6",
+            "resolved": "https://registry.npmjs.org/class-utils/-/class-utils-0.3.6.tgz",
+            "integrity": "sha512-qOhPa/Fj7s6TY8H8esGu5QNpMMQxz79h+urzrNYN6mn+9BnxlDGf5QZ+XeCDsxSjPqsSR56XOZOJmpeurnLMeg==",
+            "dependencies": {
+                "arr-union": "^3.1.0",
+                "define-property": "^0.2.5",
+                "isobject": "^3.0.0",
+                "static-extend": "^0.1.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/class-utils/node_modules/define-property": {
+            "version": "0.2.5",
+            "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+            "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
+            "dependencies": {
+                "is-descriptor": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/classnames": {
+            "version": "2.2.6",
+            "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz",
+            "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q=="
+        },
+        "node_modules/clean-css": {
+            "version": "4.2.3",
+            "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.3.tgz",
+            "integrity": "sha512-VcMWDN54ZN/DS+g58HYL5/n4Zrqe8vHJpGA8KdgUXFU4fuP/aHNw8eld9SyEIyabIMJX/0RaY/fplOo5hYLSFA==",
+            "dependencies": {
+                "source-map": "~0.6.0"
+            },
+            "engines": {
+                "node": ">= 4.0"
+            }
+        },
+        "node_modules/clean-css/node_modules/source-map": {
+            "version": "0.6.1",
+            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/cli-boxes": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-1.0.0.tgz",
+            "integrity": "sha1-T6kXw+WclKAEzWH47lCdplFocUM=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/cliss": {
+            "version": "0.0.2",
+            "resolved": "https://registry.npmjs.org/cliss/-/cliss-0.0.2.tgz",
+            "integrity": "sha512-6rj9pgdukjT994Md13JCUAgTk91abAKrygL9sAvmHY4F6AKMOV8ccGaxhUUfcBuyg3sundWnn3JE0Mc9W6ZYqw==",
+            "dependencies": {
+                "command-line-usage": "^4.0.1",
+                "deepmerge": "^2.0.0",
+                "get-stdin": "^5.0.1",
+                "inspect-parameters-declaration": "0.0.9",
+                "object-to-arguments": "0.0.8",
+                "pipe-functions": "^1.3.0",
+                "strip-ansi": "^4.0.0",
+                "yargs-parser": "^7.0.0"
+            }
+        },
+        "node_modules/cliss/node_modules/camelcase": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+            "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/cliss/node_modules/yargs-parser": {
+            "version": "7.0.0",
+            "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-7.0.0.tgz",
+            "integrity": "sha1-jQrELxbqVd69MyyvTEA4s+P139k=",
+            "dependencies": {
+                "camelcase": "^4.1.0"
+            }
+        },
+        "node_modules/cliui": {
+            "version": "5.0.0",
+            "resolved": "https://registry.npmjs.org/cliui/-/cliui-5.0.0.tgz",
+            "integrity": "sha512-PYeGSEmmHM6zvoef2w8TPzlrnNpXIjTipYK780YswmIP9vjxmd6Y2a3CB2Ks6/AU8NHjZugXvo8w3oWM2qnwXA==",
+            "dependencies": {
+                "string-width": "^3.1.0",
+                "strip-ansi": "^5.2.0",
+                "wrap-ansi": "^5.1.0"
+            }
+        },
+        "node_modules/cliui/node_modules/ansi-regex": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
+            "integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/cliui/node_modules/string-width": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
+            "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
+            "dependencies": {
+                "emoji-regex": "^7.0.1",
+                "is-fullwidth-code-point": "^2.0.0",
+                "strip-ansi": "^5.1.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/cliui/node_modules/strip-ansi": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
+            "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
+            "dependencies": {
+                "ansi-regex": "^4.1.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/clj-fuzzy": {
+            "version": "0.3.3",
+            "resolved": "https://registry.npmjs.org/clj-fuzzy/-/clj-fuzzy-0.3.3.tgz",
+            "integrity": "sha1-seU0MJHFIC28UlMoY+HEp4RX8D0="
+        },
+        "node_modules/clone-deep": {
+            "version": "4.0.1",
+            "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-4.0.1.tgz",
+            "integrity": "sha512-neHB9xuzh/wk0dIHweyAXv2aPGZIVk3pLMe+/RNzINf17fe0OG96QroktYAUm7SM1PBnzTabaLboqqxDyMU+SQ==",
+            "dev": true,
+            "dependencies": {
+                "is-plain-object": "^2.0.4",
+                "kind-of": "^6.0.2",
+                "shallow-clone": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/clsx": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.1.1.tgz",
+            "integrity": "sha512-6/bPho624p3S2pMyvP5kKBPXnI3ufHLObBFCfgx+LkeR5lg2XYy2hqZqUf45ypD8COn2bhgGJSUE+l5dhNBieA==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/code-point-at": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
+            "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/collection-visit": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/collection-visit/-/collection-visit-1.0.0.tgz",
+            "integrity": "sha1-S8A3PBZLwykbTTaMgpzxqApZ3KA=",
+            "dependencies": {
+                "map-visit": "^1.0.0",
+                "object-visit": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/color": {
+            "version": "3.1.2",
+            "resolved": "https://registry.npmjs.org/color/-/color-3.1.2.tgz",
+            "integrity": "sha512-vXTJhHebByxZn3lDvDJYw4lR5+uB3vuoHsuYA5AKuxRVn5wzzIfQKGLBmgdVRHKTJYeK5rvJcHnrd0Li49CFpg==",
+            "dependencies": {
+                "color-convert": "^1.9.1",
+                "color-string": "^1.5.2"
+            }
+        },
+        "node_modules/color-convert": {
+            "version": "1.9.3",
+            "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
+            "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+            "dependencies": {
+                "color-name": "1.1.3"
+            }
+        },
+        "node_modules/color-name": {
+            "version": "1.1.3",
+            "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
+            "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
+        },
+        "node_modules/color-string": {
+            "version": "1.5.3",
+            "resolved": "https://registry.npmjs.org/color-string/-/color-string-1.5.3.tgz",
+            "integrity": "sha512-dC2C5qeWoYkxki5UAXapdjqO672AM4vZuPGRQfO8b5HKuKGBbKWpITyDYN7TOFKvRW7kOgAn3746clDBMDJyQw==",
+            "dependencies": {
+                "color-name": "^1.0.0",
+                "simple-swizzle": "^0.2.2"
+            }
+        },
+        "node_modules/colors": {
+            "version": "1.4.0",
+            "resolved": "https://registry.npmjs.org/colors/-/colors-1.4.0.tgz",
+            "integrity": "sha512-a+UqTh4kgZg/SlGvfbzDHpgRu7AAQOmmqRHJnxhRZICKFUT91brVhNNt58CMWU9PsBbv3PDCZUHbVxuDiH2mtA==",
+            "engines": {
+                "node": ">=0.1.90"
+            }
+        },
+        "node_modules/combined-stream": {
+            "version": "1.0.8",
+            "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+            "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+            "dependencies": {
+                "delayed-stream": "~1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/command-exists": {
+            "version": "1.2.6",
+            "resolved": "https://registry.npmjs.org/command-exists/-/command-exists-1.2.6.tgz",
+            "integrity": "sha512-Qst/zUUNmS/z3WziPxyqjrcz09pm+2Knbs5mAZL4VAE0sSrNY1/w8+/YxeHcoBTsO6iojA6BW7eFf27Eg2MRuw=="
+        },
+        "node_modules/command-line-usage": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/command-line-usage/-/command-line-usage-4.1.0.tgz",
+            "integrity": "sha512-MxS8Ad995KpdAC0Jopo/ovGIroV/m0KHwzKfXxKag6FHOkGsH8/lv5yjgablcRxCJJC0oJeUMuO/gmaq+Wq46g==",
+            "dependencies": {
+                "ansi-escape-sequences": "^4.0.0",
+                "array-back": "^2.0.0",
+                "table-layout": "^0.4.2",
+                "typical": "^2.6.1"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/commander": {
+            "version": "2.20.3",
+            "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
+            "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ=="
+        },
+        "node_modules/commondir": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
+            "integrity": "sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs=",
+            "dev": true
+        },
+        "node_modules/component-bind": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz",
+            "integrity": "sha1-AMYIq33Nk4l8AAllGx06jh5zu9E="
+        },
+        "node_modules/component-emitter": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.3.0.tgz",
+            "integrity": "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg=="
+        },
+        "node_modules/component-inherit": {
+            "version": "0.0.3",
+            "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz",
+            "integrity": "sha1-ZF/ErfWLcrZJ1crmUTVhnbJv8UM="
+        },
+        "node_modules/compress-commons": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/compress-commons/-/compress-commons-2.1.1.tgz",
+            "integrity": "sha512-eVw6n7CnEMFzc3duyFVrQEuY1BlHR3rYsSztyG32ibGMW722i3C6IizEGMFmfMU+A+fALvBIwxN3czffTcdA+Q==",
+            "dependencies": {
+                "buffer-crc32": "^0.2.13",
+                "crc32-stream": "^3.0.1",
+                "normalize-path": "^3.0.0",
+                "readable-stream": "^2.3.6"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/compress-commons/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/compressible": {
+            "version": "2.0.18",
+            "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz",
+            "integrity": "sha512-AF3r7P5dWxL8MxyITRMlORQNaOA2IkAFaTr4k7BUumjPtRpGDTZpl0Pb1XCO6JeDCBdp126Cgs9sMxqSjgYyRg==",
+            "dev": true,
+            "dependencies": {
+                "mime-db": ">= 1.43.0 < 2"
+            },
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/compression": {
+            "version": "1.7.4",
+            "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.4.tgz",
+            "integrity": "sha512-jaSIDzP9pZVS4ZfQ+TzvtiWhdpFhE2RDHz8QJkpX9SIpLq88VueF5jJw6t+6CUQcAoA6t+x89MLrWAqpfDE8iQ==",
+            "dev": true,
+            "dependencies": {
+                "accepts": "~1.3.5",
+                "bytes": "3.0.0",
+                "compressible": "~2.0.16",
+                "debug": "2.6.9",
+                "on-headers": "~1.0.2",
+                "safe-buffer": "5.1.2",
+                "vary": "~1.1.2"
+            },
+            "engines": {
+                "node": ">= 0.8.0"
+            }
+        },
+        "node_modules/compression/node_modules/bytes": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz",
+            "integrity": "sha1-0ygVQE1olpn4Wk6k+odV3ROpYEg=",
+            "dev": true,
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/compression/node_modules/debug": {
+            "version": "2.6.9",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+            "dev": true,
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/compression/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
+            "dev": true
+        },
+        "node_modules/concat-map": {
+            "version": "0.0.1",
+            "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
+            "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
+        },
+        "node_modules/concat-stream": {
+            "version": "1.6.2",
+            "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.2.tgz",
+            "integrity": "sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw==",
+            "engines": [
+                "node >= 0.8"
+            ],
+            "dependencies": {
+                "buffer-from": "^1.0.0",
+                "inherits": "^2.0.3",
+                "readable-stream": "^2.2.2",
+                "typedarray": "^0.0.6"
+            }
+        },
+        "node_modules/concat-stream/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/configstore": {
+            "version": "3.1.2",
+            "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.2.tgz",
+            "integrity": "sha512-vtv5HtGjcYUgFrXc6Kx747B83MRRVS5R1VTEQoXvuP+kMI+if6uywV0nDGoiydJRy4yk7h9od5Og0kxx4zUXmw==",
+            "dependencies": {
+                "dot-prop": "^4.1.0",
+                "graceful-fs": "^4.1.2",
+                "make-dir": "^1.0.0",
+                "unique-string": "^1.0.0",
+                "write-file-atomic": "^2.0.0",
+                "xdg-basedir": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/connect-flash": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/connect-flash/-/connect-flash-0.1.1.tgz",
+            "integrity": "sha1-2GMPJtlaf4UfmVax6MxnMvO2qjA=",
+            "engines": {
+                "node": ">= 0.4.0"
+            }
+        },
+        "node_modules/connect-history-api-fallback": {
+            "version": "1.6.0",
+            "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz",
+            "integrity": "sha512-e54B99q/OUoH64zYYRf3HBP5z24G38h5D3qXu23JGRoigpX5Ss4r9ZnDk3g0Z8uQC2x2lPaJ+UlWBc1ZWBWdLg==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.8"
+            }
+        },
+        "node_modules/connect-mongo": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/connect-mongo/-/connect-mongo-2.0.3.tgz",
+            "integrity": "sha512-Vs+QZ/6X6gbCrP1Ls7Oh/wlyY6pgpbPSrUKF5yRT+zd+4GZPNbjNquxquZ+Clv2+03HBXE7T4lVM0PUcaBhihg==",
+            "dependencies": {
+                "mongodb": "^2.0.36"
+            }
+        },
+        "node_modules/connect-mongo/node_modules/mongodb": {
+            "version": "2.2.36",
+            "resolved": "https://registry.npmjs.org/mongodb/-/mongodb-2.2.36.tgz",
+            "integrity": "sha512-P2SBLQ8Z0PVx71ngoXwo12+FiSfbNfGOClAao03/bant5DgLNkOPAck5IaJcEk4gKlQhDEURzfR3xuBG1/B+IA==",
+            "dependencies": {
+                "es6-promise": "3.2.1",
+                "mongodb-core": "2.1.20",
+                "readable-stream": "2.2.7"
+            },
+            "engines": {
+                "node": ">=0.10.3"
+            }
+        },
+        "node_modules/connect-mongo/node_modules/process-nextick-args": {
+            "version": "1.0.7",
+            "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
+            "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M="
+        },
+        "node_modules/connect-mongo/node_modules/readable-stream": {
+            "version": "2.2.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.7.tgz",
+            "integrity": "sha1-BwV6y+JGeyIELTb5jFrVBwVOlbE=",
+            "dependencies": {
+                "buffer-shims": "~1.0.0",
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.1",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~1.0.6",
+                "string_decoder": "~1.0.0",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/connect-mongo/node_modules/string_decoder": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+            "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==",
+            "dependencies": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
+        "node_modules/console-browserify": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.2.0.tgz",
+            "integrity": "sha512-ZMkYO/LkF17QvCPqM0gxw8yUzigAOZOSWSHg91FH6orS7vcEj5dVZTidN2fQ14yBSdg97RqhSNwLUXInd52OTA==",
+            "dev": true
+        },
+        "node_modules/console-control-strings": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
+            "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4="
+        },
+        "node_modules/constantinople": {
+            "version": "3.1.2",
+            "resolved": "https://registry.npmjs.org/constantinople/-/constantinople-3.1.2.tgz",
+            "integrity": "sha512-yePcBqEFhLOqSBtwYOGGS1exHo/s1xjekXiinh4itpNQGCu4KA1euPh1fg07N2wMITZXQkBz75Ntdt1ctGZouw==",
+            "dependencies": {
+                "@types/babel-types": "^7.0.0",
+                "@types/babylon": "^6.16.2",
+                "babel-types": "^6.26.0",
+                "babylon": "^6.18.0"
+            }
+        },
+        "node_modules/constants-browserify": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
+            "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U=",
+            "dev": true
+        },
+        "node_modules/content-disposition": {
+            "version": "0.5.3",
+            "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.3.tgz",
+            "integrity": "sha512-ExO0774ikEObIAEV9kDo50o+79VCUdEB6n6lzKgGwupcVeRlhrj3qGAfwq8G6uBJjkqLrhT0qEYFcWng8z1z0g==",
+            "dependencies": {
+                "safe-buffer": "5.1.2"
+            },
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/content-type": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.4.tgz",
+            "integrity": "sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA==",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/convert-source-map": {
+            "version": "1.7.0",
+            "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.7.0.tgz",
+            "integrity": "sha512-4FJkXzKXEDB1snCFZlLP4gpC3JILicCpGbzG9f9G7tGqGCzETQ2hWPrcinA9oU4wtf2biUaEH5065UnMeR33oA==",
+            "dependencies": {
+                "safe-buffer": "~5.1.1"
+            }
+        },
+        "node_modules/cookie": {
+            "version": "0.4.0",
+            "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.0.tgz",
+            "integrity": "sha512-+Hp8fLp57wnUSt0tY0tHEXh4voZRDnoIrZPqlo3DPiI4y9lwg/jqx+1Om94/W6ZaPDOUbnjOt/99w66zk+l1Xg==",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/cookie-parser": {
+            "version": "1.4.5",
+            "resolved": "https://registry.npmjs.org/cookie-parser/-/cookie-parser-1.4.5.tgz",
+            "integrity": "sha512-f13bPUj/gG/5mDr+xLmSxxDsB9DQiTIfhJS/sqjrmfAWiAN+x2O4i/XguTL9yDZ+/IFDanJ+5x7hC4CXT9Tdzw==",
+            "dependencies": {
+                "cookie": "0.4.0",
+                "cookie-signature": "1.0.6"
+            },
+            "engines": {
+                "node": ">= 0.8.0"
+            }
+        },
+        "node_modules/cookie-session": {
+            "version": "2.0.0-rc.1",
+            "resolved": "https://registry.npmjs.org/cookie-session/-/cookie-session-2.0.0-rc.1.tgz",
+            "integrity": "sha512-zg80EsLe7S1J4y0XxV7SZ8Fbi90ZZoampuX2bfYDOvJfc//98sSlZC41YDzTTjtVbeU1VlVdBbldXOOyi5xzEw==",
+            "dependencies": {
+                "cookies": "0.8.0",
+                "debug": "3.2.6",
+                "on-headers": "~1.0.2",
+                "safe-buffer": "5.2.0"
+            },
+            "engines": {
+                "node": ">= 0.10"
+            }
+        },
+        "node_modules/cookie-session/node_modules/safe-buffer": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.0.tgz",
+            "integrity": "sha512-fZEwUGbVl7kouZs1jCdMLdt95hdIv0ZeHg6L7qPeciMZhZ+/gdesW4wgTARkrFWEpspjEATAzUGPG8N2jJiwbg=="
+        },
+        "node_modules/cookie-signature": {
+            "version": "1.0.6",
+            "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
+            "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
+        },
+        "node_modules/cookies": {
+            "version": "0.8.0",
+            "resolved": "https://registry.npmjs.org/cookies/-/cookies-0.8.0.tgz",
+            "integrity": "sha512-8aPsApQfebXnuI+537McwYsDtjVxGm8gTIzQI3FDW6t5t/DAhERxtnbEPN/8RX+uZthoz4eCOgloXaE5cYyNow==",
+            "dependencies": {
+                "depd": "~2.0.0",
+                "keygrip": "~1.1.0"
+            },
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/cookies/node_modules/depd": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
+            "integrity": "sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==",
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/copy-concurrently": {
+            "version": "1.0.5",
+            "resolved": "https://registry.npmjs.org/copy-concurrently/-/copy-concurrently-1.0.5.tgz",
+            "integrity": "sha512-f2domd9fsVDFtaFcbaRZuYXwtdmnzqbADSwhSWYxYB/Q8zsdUUFMXVRwXGDMWmbEzAn1kdRrtI1T/KTFOL4X2A==",
+            "dev": true,
+            "dependencies": {
+                "aproba": "^1.1.1",
+                "fs-write-stream-atomic": "^1.0.8",
+                "iferr": "^0.1.5",
+                "mkdirp": "^0.5.1",
+                "rimraf": "^2.5.4",
+                "run-queue": "^1.0.0"
+            }
+        },
+        "node_modules/copy-concurrently/node_modules/rimraf": {
+            "version": "2.7.1",
+            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+            "dev": true,
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/copy-descriptor": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/copy-descriptor/-/copy-descriptor-0.1.1.tgz",
+            "integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/copy-webpack-plugin": {
+            "version": "4.6.0",
+            "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-4.6.0.tgz",
+            "integrity": "sha512-Y+SQCF+0NoWQryez2zXn5J5knmr9z/9qSQt7fbL78u83rxmigOy8X5+BFn8CFSuX+nKT8gpYwJX68ekqtQt6ZA==",
+            "dev": true,
+            "dependencies": {
+                "cacache": "^10.0.4",
+                "find-cache-dir": "^1.0.0",
+                "globby": "^7.1.1",
+                "is-glob": "^4.0.0",
+                "loader-utils": "^1.1.0",
+                "minimatch": "^3.0.4",
+                "p-limit": "^1.0.0",
+                "serialize-javascript": "^1.4.0"
+            },
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/copy-webpack-plugin/node_modules/p-limit": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.3.0.tgz",
+            "integrity": "sha512-vvcXsLAJ9Dr5rQOPk7toZQZJApBl2K4J6dANSsEuh6QI41JYcsS/qhTGa9ErIUUgK3WNQoJYvylxvjqmiqEA9Q==",
+            "dev": true,
+            "dependencies": {
+                "p-try": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/copy-webpack-plugin/node_modules/p-try": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/p-try/-/p-try-1.0.0.tgz",
+            "integrity": "sha1-y8ec26+P1CKOE/Yh8rGiN8GyB7M=",
+            "dev": true,
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/core-js": {
+            "version": "1.2.7",
+            "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+            "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
+        },
+        "node_modules/core-js-pure": {
+            "version": "3.6.5",
+            "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.6.5.tgz",
+            "integrity": "sha512-lacdXOimsiD0QyNf9BC/mxivNJ/ybBGJXQFKzRekp1WTHoVUWsUHEn+2T8GJAzzIhyOuXA+gOxCVN3l+5PLPUA==",
+            "hasInstallScript": true
+        },
+        "node_modules/core-util-is": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
+            "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
+        },
+        "node_modules/cors": {
+            "version": "2.8.5",
+            "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
+            "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
+            "dependencies": {
+                "object-assign": "^4",
+                "vary": "^1"
+            },
+            "engines": {
+                "node": ">= 0.10"
+            }
+        },
+        "node_modules/cosmiconfig": {
+            "version": "6.0.0",
+            "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-6.0.0.tgz",
+            "integrity": "sha512-xb3ZL6+L8b9JLLCx3ZdoZy4+2ECphCMo2PwqgP1tlfVq6M6YReyzBJtvWWtbDSpNr9hn96pkCiZqUcFEc+54Qg==",
+            "dependencies": {
+                "@types/parse-json": "^4.0.0",
+                "import-fresh": "^3.1.0",
+                "parse-json": "^5.0.0",
+                "path-type": "^4.0.0",
+                "yaml": "^1.7.2"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/crc": {
+            "version": "3.8.0",
+            "resolved": "https://registry.npmjs.org/crc/-/crc-3.8.0.tgz",
+            "integrity": "sha512-iX3mfgcTMIq3ZKLIsVFAbv7+Mc10kxabAGQb8HvjA1o3T1PIYprbakQ65d3I+2HGHt6nSKkM9PYjgoJO2KcFBQ==",
+            "dependencies": {
+                "buffer": "^5.1.0"
+            }
+        },
+        "node_modules/crc32-stream": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/crc32-stream/-/crc32-stream-3.0.1.tgz",
+            "integrity": "sha512-mctvpXlbzsvK+6z8kJwSJ5crm7yBwrQMTybJzMw1O4lLGJqjlDCXY2Zw7KheiA6XBEcBmfLx1D88mjRGVJtY9w==",
+            "dependencies": {
+                "crc": "^3.4.4",
+                "readable-stream": "^3.4.0"
+            },
+            "engines": {
+                "node": ">= 6.9.0"
+            }
+        },
+        "node_modules/create-ecdh": {
+            "version": "4.0.4",
+            "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.4.tgz",
+            "integrity": "sha512-mf+TCx8wWc9VpuxfP2ht0iSISLZnt0JgWlrOKZiNqyUZWnjIaCIVNQArMHnCZKfEYRg6IM7A+NeJoN8gf/Ws0A==",
+            "dev": true,
+            "dependencies": {
+                "bn.js": "^4.1.0",
+                "elliptic": "^6.5.3"
+            }
+        },
+        "node_modules/create-ecdh/node_modules/bn.js": {
+            "version": "4.12.0",
+            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
+            "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==",
+            "dev": true
+        },
+        "node_modules/create-emotion": {
+            "version": "10.0.27",
+            "resolved": "https://registry.npmjs.org/create-emotion/-/create-emotion-10.0.27.tgz",
+            "integrity": "sha512-fIK73w82HPPn/RsAij7+Zt8eCE8SptcJ3WoRMfxMtjteYxud8GDTKKld7MYwAX2TVhrw29uR1N/bVGxeStHILg==",
+            "dependencies": {
+                "@emotion/cache": "^10.0.27",
+                "@emotion/serialize": "^0.11.15",
+                "@emotion/sheet": "0.9.4",
+                "@emotion/utils": "0.11.3"
+            }
+        },
+        "node_modules/create-error-class": {
+            "version": "3.0.2",
+            "resolved": "https://registry.npmjs.org/create-error-class/-/create-error-class-3.0.2.tgz",
+            "integrity": "sha1-Br56vvlHo/FKMP1hBnHUAbyot7Y=",
+            "dependencies": {
+                "capture-stack-trace": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/create-hash": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
+            "integrity": "sha512-z00bCGNHDG8mHAkP7CtT1qVu+bFQUPjYq/4Iv3C3kWjTFV10zIjfSoeqXo9Asws8gwSHDGj/hl2u4OGIjapeCg==",
+            "dev": true,
+            "dependencies": {
+                "cipher-base": "^1.0.1",
+                "inherits": "^2.0.1",
+                "md5.js": "^1.3.4",
+                "ripemd160": "^2.0.1",
+                "sha.js": "^2.4.0"
+            }
+        },
+        "node_modules/create-hmac": {
+            "version": "1.1.7",
+            "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz",
+            "integrity": "sha512-MJG9liiZ+ogc4TzUwuvbER1JRdgvUFSB5+VR/g5h82fGaIRWMWddtKBHi7/sVhfjQZ6SehlyhvQYrcYkaUIpLg==",
+            "dev": true,
+            "dependencies": {
+                "cipher-base": "^1.0.3",
+                "create-hash": "^1.1.0",
+                "inherits": "^2.0.1",
+                "ripemd160": "^2.0.0",
+                "safe-buffer": "^5.0.1",
+                "sha.js": "^2.4.8"
+            }
+        },
+        "node_modules/create-react-context": {
+            "version": "0.2.3",
+            "resolved": "https://registry.npmjs.org/create-react-context/-/create-react-context-0.2.3.tgz",
+            "integrity": "sha512-CQBmD0+QGgTaxDL3OX1IDXYqjkp2It4RIbcb99jS6AEg27Ga+a9G3JtK6SIu0HBwPLZlmwt9F7UwWA4Bn92Rag==",
+            "dependencies": {
+                "fbjs": "^0.8.0",
+                "gud": "^1.0.0"
+            }
+        },
+        "node_modules/cross-env": {
+            "version": "5.2.1",
+            "resolved": "https://registry.npmjs.org/cross-env/-/cross-env-5.2.1.tgz",
+            "integrity": "sha512-1yHhtcfAd1r4nwQgknowuUNfIT9E8dOMMspC36g45dN+iD1blloi7xp8X/xAIDnjHWyt1uQ8PHk2fkNaym7soQ==",
+            "dev": true,
+            "dependencies": {
+                "cross-spawn": "^6.0.5"
+            },
+            "bin": {
+                "cross-env": "dist/bin/cross-env.js",
+                "cross-env-shell": "dist/bin/cross-env-shell.js"
+            },
+            "engines": {
+                "node": ">=4.0"
+            }
+        },
+        "node_modules/cross-env/node_modules/cross-spawn": {
+            "version": "6.0.5",
+            "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
+            "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
+            "dev": true,
+            "dependencies": {
+                "nice-try": "^1.0.4",
+                "path-key": "^2.0.1",
+                "semver": "^5.5.0",
+                "shebang-command": "^1.2.0",
+                "which": "^1.2.9"
+            },
+            "engines": {
+                "node": ">=4.8"
+            }
+        },
+        "node_modules/cross-fetch": {
+            "version": "3.0.4",
+            "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-3.0.4.tgz",
+            "integrity": "sha512-MSHgpjQqgbT/94D4CyADeNoYh52zMkCX4pcJvPP5WqPsLFMKjr2TCMg381ox5qI0ii2dPwaLx/00477knXqXVw==",
+            "dependencies": {
+                "node-fetch": "2.6.0",
+                "whatwg-fetch": "3.0.0"
+            }
+        },
+        "node_modules/cross-fetch/node_modules/node-fetch": {
+            "version": "2.6.0",
+            "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.0.tgz",
+            "integrity": "sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA==",
+            "engines": {
+                "node": "4.x || >=6.0.0"
+            }
+        },
+        "node_modules/cross-spawn": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-3.0.1.tgz",
+            "integrity": "sha1-ElYDfsufDF9549bvE14wdwGEuYI=",
+            "dependencies": {
+                "lru-cache": "^4.0.1",
+                "which": "^1.2.9"
+            }
+        },
+        "node_modules/cross-spawn/node_modules/lru-cache": {
+            "version": "4.1.5",
+            "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.5.tgz",
+            "integrity": "sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==",
+            "dependencies": {
+                "pseudomap": "^1.0.2",
+                "yallist": "^2.1.2"
+            }
+        },
+        "node_modules/cross-spawn/node_modules/yallist": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz",
+            "integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI="
+        },
+        "node_modules/crypto-browserify": {
+            "version": "3.12.0",
+            "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.12.0.tgz",
+            "integrity": "sha512-fz4spIh+znjO2VjL+IdhEpRJ3YN6sMzITSBijk6FK2UvTqruSQW+/cCZTSNsMiZNvUeq0CqurF+dAbyiGOY6Wg==",
+            "dev": true,
+            "dependencies": {
+                "browserify-cipher": "^1.0.0",
+                "browserify-sign": "^4.0.0",
+                "create-ecdh": "^4.0.0",
+                "create-hash": "^1.1.0",
+                "create-hmac": "^1.1.0",
+                "diffie-hellman": "^5.0.0",
+                "inherits": "^2.0.1",
+                "pbkdf2": "^3.0.3",
+                "public-encrypt": "^4.0.0",
+                "randombytes": "^2.0.0",
+                "randomfill": "^1.0.3"
+            },
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/crypto-random-string": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz",
+            "integrity": "sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/css-box-model": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/css-box-model/-/css-box-model-1.2.1.tgz",
+            "integrity": "sha512-a7Vr4Q/kd/aw96bnJG332W9V9LkJO69JRcaCYDUqjp6/z0w6VcZjgAcTbgFxEPfBgdnAwlh3iwu+hLopa+flJw==",
+            "dependencies": {
+                "tiny-invariant": "^1.0.6"
+            }
+        },
+        "node_modules/css-color-keywords": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/css-color-keywords/-/css-color-keywords-1.0.0.tgz",
+            "integrity": "sha1-/qJhbcZ2spYmhrOvjb2+GAskTgU=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/css-in-js-utils": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-2.0.1.tgz",
+            "integrity": "sha512-PJF0SpJT+WdbVVt0AOYp9C8GnuruRlL/UFW7932nLWmFLQTaWEzTBQEx7/hn4BuV+WON75iAViSUJLiU3PKbpA==",
+            "dependencies": {
+                "hyphenate-style-name": "^1.0.2",
+                "isobject": "^3.0.1"
+            }
+        },
+        "node_modules/css-loader": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-2.1.1.tgz",
+            "integrity": "sha512-OcKJU/lt232vl1P9EEDamhoO9iKY3tIjY5GU+XDLblAykTdgs6Ux9P1hTHve8nFKy5KPpOXOsVI/hIwi3841+w==",
+            "dev": true,
+            "dependencies": {
+                "camelcase": "^5.2.0",
+                "icss-utils": "^4.1.0",
+                "loader-utils": "^1.2.3",
+                "normalize-path": "^3.0.0",
+                "postcss": "^7.0.14",
+                "postcss-modules-extract-imports": "^2.0.0",
+                "postcss-modules-local-by-default": "^2.0.6",
+                "postcss-modules-scope": "^2.1.0",
+                "postcss-modules-values": "^2.0.0",
+                "postcss-value-parser": "^3.3.0",
+                "schema-utils": "^1.0.0"
+            },
+            "engines": {
+                "node": ">= 6.9.0"
+            }
+        },
+        "node_modules/css-loader/node_modules/schema-utils": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
+            "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
+            "dev": true,
+            "dependencies": {
+                "ajv": "^6.1.0",
+                "ajv-errors": "^1.0.0",
+                "ajv-keywords": "^3.1.0"
+            },
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/css-select": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
+            "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg=",
+            "dependencies": {
+                "boolbase": "~1.0.0",
+                "css-what": "2.1",
+                "domutils": "1.5.1",
+                "nth-check": "~1.0.1"
+            }
+        },
+        "node_modules/css-select/node_modules/domutils": {
+            "version": "1.5.1",
+            "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
+            "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8=",
+            "dependencies": {
+                "dom-serializer": "0",
+                "domelementtype": "1"
+            }
+        },
+        "node_modules/css-to-react-native": {
+            "version": "2.3.2",
+            "resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-2.3.2.tgz",
+            "integrity": "sha512-VOFaeZA053BqvvvqIA8c9n0+9vFppVBAHCp6JgFTtTMU3Mzi+XnelJ9XC9ul3BqFzZyQ5N+H0SnwsWT2Ebchxw==",
+            "dependencies": {
+                "camelize": "^1.0.0",
+                "css-color-keywords": "^1.0.0",
+                "postcss-value-parser": "^3.3.0"
+            }
+        },
+        "node_modules/css-vendor": {
+            "version": "2.0.8",
+            "resolved": "https://registry.npmjs.org/css-vendor/-/css-vendor-2.0.8.tgz",
+            "integrity": "sha512-x9Aq0XTInxrkuFeHKbYC7zWY8ai7qJ04Kxd9MnvbC1uO5DagxoHQjm4JvG+vCdXOoFtCjbL2XSZfxmoYa9uQVQ==",
+            "dependencies": {
+                "@babel/runtime": "^7.8.3",
+                "is-in-browser": "^1.0.2"
+            }
+        },
+        "node_modules/css-what": {
+            "version": "2.1.3",
+            "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.3.tgz",
+            "integrity": "sha512-a+EPoD+uZiNfh+5fxw2nO9QwFa6nJe2Or35fGY6Ipw1R3R4AGz1d1TEZrCegvw2YTmZ0jXirGYlzxxpYSHwpEg==",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/cssesc": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
+            "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
+            "dev": true,
+            "bin": {
+                "cssesc": "bin/cssesc"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/cssom": {
+            "version": "0.4.4",
+            "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.4.4.tgz",
+            "integrity": "sha512-p3pvU7r1MyyqbTk+WbNJIgJjG2VmTIaB10rI93LzVPrmDJKkzKYMtxxyAvQXR/NS6otuzveI7+7BBq3SjBS2mw==",
+            "dev": true
+        },
+        "node_modules/cssstyle": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-2.2.0.tgz",
+            "integrity": "sha512-sEb3XFPx3jNnCAMtqrXPDeSgQr+jojtCeNf8cvMNMh1cG970+lljssvQDzPq6lmmJu2Vhqood/gtEomBiHOGnA==",
+            "dev": true,
+            "dependencies": {
+                "cssom": "~0.3.6"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/cssstyle/node_modules/cssom": {
+            "version": "0.3.8",
+            "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.3.8.tgz",
+            "integrity": "sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==",
+            "dev": true
+        },
+        "node_modules/csstype": {
+            "version": "2.6.10",
+            "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.10.tgz",
+            "integrity": "sha512-D34BqZU4cIlMCY93rZHbrq9pjTAQJ3U8S8rfBqjwHxkGPThWFjzZDQpgMJY0QViLxth6ZKYiwFBo14RdN44U/w=="
+        },
+        "node_modules/currently-unhandled": {
+            "version": "0.4.1",
+            "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
+            "integrity": "sha1-mI3zP+qxke95mmE2nddsF635V+o=",
+            "dependencies": {
+                "array-find-index": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/custom-event": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz",
+            "integrity": "sha1-XQKkaFCt8bSjF5RqOSj8y1v9BCU="
+        },
+        "node_modules/cyclist": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz",
+            "integrity": "sha1-WW6WmP0MgOEgOMK4LW6xs1tiJNk=",
+            "dev": true
+        },
+        "node_modules/d": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/d/-/d-1.0.1.tgz",
+            "integrity": "sha512-m62ShEObQ39CfralilEQRjH6oAMtNCV1xJyEx5LpRYUVN+EviphDgUc/F3hnYbADmkiNs67Y+3ylmlG7Lnu+FA==",
+            "dev": true,
+            "dependencies": {
+                "es5-ext": "^0.10.50",
+                "type": "^1.0.1"
+            }
+        },
+        "node_modules/d3-array": {
+            "version": "1.2.4",
+            "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-1.2.4.tgz",
+            "integrity": "sha512-KHW6M86R+FUPYGb3R5XiYjXPq7VzwxZ22buHhAEVG5ztoEcZZMLov530mmccaqA1GghZArjQV46fuc8kUqhhHw=="
+        },
+        "node_modules/d3-axis": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/d3-axis/-/d3-axis-2.0.0.tgz",
+            "integrity": "sha512-9nzB0uePtb+u9+dWir+HTuEAKJOEUYJoEwbJPsZ1B4K3iZUgzJcSENQ05Nj7S4CIfbZZ8/jQGoUzGKFznBhiiQ=="
+        },
+        "node_modules/d3-color": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-2.0.0.tgz",
+            "integrity": "sha512-SPXi0TSKPD4g9tw0NMZFnR95XVgUZiBH+uUTqQuDu1OsE2zomHU7ho0FISciaPvosimixwHFl3WHLGabv6dDgQ=="
+        },
+        "node_modules/d3-dispatch": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/d3-dispatch/-/d3-dispatch-2.0.0.tgz",
+            "integrity": "sha512-S/m2VsXI7gAti2pBoLClFFTMOO1HTtT0j99AuXLoGFKO6deHDdnv6ZGTxSTTUTgO1zVcv82fCOtDjYK4EECmWA=="
+        },
+        "node_modules/d3-drag": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/d3-drag/-/d3-drag-2.0.0.tgz",
+            "integrity": "sha512-g9y9WbMnF5uqB9qKqwIIa/921RYWzlUDv9Jl1/yONQwxbOfszAWTCm8u7HOTgJgRDXiRZN56cHT9pd24dmXs8w==",
+            "dependencies": {
+                "d3-dispatch": "1 - 2",
+                "d3-selection": "2"
+            }
+        },
+        "node_modules/d3-ease": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/d3-ease/-/d3-ease-2.0.0.tgz",
+            "integrity": "sha512-68/n9JWarxXkOWMshcT5IcjbB+agblQUaIsbnXmrzejn2O82n3p2A9R2zEB9HIEFWKFwPAEDDN8gR0VdSAyyAQ=="
+        },
+        "node_modules/d3-format": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-2.0.0.tgz",
+            "integrity": "sha512-Ab3S6XuE/Q+flY96HXT0jOXcM4EAClYFnRGY5zsjRGNy6qCYrQsMffs7cV5Q9xejb35zxW5hf/guKw34kvIKsA=="
+        },
+        "node_modules/d3-interpolate": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-2.0.1.tgz",
+            "integrity": "sha512-c5UhwwTs/yybcmTpAVqwSFl6vrQ8JZJoT5F7xNFK9pymv5C0Ymcc9/LIJHtYIggg/yS9YHw8i8O8tgb9pupjeQ==",
+            "dependencies": {
+                "d3-color": "1 - 2"
+            }
+        },
+        "node_modules/d3-path": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/d3-path/-/d3-path-2.0.0.tgz",
+            "integrity": "sha512-ZwZQxKhBnv9yHaiWd6ZU4x5BtCQ7pXszEV9CU6kRgwIQVQGLMv1oiL4M+MK/n79sYzsj+gcgpPQSctJUsLN7fA=="
+        },
+        "node_modules/d3-scale": {
+            "version": "3.2.3",
+            "resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-3.2.3.tgz",
+            "integrity": "sha512-8E37oWEmEzj57bHcnjPVOBS3n4jqakOeuv1EDdQSiSrYnMCBdMd3nc4HtKk7uia8DUHcY/CGuJ42xxgtEYrX0g==",
+            "dependencies": {
+                "d3-array": "^2.3.0",
+                "d3-format": "1 - 2",
+                "d3-interpolate": "1.2.0 - 2",
+                "d3-time": "1 - 2",
+                "d3-time-format": "2 - 3"
+            }
+        },
+        "node_modules/d3-scale/node_modules/d3-array": {
+            "version": "2.11.0",
+            "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-2.11.0.tgz",
+            "integrity": "sha512-26clcwmHQEdsLv34oNKq5Ia9tQ26Y/4HqS3dQzF42QBUqymZJ+9PORcN1G52bt37NsL2ABoX4lvyYZc+A9Y0zw==",
+            "dependencies": {
+                "internmap": "^1.0.0"
+            }
+        },
+        "node_modules/d3-selection": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/d3-selection/-/d3-selection-2.0.0.tgz",
+            "integrity": "sha512-XoGGqhLUN/W14NmaqcO/bb1nqjDAw5WtSYb2X8wiuQWvSZUsUVYsOSkOybUrNvcBjaywBdYPy03eXHMXjk9nZA=="
+        },
+        "node_modules/d3-shape": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-2.0.0.tgz",
+            "integrity": "sha512-djpGlA779ua+rImicYyyjnOjeubyhql1Jyn1HK0bTyawuH76UQRWXd+pftr67H6Fa8hSwetkgb/0id3agKWykw==",
+            "dependencies": {
+                "d3-path": "1 - 2"
+            }
+        },
+        "node_modules/d3-time": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-2.0.0.tgz",
+            "integrity": "sha512-2mvhstTFcMvwStWd9Tj3e6CEqtOivtD8AUiHT8ido/xmzrI9ijrUUihZ6nHuf/vsScRBonagOdj0Vv+SEL5G3Q=="
+        },
+        "node_modules/d3-time-format": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-3.0.0.tgz",
+            "integrity": "sha512-UXJh6EKsHBTjopVqZBhFysQcoXSv/5yLONZvkQ5Kk3qbwiUYkdX17Xa1PT6U1ZWXGGfB1ey5L8dKMlFq2DO0Ag==",
+            "dependencies": {
+                "d3-time": "1 - 2"
+            }
+        },
+        "node_modules/d3-timer": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/d3-timer/-/d3-timer-2.0.0.tgz",
+            "integrity": "sha512-TO4VLh0/420Y/9dO3+f9abDEFYeCUr2WZRlxJvbp4HPTQcSylXNiL6yZa9FIUvV1yRiFufl1bszTCLDqv9PWNA=="
+        },
+        "node_modules/d3-transition": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/d3-transition/-/d3-transition-2.0.0.tgz",
+            "integrity": "sha512-42ltAGgJesfQE3u9LuuBHNbGrI/AJjNL2OAUdclE70UE6Vy239GCBEYD38uBPoLeNsOhFStGpPI0BAOV+HMxog==",
+            "dependencies": {
+                "d3-color": "1 - 2",
+                "d3-dispatch": "1 - 2",
+                "d3-ease": "1 - 2",
+                "d3-interpolate": "1 - 2",
+                "d3-timer": "1 - 2"
+            }
+        },
+        "node_modules/d3-zoom": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/d3-zoom/-/d3-zoom-2.0.0.tgz",
+            "integrity": "sha512-fFg7aoaEm9/jf+qfstak0IYpnesZLiMX6GZvXtUSdv8RH2o4E2qeelgdU09eKS6wGuiGMfcnMI0nTIqWzRHGpw==",
+            "dependencies": {
+                "d3-dispatch": "1 - 2",
+                "d3-drag": "2",
+                "d3-interpolate": "1 - 2",
+                "d3-selection": "2",
+                "d3-transition": "2"
+            }
+        },
+        "node_modules/dashdash": {
+            "version": "1.14.1",
+            "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
+            "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
+            "dependencies": {
+                "assert-plus": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10"
+            }
+        },
+        "node_modules/data-urls": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-1.1.0.tgz",
+            "integrity": "sha512-YTWYI9se1P55u58gL5GkQHW4P6VJBJ5iBT+B5a7i2Tjadhv52paJG0qHX4A0OR6/t52odI64KP2YvFpkDOi3eQ==",
+            "dev": true,
+            "dependencies": {
+                "abab": "^2.0.0",
+                "whatwg-mimetype": "^2.2.0",
+                "whatwg-url": "^7.0.0"
+            }
+        },
+        "node_modules/date-fns": {
+            "version": "2.14.0",
+            "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.14.0.tgz",
+            "integrity": "sha512-1zD+68jhFgDIM0rF05rcwYO8cExdNqxjq4xP1QKM60Q45mnO6zaMWB4tOzrIr4M4GSLntsKeE4c9Bdl2jhL/yw=="
+        },
+        "node_modules/dateformat": {
+            "version": "1.0.12",
+            "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
+            "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk=",
+            "dev": true,
+            "dependencies": {
+                "get-stdin": "^4.0.1",
+                "meow": "^3.3.0"
+            },
+            "bin": {
+                "dateformat": "bin/cli.js"
+            },
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/dateformat/node_modules/get-stdin": {
+            "version": "4.0.1",
+            "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
+            "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/de-indent": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz",
+            "integrity": "sha1-sgOOhG3DO6pXlhKNCAS0VbjB4h0="
+        },
+        "node_modules/debounce": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/debounce/-/debounce-1.2.1.tgz",
+            "integrity": "sha512-XRRe6Glud4rd/ZGQfiV1ruXSfbvfJedlV9Y6zOlP+2K04vBYiJEte6stfFkCP03aMnY5tsipamumUjL14fofug=="
+        },
+        "node_modules/debug": {
+            "version": "3.2.6",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
+            "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/decamelize": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
+            "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/decode-uri-component": {
+            "version": "0.2.0",
+            "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz",
+            "integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU=",
+            "engines": {
+                "node": ">=0.10"
+            }
+        },
+        "node_modules/decompress-response": {
+            "version": "4.2.1",
+            "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-4.2.1.tgz",
+            "integrity": "sha512-jOSne2qbyE+/r8G1VU+G/82LBs2Fs4LAsTiLSHOCOMZQl2OKZ6i8i4IyHemTe+/yIXOtTcRQMzPcgyhoFlqPkw==",
+            "dependencies": {
+                "mimic-response": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/deep-eql": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-3.0.1.tgz",
+            "integrity": "sha512-+QeIQyN5ZuO+3Uk5DYh6/1eKO0m0YmJFGNmFHGACpf1ClL1nmlV/p4gNgbl2pJGxgXb4faqo6UE+M5ACEMyVcw==",
+            "dependencies": {
+                "type-detect": "^4.0.0"
+            },
+            "engines": {
+                "node": ">=0.12"
+            }
+        },
+        "node_modules/deep-equal": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.1.1.tgz",
+            "integrity": "sha512-yd9c5AdiqVcR+JjcwUQb9DkhJc8ngNr0MahEBGvDiJw8puWab2yZlh+nkasOnZP+EGTAP6rRp2JzJhJZzvNF8g==",
+            "dependencies": {
+                "is-arguments": "^1.0.4",
+                "is-date-object": "^1.0.1",
+                "is-regex": "^1.0.4",
+                "object-is": "^1.0.1",
+                "object-keys": "^1.1.1",
+                "regexp.prototype.flags": "^1.2.0"
+            }
+        },
+        "node_modules/deep-extend": {
+            "version": "0.6.0",
+            "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.6.0.tgz",
+            "integrity": "sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==",
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/deep-is": {
+            "version": "0.1.3",
+            "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
+            "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ=",
+            "dev": true
+        },
+        "node_modules/deepmerge": {
+            "version": "2.2.1",
+            "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-2.2.1.tgz",
+            "integrity": "sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/default-gateway": {
+            "version": "4.2.0",
+            "resolved": "https://registry.npmjs.org/default-gateway/-/default-gateway-4.2.0.tgz",
+            "integrity": "sha512-h6sMrVB1VMWVrW13mSc6ia/DwYYw5MN6+exNu1OaJeFac5aSAvwM7lZ0NVfTABuSkQelr4h5oebg3KB1XPdjgA==",
+            "dev": true,
+            "dependencies": {
+                "execa": "^1.0.0",
+                "ip-regex": "^2.1.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/default-gateway/node_modules/cross-spawn": {
+            "version": "6.0.5",
+            "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
+            "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
+            "dev": true,
+            "dependencies": {
+                "nice-try": "^1.0.4",
+                "path-key": "^2.0.1",
+                "semver": "^5.5.0",
+                "shebang-command": "^1.2.0",
+                "which": "^1.2.9"
+            },
+            "engines": {
+                "node": ">=4.8"
+            }
+        },
+        "node_modules/default-gateway/node_modules/execa": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/execa/-/execa-1.0.0.tgz",
+            "integrity": "sha512-adbxcyWV46qiHyvSp50TKt05tB4tK3HcmF7/nxfAdhnox83seTDbwnaqKO4sXRy7roHAIFqJP/Rw/AuEbX61LA==",
+            "dev": true,
+            "dependencies": {
+                "cross-spawn": "^6.0.0",
+                "get-stream": "^4.0.0",
+                "is-stream": "^1.1.0",
+                "npm-run-path": "^2.0.0",
+                "p-finally": "^1.0.0",
+                "signal-exit": "^3.0.0",
+                "strip-eof": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/default-gateway/node_modules/get-stream": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-4.1.0.tgz",
+            "integrity": "sha512-GMat4EJ5161kIy2HevLlr4luNjBgvmj413KaQA7jt4V8B4RDsfpHk7WQ9GVqfYyyx8OS/L66Kox+rJRNklLK7w==",
+            "dev": true,
+            "dependencies": {
+                "pump": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/define-properties": {
+            "version": "1.1.3",
+            "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.3.tgz",
+            "integrity": "sha512-3MqfYKj2lLzdMSf8ZIZE/V+Zuy+BgD6f164e8K2w7dgnpKArBDerGYpM46IYYcjnkdPNMjPk9A6VFB8+3SKlXQ==",
+            "dependencies": {
+                "object-keys": "^1.0.12"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/define-property": {
+            "version": "2.0.2",
+            "resolved": "https://registry.npmjs.org/define-property/-/define-property-2.0.2.tgz",
+            "integrity": "sha512-jwK2UV4cnPpbcG7+VRARKTZPUWowwXA8bzH5NP6ud0oeAxyYPuGZUAC7hMugpCdz4BeSZl2Dl9k66CHJ/46ZYQ==",
+            "dependencies": {
+                "is-descriptor": "^1.0.2",
+                "isobject": "^3.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/define-property/node_modules/is-accessor-descriptor": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-1.0.0.tgz",
+            "integrity": "sha512-m5hnHTkcVsPfqx3AKlyttIPb7J+XykHvJP2B9bZDjlhLIoEq4XoK64Vg7boZlVWYK6LUY94dYPEE7Lh0ZkZKcQ==",
+            "dependencies": {
+                "kind-of": "^6.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/define-property/node_modules/is-data-descriptor": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-1.0.0.tgz",
+            "integrity": "sha512-jbRXy1FmtAoCjQkVmIVYwuuqDFUbaOeDjmed1tOGPrsMhtJA4rD9tkgA0F1qJ3gRFRXcHYVkdeaP50Q5rE/jLQ==",
+            "dependencies": {
+                "kind-of": "^6.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/define-property/node_modules/is-descriptor": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.2.tgz",
+            "integrity": "sha512-2eis5WqQGV7peooDyLmNEPUrps9+SXX5c9pL3xEB+4e9HnGuDa7mB7kHxHw4CbqS9k1T2hOH3miL8n8WtiYVtg==",
+            "dependencies": {
+                "is-accessor-descriptor": "^1.0.0",
+                "is-data-descriptor": "^1.0.0",
+                "kind-of": "^6.0.2"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/del": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/del/-/del-4.1.1.tgz",
+            "integrity": "sha512-QwGuEUouP2kVwQenAsOof5Fv8K9t3D8Ca8NxcXKrIpEHjTXK5J2nXLdP+ALI1cgv8wj7KuwBhTwBkOZSJKM5XQ==",
+            "dev": true,
+            "dependencies": {
+                "@types/glob": "^7.1.1",
+                "globby": "^6.1.0",
+                "is-path-cwd": "^2.0.0",
+                "is-path-in-cwd": "^2.0.0",
+                "p-map": "^2.0.0",
+                "pify": "^4.0.1",
+                "rimraf": "^2.6.3"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/del/node_modules/globby": {
+            "version": "6.1.0",
+            "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
+            "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
+            "dev": true,
+            "dependencies": {
+                "array-union": "^1.0.1",
+                "glob": "^7.0.3",
+                "object-assign": "^4.0.1",
+                "pify": "^2.0.0",
+                "pinkie-promise": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/del/node_modules/globby/node_modules/pify": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+            "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/del/node_modules/rimraf": {
+            "version": "2.7.1",
+            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+            "dev": true,
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/delayed-stream": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+            "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/delegates": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
+            "integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o="
+        },
+        "node_modules/denque": {
+            "version": "1.4.1",
+            "resolved": "https://registry.npmjs.org/denque/-/denque-1.4.1.tgz",
+            "integrity": "sha512-OfzPuSZKGcgr96rf1oODnfjqBFmr1DVoc/TrItj3Ohe0Ah1C5WX5Baquw/9U9KovnQ88EqmJbD66rKYUQYN1tQ==",
+            "engines": {
+                "node": ">=0.10"
+            }
+        },
+        "node_modules/depcheck": {
+            "version": "0.9.2",
+            "resolved": "https://registry.npmjs.org/depcheck/-/depcheck-0.9.2.tgz",
+            "integrity": "sha512-w5f+lSZqLJJkk58s44eOd0Vor7hLZot4PlFL0y2JsIX5LuHQ2eAjHlDVeGBD4Mj6ZQSKakvKWRRCcPlvrdU2Sg==",
+            "dependencies": {
+                "@babel/parser": "^7.7.7",
+                "@babel/traverse": "^7.7.4",
+                "builtin-modules": "^3.0.0",
+                "camelcase": "^5.3.1",
+                "cosmiconfig": "^5.2.1",
+                "debug": "^4.1.1",
+                "deps-regex": "^0.1.4",
+                "js-yaml": "^3.4.2",
+                "lodash": "^4.17.15",
+                "minimatch": "^3.0.2",
+                "node-sass-tilde-importer": "^1.0.2",
+                "please-upgrade-node": "^3.2.0",
+                "require-package-name": "^2.0.1",
+                "resolve": "^1.14.1",
+                "vue-template-compiler": "^2.6.11",
+                "walkdir": "^0.4.1",
+                "yargs": "^15.0.2"
+            },
+            "bin": {
+                "depcheck": "bin/depcheck.js"
+            },
+            "engines": {
+                "node": ">=10"
+            }
+        },
+        "node_modules/depcheck/node_modules/ansi-regex": {
+            "version": "5.0.0",
+            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.0.tgz",
+            "integrity": "sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg==",
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/depcheck/node_modules/ansi-styles": {
+            "version": "4.2.1",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.2.1.tgz",
+            "integrity": "sha512-9VGjrMsG1vePxcSweQsN20KY/c4zN0h9fLjqAbwbPfahM3t+NL+M9HC8xeXG2I8pX5NoamTGNuomEUFI7fcUjA==",
+            "dependencies": {
+                "@types/color-name": "^1.1.1",
+                "color-convert": "^2.0.1"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/depcheck/node_modules/builtin-modules": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-3.1.0.tgz",
+            "integrity": "sha512-k0KL0aWZuBt2lrxrcASWDfwOLMnodeQjodT/1SxEQAXsHANgo6ZC/VEaSEHCXt7aSTZ4/4H5LKa+tBXmW7Vtvw==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/depcheck/node_modules/cliui": {
+            "version": "6.0.0",
+            "resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz",
+            "integrity": "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==",
+            "dependencies": {
+                "string-width": "^4.2.0",
+                "strip-ansi": "^6.0.0",
+                "wrap-ansi": "^6.2.0"
+            }
+        },
+        "node_modules/depcheck/node_modules/color-convert": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+            "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+            "dependencies": {
+                "color-name": "~1.1.4"
+            },
+            "engines": {
+                "node": ">=7.0.0"
+            }
+        },
+        "node_modules/depcheck/node_modules/color-name": {
+            "version": "1.1.4",
+            "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+            "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+        },
+        "node_modules/depcheck/node_modules/cosmiconfig": {
+            "version": "5.2.1",
+            "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-5.2.1.tgz",
+            "integrity": "sha512-H65gsXo1SKjf8zmrJ67eJk8aIRKV5ff2D4uKZIBZShbhGSpEmsQOPW/SKMKYhSTrqR7ufy6RP69rPogdaPh/kA==",
+            "dependencies": {
+                "import-fresh": "^2.0.0",
+                "is-directory": "^0.3.1",
+                "js-yaml": "^3.13.1",
+                "parse-json": "^4.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/depcheck/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/depcheck/node_modules/emoji-regex": {
+            "version": "8.0.0",
+            "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+            "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
+        },
+        "node_modules/depcheck/node_modules/find-up": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
+            "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
+            "dependencies": {
+                "locate-path": "^5.0.0",
+                "path-exists": "^4.0.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/depcheck/node_modules/import-fresh": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-2.0.0.tgz",
+            "integrity": "sha1-2BNVwVYS04bGH53dOSLUMEgipUY=",
+            "dependencies": {
+                "caller-path": "^2.0.0",
+                "resolve-from": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/depcheck/node_modules/is-fullwidth-code-point": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+            "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/depcheck/node_modules/locate-path": {
+            "version": "5.0.0",
+            "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
+            "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
+            "dependencies": {
+                "p-locate": "^4.1.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/depcheck/node_modules/p-locate": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
+            "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
+            "dependencies": {
+                "p-limit": "^2.2.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/depcheck/node_modules/parse-json": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-4.0.0.tgz",
+            "integrity": "sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA=",
+            "dependencies": {
+                "error-ex": "^1.3.1",
+                "json-parse-better-errors": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/depcheck/node_modules/path-exists": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
+            "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/depcheck/node_modules/resolve-from": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-3.0.0.tgz",
+            "integrity": "sha1-six699nWiBvItuZTM17rywoYh0g=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/depcheck/node_modules/string-width": {
+            "version": "4.2.0",
+            "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.0.tgz",
+            "integrity": "sha512-zUz5JD+tgqtuDjMhwIg5uFVV3dtqZ9yQJlZVfq4I01/K5Paj5UHj7VyrQOJvzawSVlKpObApbfD0Ed6yJc+1eg==",
+            "dependencies": {
+                "emoji-regex": "^8.0.0",
+                "is-fullwidth-code-point": "^3.0.0",
+                "strip-ansi": "^6.0.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/depcheck/node_modules/strip-ansi": {
+            "version": "6.0.0",
+            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.0.tgz",
+            "integrity": "sha512-AuvKTrTfQNYNIctbR1K/YGTR1756GycPsg7b9bdV9Duqur4gv6aKqHXah67Z8ImS7WEz5QVcOtlfW2rZEugt6w==",
+            "dependencies": {
+                "ansi-regex": "^5.0.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/depcheck/node_modules/wrap-ansi": {
+            "version": "6.2.0",
+            "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
+            "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
+            "dependencies": {
+                "ansi-styles": "^4.0.0",
+                "string-width": "^4.1.0",
+                "strip-ansi": "^6.0.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/depcheck/node_modules/yargs": {
+            "version": "15.3.1",
+            "resolved": "https://registry.npmjs.org/yargs/-/yargs-15.3.1.tgz",
+            "integrity": "sha512-92O1HWEjw27sBfgmXiixJWT5hRBp2eobqXicLtPBIDBhYB+1HpwZlXmbW2luivBJHBzki+7VyCLRtAkScbTBQA==",
+            "dependencies": {
+                "cliui": "^6.0.0",
+                "decamelize": "^1.2.0",
+                "find-up": "^4.1.0",
+                "get-caller-file": "^2.0.1",
+                "require-directory": "^2.1.1",
+                "require-main-filename": "^2.0.0",
+                "set-blocking": "^2.0.0",
+                "string-width": "^4.2.0",
+                "which-module": "^2.0.0",
+                "y18n": "^4.0.0",
+                "yargs-parser": "^18.1.1"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/depcheck/node_modules/yargs-parser": {
+            "version": "18.1.3",
+            "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-18.1.3.tgz",
+            "integrity": "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==",
+            "dependencies": {
+                "camelcase": "^5.0.0",
+                "decamelize": "^1.2.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/depd": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.2.tgz",
+            "integrity": "sha1-m81S4UwJd2PnSbJ0xDRu0uVgtak=",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/deps-regex": {
+            "version": "0.1.4",
+            "resolved": "https://registry.npmjs.org/deps-regex/-/deps-regex-0.1.4.tgz",
+            "integrity": "sha1-UYZnt2kUYKXn4KNBvnbrfOgJAYQ="
+        },
+        "node_modules/des.js": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.1.tgz",
+            "integrity": "sha512-Q0I4pfFrv2VPd34/vfLrFOoRmlYj3OV50i7fskps1jZWK1kApMWWT9G6RRUeYedLcBDIhnSDaUvJMb3AhUlaEA==",
+            "dev": true,
+            "dependencies": {
+                "inherits": "^2.0.1",
+                "minimalistic-assert": "^1.0.0"
+            }
+        },
+        "node_modules/destroy": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
+            "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA="
+        },
+        "node_modules/detect-file": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-1.0.0.tgz",
+            "integrity": "sha1-8NZtA2cqglyxtzvbP+YjEMjlUrc=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/detect-libc": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz",
+            "integrity": "sha1-+hN8S9aY7fVc1c0CrFWfkaTEups=",
+            "bin": {
+                "detect-libc": "bin/detect-libc.js"
+            },
+            "engines": {
+                "node": ">=0.10"
+            }
+        },
+        "node_modules/detect-node": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.4.tgz",
+            "integrity": "sha512-ZIzRpLJrOj7jjP2miAtgqIfmzbxa4ZOr5jJc601zklsfEx9oTzmmj2nVpIPRpNlRTIh8lc1kyViIY7BWSGNmKw==",
+            "dev": true
+        },
+        "node_modules/diff": {
+            "version": "3.5.0",
+            "resolved": "https://registry.npmjs.org/diff/-/diff-3.5.0.tgz",
+            "integrity": "sha512-A46qtFgd+g7pDZinpnwiRJtxbC1hpgf0uzP3iG89scHk0AUC7A1TGxf5OiiOUv/JMZR8GOt8hL900hV0bOy5xA==",
+            "engines": {
+                "node": ">=0.3.1"
+            }
+        },
+        "node_modules/diff-match-patch": {
+            "version": "1.0.5",
+            "resolved": "https://registry.npmjs.org/diff-match-patch/-/diff-match-patch-1.0.5.tgz",
+            "integrity": "sha512-IayShXAgj/QMXgB0IWmKx+rOPuGMhqm5w6jvFxmVenXKIzRqTAAsbBPT3kWQeGANj3jGgvcvv4yK6SxqYmikgw=="
+        },
+        "node_modules/diffie-hellman": {
+            "version": "5.0.3",
+            "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
+            "integrity": "sha512-kqag/Nl+f3GwyK25fhUMYj81BUOrZ9IuJsjIcDE5icNM9FJHAVm3VcUDxdLPoQtTuUylWm6ZIknYJwwaPxsUzg==",
+            "dev": true,
+            "dependencies": {
+                "bn.js": "^4.1.0",
+                "miller-rabin": "^4.0.0",
+                "randombytes": "^2.0.0"
+            }
+        },
+        "node_modules/diffie-hellman/node_modules/bn.js": {
+            "version": "4.12.0",
+            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
+            "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==",
+            "dev": true
+        },
+        "node_modules/dir-glob": {
+            "version": "2.2.2",
+            "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-2.2.2.tgz",
+            "integrity": "sha512-f9LBi5QWzIW3I6e//uxZoLBlUt9kcp66qo0sSCxL6YZKc75R1c4MFCoe/LaZiBGmgujvQdxc5Bn3QhfyvK5Hsw==",
+            "dev": true,
+            "dependencies": {
+                "path-type": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/dir-glob/node_modules/path-type": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/path-type/-/path-type-3.0.0.tgz",
+            "integrity": "sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==",
+            "dev": true,
+            "dependencies": {
+                "pify": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/dir-glob/node_modules/pify": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
+            "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=",
+            "dev": true,
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/dns-equal": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/dns-equal/-/dns-equal-1.0.0.tgz",
+            "integrity": "sha1-s55/HabrCnW6nBcySzR1PEfgZU0=",
+            "dev": true
+        },
+        "node_modules/dns-packet": {
+            "version": "1.3.1",
+            "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.1.tgz",
+            "integrity": "sha512-0UxfQkMhYAUaZI+xrNZOz/as5KgDU0M/fQ9b6SpkyLbk3GEswDi6PADJVaYJradtRVsRIlF1zLyOodbcTCDzUg==",
+            "dev": true,
+            "dependencies": {
+                "ip": "^1.1.0",
+                "safe-buffer": "^5.0.1"
+            }
+        },
+        "node_modules/dns-txt": {
+            "version": "2.0.2",
+            "resolved": "https://registry.npmjs.org/dns-txt/-/dns-txt-2.0.2.tgz",
+            "integrity": "sha1-uR2Ab10nGI5Ks+fRB9iBocxGQrY=",
+            "dev": true,
+            "dependencies": {
+                "buffer-indexof": "^1.0.0"
+            }
+        },
+        "node_modules/doctypes": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/doctypes/-/doctypes-1.1.0.tgz",
+            "integrity": "sha1-6oCxBqh1OHdOijpKWv4pPeSJ4Kk="
+        },
+        "node_modules/dom-helpers": {
+            "version": "3.4.0",
+            "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.4.0.tgz",
+            "integrity": "sha512-LnuPJ+dwqKDIyotW1VzmOZ5TONUN7CwkCR5hrgawTUbkBGYdeoNLZo6nNfGkCrjtE1nXXaj7iMMpDa8/d9WoIA==",
+            "dependencies": {
+                "@babel/runtime": "^7.1.2"
+            }
+        },
+        "node_modules/dom-serializer": {
+            "version": "0.2.2",
+            "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.2.2.tgz",
+            "integrity": "sha512-2/xPb3ORsQ42nHYiSunXkDjPLBaEj/xTwUO4B7XCZQTRk7EBtTOPaygh10YAAh2OI1Qrp6NWfpAhzswj0ydt9g==",
+            "dependencies": {
+                "domelementtype": "^2.0.1",
+                "entities": "^2.0.0"
+            }
+        },
+        "node_modules/dom-serializer/node_modules/domelementtype": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.0.1.tgz",
+            "integrity": "sha512-5HOHUDsYZWV8FGWN0Njbr/Rn7f/eWSQi1v7+HsUVwXgn8nWWlL64zKDkS0n8ZmQ3mlWOMuXOnR+7Nx/5tMO5AQ=="
+        },
+        "node_modules/dom-serializer/node_modules/entities": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/entities/-/entities-2.0.0.tgz",
+            "integrity": "sha512-D9f7V0JSRwIxlRI2mjMqufDrRDnx8p+eEOz7aUM9SuvF8gsBzra0/6tbjl1m8eQHrZlYj6PxqE00hZ1SAIKPLw=="
+        },
+        "node_modules/domain-browser": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.2.0.tgz",
+            "integrity": "sha512-jnjyiM6eRyZl2H+W8Q/zLMA481hzi0eszAaBUzIVnmYVDBbnLxVNnfu1HgEBvCbL+71FrxMl3E6lpKH7Ge3OXA==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.4",
+                "npm": ">=1.2"
+            }
+        },
+        "node_modules/domelementtype": {
+            "version": "1.3.1",
+            "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.1.tgz",
+            "integrity": "sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w=="
+        },
+        "node_modules/domexception": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/domexception/-/domexception-1.0.1.tgz",
+            "integrity": "sha512-raigMkn7CJNNo6Ihro1fzG7wr3fHuYVytzquZKX5n0yizGsTcYgzdIUwj1X9pK0VvjeihV+XiclP+DjwbsSKug==",
+            "dev": true,
+            "dependencies": {
+                "webidl-conversions": "^4.0.2"
+            }
+        },
+        "node_modules/domhandler": {
+            "version": "2.4.2",
+            "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.2.tgz",
+            "integrity": "sha512-JiK04h0Ht5u/80fdLMCEmV4zkNh2BcoMFBmZ/91WtYZ8qVXSKjiw7fXMgFPnHcSZgOo3XdinHvmnDUeMf5R4wA==",
+            "dependencies": {
+                "domelementtype": "1"
+            }
+        },
+        "node_modules/domutils": {
+            "version": "1.7.0",
+            "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.7.0.tgz",
+            "integrity": "sha512-Lgd2XcJ/NjEw+7tFvfKxOzCYKZsdct5lczQ2ZaQY8Djz7pfAD3Gbp8ySJWtreII/vDlMVmxwa6pHmdxIYgttDg==",
+            "dependencies": {
+                "dom-serializer": "0",
+                "domelementtype": "1"
+            }
+        },
+        "node_modules/dot-prop": {
+            "version": "4.2.0",
+            "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.2.0.tgz",
+            "integrity": "sha512-tUMXrxlExSW6U2EXiiKGSBVdYgtV8qlHL+C10TsW4PURY/ic+eaysnSkwB4kA/mBlCyy/IKDJ+Lc3wbWeaXtuQ==",
+            "dependencies": {
+                "is-obj": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/dotenv": {
+            "version": "8.2.0",
+            "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.2.0.tgz",
+            "integrity": "sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw==",
+            "dev": true,
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/double-bits": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/double-bits/-/double-bits-1.1.1.tgz",
+            "integrity": "sha1-WKu6RUlNpND6Nrc60RoobJGEscY="
+        },
+        "node_modules/duplexer3": {
+            "version": "0.1.4",
+            "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz",
+            "integrity": "sha1-7gHdHKwO08vH/b6jfcCo8c4ALOI="
+        },
+        "node_modules/duplexify": {
+            "version": "3.7.1",
+            "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.7.1.tgz",
+            "integrity": "sha512-07z8uv2wMyS51kKhD1KsdXJg5WQ6t93RneqRxUHnskXVtlYYkLqM0gqStQZ3pj073g687jPCHrqNfCzawLYh5g==",
+            "dev": true,
+            "dependencies": {
+                "end-of-stream": "^1.0.0",
+                "inherits": "^2.0.1",
+                "readable-stream": "^2.0.0",
+                "stream-shift": "^1.0.0"
+            }
+        },
+        "node_modules/duplexify/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dev": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/dynamic-dedupe": {
+            "version": "0.3.0",
+            "resolved": "https://registry.npmjs.org/dynamic-dedupe/-/dynamic-dedupe-0.3.0.tgz",
+            "integrity": "sha1-BuRMIj9eTpTXjvnbI6ZRXOL5YqE=",
+            "dev": true,
+            "dependencies": {
+                "xtend": "^4.0.0"
+            }
+        },
+        "node_modules/ecc-jsbn": {
+            "version": "0.1.2",
+            "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.2.tgz",
+            "integrity": "sha1-OoOpBOVDUyh4dMVkt1SThoSamMk=",
+            "dependencies": {
+                "jsbn": "~0.1.0",
+                "safer-buffer": "^2.1.0"
+            }
+        },
+        "node_modules/ecdsa-sig-formatter": {
+            "version": "1.0.11",
+            "resolved": "https://registry.npmjs.org/ecdsa-sig-formatter/-/ecdsa-sig-formatter-1.0.11.tgz",
+            "integrity": "sha512-nagl3RYrbNv6kQkeJIpt6NJZy8twLB/2vtz6yN9Z4vRKHN4/QZJIEbqohALSgwKdnksuY3k5Addp5lg8sVoVcQ==",
+            "dependencies": {
+                "safe-buffer": "^5.0.1"
+            }
+        },
+        "node_modules/ee-first": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
+            "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
+        },
+        "node_modules/elliptic": {
+            "version": "6.5.4",
+            "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.4.tgz",
+            "integrity": "sha512-iLhC6ULemrljPZb+QutR5TQGB+pdW6KGD5RSegS+8sorOZT+rdQFbsQFJgvN3eRqNALqJer4oQ16YvJHlU8hzQ==",
+            "dev": true,
+            "dependencies": {
+                "bn.js": "^4.11.9",
+                "brorand": "^1.1.0",
+                "hash.js": "^1.0.0",
+                "hmac-drbg": "^1.0.1",
+                "inherits": "^2.0.4",
+                "minimalistic-assert": "^1.0.1",
+                "minimalistic-crypto-utils": "^1.0.1"
+            }
+        },
+        "node_modules/elliptic/node_modules/bn.js": {
+            "version": "4.12.0",
+            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
+            "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==",
+            "dev": true
+        },
+        "node_modules/emoji-regex": {
+            "version": "7.0.3",
+            "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-7.0.3.tgz",
+            "integrity": "sha512-CwBLREIQ7LvYFB0WyRvwhq5N5qPhc6PMjD6bYggFlI5YyDgl+0vxq5VHbMOFqLg7hfWzmu8T5Z1QofhmTIhItA=="
+        },
+        "node_modules/emojis-list": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz",
+            "integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==",
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/emotion": {
+            "version": "10.0.27",
+            "resolved": "https://registry.npmjs.org/emotion/-/emotion-10.0.27.tgz",
+            "integrity": "sha512-2xdDzdWWzue8R8lu4G76uWX5WhyQuzATon9LmNeCy/2BHVC6dsEpfhN1a0qhELgtDVdjyEA6J8Y/VlI5ZnaH0g==",
+            "dependencies": {
+                "babel-plugin-emotion": "^10.0.27",
+                "create-emotion": "^10.0.27"
+            }
+        },
+        "node_modules/encodeurl": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
+            "integrity": "sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k=",
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/encoding": {
+            "version": "0.1.12",
+            "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz",
+            "integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s=",
+            "dependencies": {
+                "iconv-lite": "~0.4.13"
+            }
+        },
+        "node_modules/end-of-stream": {
+            "version": "1.4.4",
+            "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz",
+            "integrity": "sha512-+uw1inIHVPQoaVuHzRyXd21icM+cnt4CzD5rW+NC1wjOUSTOs+Te7FOv7AhN7vS9x/oIyhLP5PR1H+phQAHu5Q==",
+            "dependencies": {
+                "once": "^1.4.0"
+            }
+        },
+        "node_modules/engine.io": {
+            "version": "3.4.1",
+            "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-3.4.1.tgz",
+            "integrity": "sha512-8MfIfF1/IIfxuc2gv5K+XlFZczw/BpTvqBdl0E2fBLkYQp4miv4LuDTVtYt4yMyaIFLEr4vtaSgV4mjvll8Crw==",
+            "dependencies": {
+                "accepts": "~1.3.4",
+                "base64id": "2.0.0",
+                "cookie": "0.3.1",
+                "debug": "~4.1.0",
+                "engine.io-parser": "~2.2.0",
+                "ws": "^7.1.2"
+            },
+            "engines": {
+                "node": ">=8.0.0"
+            }
+        },
+        "node_modules/engine.io-client": {
+            "version": "3.4.1",
+            "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-3.4.1.tgz",
+            "integrity": "sha512-RJNmA+A9Js+8Aoq815xpGAsgWH1VoSYM//2VgIiu9lNOaHFfLpTjH4tOzktBpjIs5lvOfiNY1dwf+NuU6D38Mw==",
+            "dependencies": {
+                "component-emitter": "1.2.1",
+                "component-inherit": "0.0.3",
+                "debug": "~4.1.0",
+                "engine.io-parser": "~2.2.0",
+                "has-cors": "1.1.0",
+                "indexof": "0.0.1",
+                "parseqs": "0.0.5",
+                "parseuri": "0.0.5",
+                "ws": "~6.1.0",
+                "xmlhttprequest-ssl": "~1.5.4",
+                "yeast": "0.1.2"
+            }
+        },
+        "node_modules/engine.io-client/node_modules/component-emitter": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
+            "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
+        },
+        "node_modules/engine.io-client/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/engine.io-client/node_modules/ws": {
+            "version": "6.1.4",
+            "resolved": "https://registry.npmjs.org/ws/-/ws-6.1.4.tgz",
+            "integrity": "sha512-eqZfL+NE/YQc1/ZynhojeV8q+H050oR8AZ2uIev7RU10svA9ZnJUddHcOUZTJLinZ9yEfdA2kSATS2qZK5fhJA==",
+            "dependencies": {
+                "async-limiter": "~1.0.0"
+            }
+        },
+        "node_modules/engine.io-parser": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-2.2.0.tgz",
+            "integrity": "sha512-6I3qD9iUxotsC5HEMuuGsKA0cXerGz+4uGcXQEkfBidgKf0amsjrrtwcbwK/nzpZBxclXlV7gGl9dgWvu4LF6w==",
+            "dependencies": {
+                "after": "0.8.2",
+                "arraybuffer.slice": "~0.0.7",
+                "base64-arraybuffer": "0.1.5",
+                "blob": "0.0.5",
+                "has-binary2": "~1.0.2"
+            }
+        },
+        "node_modules/engine.io/node_modules/cookie": {
+            "version": "0.3.1",
+            "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz",
+            "integrity": "sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s=",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/engine.io/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/enhanced-resolve": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-4.1.1.tgz",
+            "integrity": "sha512-98p2zE+rL7/g/DzMHMTF4zZlCgeVdJ7yr6xzEpJRYwFYrGi9ANdn5DnJURg6RpBkyk60XYDnWIv51VfIhfNGuA==",
+            "dev": true,
+            "dependencies": {
+                "graceful-fs": "^4.1.2",
+                "memory-fs": "^0.5.0",
+                "tapable": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=6.9.0"
+            }
+        },
+        "node_modules/entities": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.2.tgz",
+            "integrity": "sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w=="
+        },
+        "node_modules/equation-editor-react": {
+            "resolved": "git+ssh://git@github.com/bobzel/equation-editor-react.git#75915e852b4b36a6a4cd3e1cbc80598da6b65227",
+            "dependencies": {
+                "jquery": "^3.4.1",
+                "mathquill": "^0.10.1-a"
+            }
+        },
+        "node_modules/errno": {
+            "version": "0.1.7",
+            "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.7.tgz",
+            "integrity": "sha512-MfrRBDWzIWifgq6tJj60gkAwtLNb6sQPlcFrSOflcP1aFmmruKQ2wRnze/8V6kgyz7H3FF8Npzv78mZ7XLLflg==",
+            "dev": true,
+            "dependencies": {
+                "prr": "~1.0.1"
+            },
+            "bin": {
+                "errno": "cli.js"
+            }
+        },
+        "node_modules/error-ex": {
+            "version": "1.3.2",
+            "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
+            "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==",
+            "dependencies": {
+                "is-arrayish": "^0.2.1"
+            }
+        },
+        "node_modules/es-abstract": {
+            "version": "1.17.5",
+            "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.17.5.tgz",
+            "integrity": "sha512-BR9auzDbySxOcfog0tLECW8l28eRGpDpU3Dm3Hp4q/N+VtLTmyj4EUN088XZWQDW/hzj6sYRDXeOFsaAODKvpg==",
+            "dependencies": {
+                "es-to-primitive": "^1.2.1",
+                "function-bind": "^1.1.1",
+                "has": "^1.0.3",
+                "has-symbols": "^1.0.1",
+                "is-callable": "^1.1.5",
+                "is-regex": "^1.0.5",
+                "object-inspect": "^1.7.0",
+                "object-keys": "^1.1.1",
+                "object.assign": "^4.1.0",
+                "string.prototype.trimleft": "^2.1.1",
+                "string.prototype.trimright": "^2.1.1"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/es-to-primitive": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.2.1.tgz",
+            "integrity": "sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==",
+            "dependencies": {
+                "is-callable": "^1.1.4",
+                "is-date-object": "^1.0.1",
+                "is-symbol": "^1.0.2"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/es5-ext": {
+            "version": "0.10.53",
+            "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.53.tgz",
+            "integrity": "sha512-Xs2Stw6NiNHWypzRTY1MtaG/uJlwCk8kH81920ma8mvN8Xq1gsfhZvpkImLQArw8AHnv8MT2I45J3c0R8slE+Q==",
+            "dev": true,
+            "dependencies": {
+                "es6-iterator": "~2.0.3",
+                "es6-symbol": "~3.1.3",
+                "next-tick": "~1.0.0"
+            }
+        },
+        "node_modules/es6-iterator": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.3.tgz",
+            "integrity": "sha1-p96IkUGgWpSwhUQDstCg+/qY87c=",
+            "dev": true,
+            "dependencies": {
+                "d": "1",
+                "es5-ext": "^0.10.35",
+                "es6-symbol": "^3.1.1"
+            }
+        },
+        "node_modules/es6-promise": {
+            "version": "3.2.1",
+            "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.2.1.tgz",
+            "integrity": "sha1-7FYjOGgDKQkgcXDDlEjiREndH8Q="
+        },
+        "node_modules/es6-symbol": {
+            "version": "3.1.3",
+            "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.3.tgz",
+            "integrity": "sha512-NJ6Yn3FuDinBaBRWl/q5X/s4koRHBrgKAu+yGI6JCBeiu3qrcbJhwT2GeR/EXVfylRk8dpQVJoLEFhK+Mu31NA==",
+            "dev": true,
+            "dependencies": {
+                "d": "^1.0.1",
+                "ext": "^1.1.2"
+            }
+        },
+        "node_modules/escape-html": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
+            "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
+        },
+        "node_modules/escape-string-regexp": {
+            "version": "1.0.5",
+            "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+            "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
+            "engines": {
+                "node": ">=0.8.0"
+            }
+        },
+        "node_modules/escodegen": {
+            "version": "1.14.1",
+            "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.14.1.tgz",
+            "integrity": "sha512-Bmt7NcRySdIfNPfU2ZoXDrrXsG9ZjvDxcAlMfDUgRBjLOWTuIACXPBFJH7Z+cLb40JeQco5toikyc9t9P8E9SQ==",
+            "dev": true,
+            "dependencies": {
+                "esprima": "^4.0.1",
+                "estraverse": "^4.2.0",
+                "esutils": "^2.0.2",
+                "optionator": "^0.8.1"
+            },
+            "bin": {
+                "escodegen": "bin/escodegen.js",
+                "esgenerate": "bin/esgenerate.js"
+            },
+            "engines": {
+                "node": ">=4.0"
+            },
+            "optionalDependencies": {
+                "source-map": "~0.6.1"
+            }
+        },
+        "node_modules/escodegen/node_modules/source-map": {
+            "version": "0.6.1",
+            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+            "dev": true,
+            "optional": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/eslint-scope": {
+            "version": "4.0.3",
+            "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-4.0.3.tgz",
+            "integrity": "sha512-p7VutNr1O/QrxysMo3E45FjYDTeXBy0iTltPFNSqKAIfjDSXC+4dj+qfyuD8bfAXrW/y6lW3O76VaYNPKfpKrg==",
+            "dev": true,
+            "dependencies": {
+                "esrecurse": "^4.1.0",
+                "estraverse": "^4.1.1"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/esprima": {
+            "version": "4.0.1",
+            "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz",
+            "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==",
+            "bin": {
+                "esparse": "bin/esparse.js",
+                "esvalidate": "bin/esvalidate.js"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/esrecurse": {
+            "version": "4.3.0",
+            "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
+            "integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
+            "dev": true,
+            "dependencies": {
+                "estraverse": "^5.2.0"
+            },
+            "engines": {
+                "node": ">=4.0"
+            }
+        },
+        "node_modules/esrecurse/node_modules/estraverse": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.2.0.tgz",
+            "integrity": "sha512-BxbNGGNm0RyRYvUdHpIwv9IWzeM9XClbOxwoATuFdOE7ZE6wHL+HQ5T8hoPM+zHvmKzzsEqhgy0GrQ5X13afiQ==",
+            "dev": true,
+            "engines": {
+                "node": ">=4.0"
+            }
+        },
+        "node_modules/estraverse": {
+            "version": "4.3.0",
+            "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.3.0.tgz",
+            "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==",
+            "dev": true,
+            "engines": {
+                "node": ">=4.0"
+            }
+        },
+        "node_modules/esutils": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
+            "integrity": "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/etag": {
+            "version": "1.8.1",
+            "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
+            "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc=",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/event-target-shim": {
+            "version": "5.0.1",
+            "resolved": "https://registry.npmjs.org/event-target-shim/-/event-target-shim-5.0.1.tgz",
+            "integrity": "sha512-i/2XbnSz/uxRCU6+NdVJgKWDTM427+MqYbkQzD321DuCQJUqOuJKIA0IM2+W2xtYHdKOmZ4dR6fExsd4SXL+WQ==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/eventemitter3": {
+            "version": "4.0.4",
+            "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.4.tgz",
+            "integrity": "sha512-rlaVLnVxtxvoyLsQQFBx53YmXHDxRIzzTLbdfxqi4yocpSjAxXwkU0cScM5JgSKMqEhrZpnvQ2D9gjylR0AimQ==",
+            "dev": true
+        },
+        "node_modules/events": {
+            "version": "3.3.0",
+            "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz",
+            "integrity": "sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.8.x"
+            }
+        },
+        "node_modules/eventsource": {
+            "version": "1.0.7",
+            "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-1.0.7.tgz",
+            "integrity": "sha512-4Ln17+vVT0k8aWq+t/bF5arcS3EpT9gYtW66EPacdj/mAFevznsnyoHLPy2BA8gbIQeIHoPsvwmfBftfcG//BQ==",
+            "dev": true,
+            "dependencies": {
+                "original": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.12.0"
+            }
+        },
+        "node_modules/evp_bytestokey": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.3.tgz",
+            "integrity": "sha512-/f2Go4TognH/KvCISP7OUsHn85hT9nUkxxA9BEWxFn+Oj9o8ZNLm/40hdlgSLyuOimsrTKLUMEorQexp/aPQeA==",
+            "dev": true,
+            "dependencies": {
+                "md5.js": "^1.3.4",
+                "safe-buffer": "^5.1.1"
+            }
+        },
+        "node_modules/execa": {
+            "version": "0.7.0",
+            "resolved": "https://registry.npmjs.org/execa/-/execa-0.7.0.tgz",
+            "integrity": "sha1-lEvs00zEHuMqY6n68nrVpl/Fl3c=",
+            "dependencies": {
+                "cross-spawn": "^5.0.1",
+                "get-stream": "^3.0.0",
+                "is-stream": "^1.1.0",
+                "npm-run-path": "^2.0.0",
+                "p-finally": "^1.0.0",
+                "signal-exit": "^3.0.0",
+                "strip-eof": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/execa/node_modules/cross-spawn": {
+            "version": "5.1.0",
+            "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
+            "integrity": "sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk=",
+            "dependencies": {
+                "lru-cache": "^4.0.1",
+                "shebang-command": "^1.2.0",
+                "which": "^1.2.9"
+            }
+        },
+        "node_modules/execa/node_modules/lru-cache": {
+            "version": "4.1.5",
+            "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.5.tgz",
+            "integrity": "sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==",
+            "dependencies": {
+                "pseudomap": "^1.0.2",
+                "yallist": "^2.1.2"
+            }
+        },
+        "node_modules/execa/node_modules/yallist": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz",
+            "integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI="
+        },
+        "node_modules/exenv": {
+            "version": "1.2.2",
+            "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz",
+            "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50="
+        },
+        "node_modules/exeq": {
+            "version": "2.4.0",
+            "resolved": "https://registry.npmjs.org/exeq/-/exeq-2.4.0.tgz",
+            "integrity": "sha1-Td8qaEZIxCeteZNJzzO9dTWPiEo=",
+            "dependencies": {
+                "bluebird": "^3.0.3",
+                "native-or-bluebird": "^1.2.0"
+            },
+            "engines": {
+                "node": ">= 0.10.0"
+            }
+        },
+        "node_modules/exif": {
+            "version": "0.6.0",
+            "resolved": "https://registry.npmjs.org/exif/-/exif-0.6.0.tgz",
+            "integrity": "sha1-YKYmaAdlQst+T1cZnUrG830sX0o=",
+            "dependencies": {
+                "debug": "^2.2"
+            }
+        },
+        "node_modules/exif/node_modules/debug": {
+            "version": "2.6.9",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/exif/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        },
+        "node_modules/expand-brackets": {
+            "version": "2.1.4",
+            "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-2.1.4.tgz",
+            "integrity": "sha1-t3c14xXOMPa27/D4OwQVGiJEliI=",
+            "dependencies": {
+                "debug": "^2.3.3",
+                "define-property": "^0.2.5",
+                "extend-shallow": "^2.0.1",
+                "posix-character-classes": "^0.1.0",
+                "regex-not": "^1.0.0",
+                "snapdragon": "^0.8.1",
+                "to-regex": "^3.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/expand-brackets/node_modules/debug": {
+            "version": "2.6.9",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/expand-brackets/node_modules/define-property": {
+            "version": "0.2.5",
+            "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+            "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
+            "dependencies": {
+                "is-descriptor": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/expand-brackets/node_modules/extend-shallow": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+            "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+            "dependencies": {
+                "is-extendable": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/expand-brackets/node_modules/is-extendable": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
+            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/expand-brackets/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        },
+        "node_modules/expand-template": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/expand-template/-/expand-template-2.0.3.tgz",
+            "integrity": "sha512-XYfuKMvj4O35f/pOXLObndIRvyQ+/+6AhODh+OKWj9S9498pHHn/IMszH+gt0fBCRWMNfk1ZSp5x3AifmnI2vg==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/expand-tilde": {
+            "version": "2.0.2",
+            "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-2.0.2.tgz",
+            "integrity": "sha1-l+gBqgUt8CRU3kawK/YhZCzchQI=",
+            "dev": true,
+            "dependencies": {
+                "homedir-polyfill": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/express": {
+            "version": "4.17.1",
+            "resolved": "https://registry.npmjs.org/express/-/express-4.17.1.tgz",
+            "integrity": "sha512-mHJ9O79RqluphRrcw2X/GTh3k9tVv8YcoyY4Kkh4WDMUYKRZUq0h1o0w2rrrxBqM7VoeUVqgb27xlEMXTnYt4g==",
+            "dependencies": {
+                "accepts": "~1.3.7",
+                "array-flatten": "1.1.1",
+                "body-parser": "1.19.0",
+                "content-disposition": "0.5.3",
+                "content-type": "~1.0.4",
+                "cookie": "0.4.0",
+                "cookie-signature": "1.0.6",
+                "debug": "2.6.9",
+                "depd": "~1.1.2",
+                "encodeurl": "~1.0.2",
+                "escape-html": "~1.0.3",
+                "etag": "~1.8.1",
+                "finalhandler": "~1.1.2",
+                "fresh": "0.5.2",
+                "merge-descriptors": "1.0.1",
+                "methods": "~1.1.2",
+                "on-finished": "~2.3.0",
+                "parseurl": "~1.3.3",
+                "path-to-regexp": "0.1.7",
+                "proxy-addr": "~2.0.5",
+                "qs": "6.7.0",
+                "range-parser": "~1.2.1",
+                "safe-buffer": "5.1.2",
+                "send": "0.17.1",
+                "serve-static": "1.14.1",
+                "setprototypeof": "1.1.1",
+                "statuses": "~1.5.0",
+                "type-is": "~1.6.18",
+                "utils-merge": "1.0.1",
+                "vary": "~1.1.2"
+            },
+            "engines": {
+                "node": ">= 0.10.0"
+            }
+        },
+        "node_modules/express-flash": {
+            "version": "0.0.2",
+            "resolved": "https://registry.npmjs.org/express-flash/-/express-flash-0.0.2.tgz",
+            "integrity": "sha1-I9GovPP5DXB5KOSJ+Whp7K0KzaI=",
+            "dependencies": {
+                "connect-flash": "0.1.x"
+            },
+            "engines": {
+                "node": ">= 0.8.0"
+            }
+        },
+        "node_modules/express-session": {
+            "version": "1.17.1",
+            "resolved": "https://registry.npmjs.org/express-session/-/express-session-1.17.1.tgz",
+            "integrity": "sha512-UbHwgqjxQZJiWRTMyhvWGvjBQduGCSBDhhZXYenziMFjxst5rMV+aJZ6hKPHZnPyHGsrqRICxtX8jtEbm/z36Q==",
+            "dependencies": {
+                "cookie": "0.4.0",
+                "cookie-signature": "1.0.6",
+                "debug": "2.6.9",
+                "depd": "~2.0.0",
+                "on-headers": "~1.0.2",
+                "parseurl": "~1.3.3",
+                "safe-buffer": "5.2.0",
+                "uid-safe": "~2.1.5"
+            },
+            "engines": {
+                "node": ">= 0.8.0"
+            }
+        },
+        "node_modules/express-session/node_modules/debug": {
+            "version": "2.6.9",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/express-session/node_modules/depd": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
+            "integrity": "sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==",
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/express-session/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        },
+        "node_modules/express-session/node_modules/safe-buffer": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.0.tgz",
+            "integrity": "sha512-fZEwUGbVl7kouZs1jCdMLdt95hdIv0ZeHg6L7qPeciMZhZ+/gdesW4wgTARkrFWEpspjEATAzUGPG8N2jJiwbg=="
+        },
+        "node_modules/express-validator": {
+            "version": "5.3.1",
+            "resolved": "https://registry.npmjs.org/express-validator/-/express-validator-5.3.1.tgz",
+            "integrity": "sha512-g8xkipBF6VxHbO1+ksC7nxUU7+pWif0+OZXjZTybKJ/V0aTVhuCoHbyhIPgSYVldwQLocGExPtB2pE0DqK4jsw==",
+            "dependencies": {
+                "lodash": "^4.17.10",
+                "validator": "^10.4.0"
+            },
+            "engines": {
+                "node": ">= 6.0.0"
+            }
+        },
+        "node_modules/express/node_modules/debug": {
+            "version": "2.6.9",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/express/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        },
+        "node_modules/express/node_modules/qs": {
+            "version": "6.7.0",
+            "resolved": "https://registry.npmjs.org/qs/-/qs-6.7.0.tgz",
+            "integrity": "sha512-VCdBRNFTX1fyE7Nb6FYoURo/SPe62QCaAyzJvUjwRaIsc+NePBEniHlvxFmmX56+HZphIGtV0XeCirBtpDrTyQ==",
+            "engines": {
+                "node": ">=0.6"
+            }
+        },
+        "node_modules/expressjs": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/expressjs/-/expressjs-1.0.1.tgz",
+            "integrity": "sha1-IgMoRpoY31rWFeK3oM6ZXxf7ru8="
+        },
+        "node_modules/ext": {
+            "version": "1.4.0",
+            "resolved": "https://registry.npmjs.org/ext/-/ext-1.4.0.tgz",
+            "integrity": "sha512-Key5NIsUxdqKg3vIsdw9dSuXpPCQ297y6wBjL30edxwPgt2E44WcWBZey/ZvUc6sERLTxKdyCu4gZFmUbk1Q7A==",
+            "dev": true,
+            "dependencies": {
+                "type": "^2.0.0"
+            }
+        },
+        "node_modules/ext/node_modules/type": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/type/-/type-2.0.0.tgz",
+            "integrity": "sha512-KBt58xCHry4Cejnc2ISQAF7QY+ORngsWfxezO68+12hKV6lQY8P/psIkcbjeHWn7MqcgciWJyCCevFMJdIXpow==",
+            "dev": true
+        },
+        "node_modules/extend": {
+            "version": "3.0.2",
+            "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
+            "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g=="
+        },
+        "node_modules/extend-shallow": {
+            "version": "3.0.2",
+            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-3.0.2.tgz",
+            "integrity": "sha1-Jqcarwc7OfshJxcnRhMcJwQCjbg=",
+            "dependencies": {
+                "assign-symbols": "^1.0.0",
+                "is-extendable": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/extglob": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.4.tgz",
+            "integrity": "sha512-Nmb6QXkELsuBr24CJSkilo6UHHgbekK5UiZgfE6UHD3Eb27YC6oD+bhcT+tJ6cl8dmsgdQxnWlcry8ksBIBLpw==",
+            "dependencies": {
+                "array-unique": "^0.3.2",
+                "define-property": "^1.0.0",
+                "expand-brackets": "^2.1.4",
+                "extend-shallow": "^2.0.1",
+                "fragment-cache": "^0.2.1",
+                "regex-not": "^1.0.0",
+                "snapdragon": "^0.8.1",
+                "to-regex": "^3.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/extglob/node_modules/define-property": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
+            "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
+            "dependencies": {
+                "is-descriptor": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/extglob/node_modules/extend-shallow": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+            "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+            "dependencies": {
+                "is-extendable": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/extglob/node_modules/is-accessor-descriptor": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-1.0.0.tgz",
+            "integrity": "sha512-m5hnHTkcVsPfqx3AKlyttIPb7J+XykHvJP2B9bZDjlhLIoEq4XoK64Vg7boZlVWYK6LUY94dYPEE7Lh0ZkZKcQ==",
+            "dependencies": {
+                "kind-of": "^6.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/extglob/node_modules/is-data-descriptor": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-1.0.0.tgz",
+            "integrity": "sha512-jbRXy1FmtAoCjQkVmIVYwuuqDFUbaOeDjmed1tOGPrsMhtJA4rD9tkgA0F1qJ3gRFRXcHYVkdeaP50Q5rE/jLQ==",
+            "dependencies": {
+                "kind-of": "^6.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/extglob/node_modules/is-descriptor": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.2.tgz",
+            "integrity": "sha512-2eis5WqQGV7peooDyLmNEPUrps9+SXX5c9pL3xEB+4e9HnGuDa7mB7kHxHw4CbqS9k1T2hOH3miL8n8WtiYVtg==",
+            "dependencies": {
+                "is-accessor-descriptor": "^1.0.0",
+                "is-data-descriptor": "^1.0.0",
+                "kind-of": "^6.0.2"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/extglob/node_modules/is-extendable": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
+            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/extract-zip": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-2.0.1.tgz",
+            "integrity": "sha512-GDhU9ntwuKyGXdZBUgTIe+vXnWj0fppUEtMDL0+idd5Sta8TGpHssn/eusA9mrPr9qNDym6SxAYZjNvCn/9RBg==",
+            "dependencies": {
+                "debug": "^4.1.1",
+                "get-stream": "^5.1.0",
+                "yauzl": "^2.10.0"
+            },
+            "bin": {
+                "extract-zip": "cli.js"
+            },
+            "engines": {
+                "node": ">= 10.17.0"
+            },
+            "optionalDependencies": {
+                "@types/yauzl": "^2.9.1"
+            }
+        },
+        "node_modules/extract-zip/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/extract-zip/node_modules/get-stream": {
+            "version": "5.1.0",
+            "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-5.1.0.tgz",
+            "integrity": "sha512-EXr1FOzrzTfGeL0gQdeFEvOMm2mzMOglyiOXSTpPC+iAjAKftbr3jpCMWynogwYnM+eSj9sHGc6wjIcDvYiygw==",
+            "dependencies": {
+                "pump": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/extsprintf": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
+            "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU=",
+            "engines": [
+                "node >=0.6.0"
+            ]
+        },
+        "node_modules/fast-deep-equal": {
+            "version": "3.1.1",
+            "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.1.tgz",
+            "integrity": "sha512-8UEa58QDLauDNfpbrX55Q9jrGHThw2ZMdOky5Gl1CDtVeJDPVrG4Jxx1N8jw2gkWaff5UUuX1KJd+9zGe2B+ZA=="
+        },
+        "node_modules/fast-json-stable-stringify": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
+            "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw=="
+        },
+        "node_modules/fast-levenshtein": {
+            "version": "2.0.6",
+            "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
+            "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=",
+            "dev": true
+        },
+        "node_modules/fast-text-encoding": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/fast-text-encoding/-/fast-text-encoding-1.0.2.tgz",
+            "integrity": "sha512-5rQdinSsycpzvAoHga2EDn+LRX1d5xLFsuNG0Kg61JrAT/tASXcLL0nf/33v+sAxlQcfYmWbTURa1mmAf55jGw=="
+        },
+        "node_modules/faye-websocket": {
+            "version": "0.10.0",
+            "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
+            "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ=",
+            "dev": true,
+            "dependencies": {
+                "websocket-driver": ">=0.5.1"
+            },
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/fbjs": {
+            "version": "0.8.17",
+            "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.17.tgz",
+            "integrity": "sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90=",
+            "dependencies": {
+                "core-js": "^1.0.0",
+                "isomorphic-fetch": "^2.1.1",
+                "loose-envify": "^1.0.0",
+                "object-assign": "^4.1.0",
+                "promise": "^7.1.1",
+                "setimmediate": "^1.0.5",
+                "ua-parser-js": "^0.7.18"
+            }
+        },
+        "node_modules/fd-slicer": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.1.0.tgz",
+            "integrity": "sha1-JcfInLH5B3+IkbvmHY85Dq4lbx4=",
+            "dependencies": {
+                "pend": "~1.2.0"
+            }
+        },
+        "node_modules/figgy-pudding": {
+            "version": "3.5.2",
+            "resolved": "https://registry.npmjs.org/figgy-pudding/-/figgy-pudding-3.5.2.tgz",
+            "integrity": "sha512-0btnI/H8f2pavGMN8w40mlSKOfTK2SVJmBfBeVIj3kNw0swwgzyRq0d5TJVOwodFmtvpPeWPN/MCcfuWF0Ezbw==",
+            "dev": true
+        },
+        "node_modules/file-loader": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-3.0.1.tgz",
+            "integrity": "sha512-4sNIOXgtH/9WZq4NvlfU3Opn5ynUsqBwSLyM+I7UOwdGigTBYfVVQEwe/msZNX/j4pCJTIM14Fsw66Svo1oVrw==",
+            "dev": true,
+            "dependencies": {
+                "loader-utils": "^1.0.2",
+                "schema-utils": "^1.0.0"
+            },
+            "engines": {
+                "node": ">= 6.9.0"
+            }
+        },
+        "node_modules/file-loader/node_modules/schema-utils": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
+            "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
+            "dev": true,
+            "dependencies": {
+                "ajv": "^6.1.0",
+                "ajv-errors": "^1.0.0",
+                "ajv-keywords": "^3.1.0"
+            },
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/file-saver": {
+            "version": "2.0.2",
+            "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.2.tgz",
+            "integrity": "sha512-Wz3c3XQ5xroCxd1G8b7yL0Ehkf0TC9oYC6buPFkNnU9EnaPlifeAFCyCh+iewXTyFRcg0a6j3J7FmJsIhlhBdw=="
+        },
+        "node_modules/file-uri-to-path": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
+            "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
+            "optional": true
+        },
+        "node_modules/fill-range": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
+            "integrity": "sha1-1USBHUKPmOsGpj3EAtJAPDKMOPc=",
+            "dependencies": {
+                "extend-shallow": "^2.0.1",
+                "is-number": "^3.0.0",
+                "repeat-string": "^1.6.1",
+                "to-regex-range": "^2.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/fill-range/node_modules/extend-shallow": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+            "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+            "dependencies": {
+                "is-extendable": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/fill-range/node_modules/is-extendable": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
+            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/finalhandler": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.2.tgz",
+            "integrity": "sha512-aAWcW57uxVNrQZqFXjITpW3sIUQmHGG3qSb9mUah9MgMC4NeWhNOlNjXEYq3HjRAvL6arUviZGGJsBg6z0zsWA==",
+            "dependencies": {
+                "debug": "2.6.9",
+                "encodeurl": "~1.0.2",
+                "escape-html": "~1.0.3",
+                "on-finished": "~2.3.0",
+                "parseurl": "~1.3.3",
+                "statuses": "~1.5.0",
+                "unpipe": "~1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/finalhandler/node_modules/debug": {
+            "version": "2.6.9",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/finalhandler/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        },
+        "node_modules/find": {
+            "version": "0.1.7",
+            "resolved": "https://registry.npmjs.org/find/-/find-0.1.7.tgz",
+            "integrity": "sha1-yGyHrxqxjyIrvjjeyGy8dg0Wpvs=",
+            "dependencies": {
+                "traverse-chain": "~0.1.0"
+            }
+        },
+        "node_modules/find-cache-dir": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-1.0.0.tgz",
+            "integrity": "sha1-kojj6ePMN0hxfTnq3hfPcfww7m8=",
+            "dev": true,
+            "dependencies": {
+                "commondir": "^1.0.1",
+                "make-dir": "^1.0.0",
+                "pkg-dir": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/find-in-files": {
+            "version": "0.5.0",
+            "resolved": "https://registry.npmjs.org/find-in-files/-/find-in-files-0.5.0.tgz",
+            "integrity": "sha512-VraTc6HdtdSHmAp0yJpAy20yPttGKzyBWc7b7FPnnsX9TOgmKx0g9xajizpF/iuu4IvNK4TP0SpyBT9zAlwG+g==",
+            "dependencies": {
+                "find": "^0.1.5",
+                "q": "^1.0.1"
+            }
+        },
+        "node_modules/find-parent-dir": {
+            "version": "0.3.0",
+            "resolved": "https://registry.npmjs.org/find-parent-dir/-/find-parent-dir-0.3.0.tgz",
+            "integrity": "sha1-M8RLQpqysvBkYpnF+fcY83b/jVQ="
+        },
+        "node_modules/find-root": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
+            "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng=="
+        },
+        "node_modules/find-up": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/find-up/-/find-up-3.0.0.tgz",
+            "integrity": "sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg==",
+            "dependencies": {
+                "locate-path": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/findup-sync": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-3.0.0.tgz",
+            "integrity": "sha512-YbffarhcicEhOrm4CtrwdKBdCuz576RLdhJDsIfvNtxUuhdRet1qZcsMjqbePtAseKdAnDyM/IyXbu7PRPRLYg==",
+            "dev": true,
+            "dependencies": {
+                "detect-file": "^1.0.0",
+                "is-glob": "^4.0.0",
+                "micromatch": "^3.0.4",
+                "resolve-dir": "^1.0.1"
+            },
+            "engines": {
+                "node": ">= 0.10"
+            }
+        },
+        "node_modules/fit-curve": {
+            "version": "0.1.7",
+            "resolved": "https://registry.npmjs.org/fit-curve/-/fit-curve-0.1.7.tgz",
+            "integrity": "sha512-Md3b3ReA/qJwwYvKXeHpOV1fhPqwhJ9/29zc9lfi8ijyg00J0S9C7+5XMZDFhlDAKbwOvVgBxVIG1EHoMSC3vw=="
+        },
+        "node_modules/flat": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/flat/-/flat-4.1.0.tgz",
+            "integrity": "sha512-Px/TiLIznH7gEDlPXcUD4KnBusa6kR6ayRUVcnEAbreRIuhkqow/mun59BuRXwoYk7ZQOLW1ZM05ilIvK38hFw==",
+            "dependencies": {
+                "is-buffer": "~2.0.3"
+            },
+            "bin": {
+                "flat": "cli.js"
+            }
+        },
+        "node_modules/flexlayout-react": {
+            "version": "0.3.11",
+            "resolved": "https://registry.npmjs.org/flexlayout-react/-/flexlayout-react-0.3.11.tgz",
+            "integrity": "sha512-V+rEfyYJBqNk9oBgotPoXg8rmom4/ji9Mvr6f7T8sIJs83RuyK1D3oOrya2ydZIUCP2T6BIvj7rFTmRRkzpU8w=="
+        },
+        "node_modules/fluent-ffmpeg": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/fluent-ffmpeg/-/fluent-ffmpeg-2.1.2.tgz",
+            "integrity": "sha1-yVLeIkD4EuvaCqgAbXd27irPfXQ=",
+            "dependencies": {
+                "async": ">=0.2.9",
+                "which": "^1.1.1"
+            },
+            "engines": {
+                "node": ">=0.8.0"
+            }
+        },
+        "node_modules/flush-write-stream": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/flush-write-stream/-/flush-write-stream-1.1.1.tgz",
+            "integrity": "sha512-3Z4XhFZ3992uIq0XOqb9AreonueSYphE6oYbpt5+3u06JWklbsPkNv3ZKkP9Bz/r+1MWCaMoSQ28P85+1Yc77w==",
+            "dev": true,
+            "dependencies": {
+                "inherits": "^2.0.3",
+                "readable-stream": "^2.3.6"
+            }
+        },
+        "node_modules/flush-write-stream/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dev": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/follow-redirects": {
+            "version": "1.12.1",
+            "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.12.1.tgz",
+            "integrity": "sha512-tmRv0AVuR7ZyouUHLeNSiO6pqulF7dYa3s19c6t+wz9LD69/uSzdMxJ2S91nTI9U3rt/IldxpzMOFejp6f0hjg==",
+            "engines": {
+                "node": ">=4.0"
+            }
+        },
+        "node_modules/for-each-property": {
+            "version": "0.0.4",
+            "resolved": "https://registry.npmjs.org/for-each-property/-/for-each-property-0.0.4.tgz",
+            "integrity": "sha1-z6hXrsFCLh0Sb/CHhPz2Jim8g/Y=",
+            "dependencies": {
+                "get-prototype-chain": "^1.0.1"
+            }
+        },
+        "node_modules/for-each-property-deep": {
+            "version": "0.0.3",
+            "resolved": "https://registry.npmjs.org/for-each-property-deep/-/for-each-property-deep-0.0.3.tgz",
+            "integrity": "sha1-MTCaSvw4qcygbxsiP1PWSm0IP60=",
+            "dependencies": {
+                "for-each-property": "0.0.4"
+            }
+        },
+        "node_modules/for-in": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
+            "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/forever-agent": {
+            "version": "0.6.1",
+            "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
+            "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/fork-ts-checker-webpack-plugin": {
+            "version": "1.6.0",
+            "resolved": "https://registry.npmjs.org/fork-ts-checker-webpack-plugin/-/fork-ts-checker-webpack-plugin-1.6.0.tgz",
+            "integrity": "sha512-vqOY5gakcoon2s12V7MMe01OPwfgqulUWFzm+geQaPPOBKjW1I7aqqoBVlU0ECn97liMB0ECs16pRdIGe9qdRw==",
+            "dev": true,
+            "dependencies": {
+                "babel-code-frame": "^6.22.0",
+                "chalk": "^2.4.1",
+                "chokidar": "^2.0.4",
+                "micromatch": "^3.1.10",
+                "minimatch": "^3.0.4",
+                "semver": "^5.6.0",
+                "tapable": "^1.0.0",
+                "worker-rpc": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=6.11.5",
+                "yarn": ">=1.0.0"
+            }
+        },
+        "node_modules/form-data": {
+            "version": "2.5.1",
+            "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.5.1.tgz",
+            "integrity": "sha512-m21N3WOmEEURgk6B9GLOE4RuWOFf28Lhh9qGYeNlGq4VDXUlJy2th2slBNU8Gp8EzloYZOibZJ7t5ecIrFSjVA==",
+            "dev": true,
+            "dependencies": {
+                "asynckit": "^0.4.0",
+                "combined-stream": "^1.0.6",
+                "mime-types": "^2.1.12"
+            },
+            "engines": {
+                "node": ">= 0.12"
+            }
+        },
+        "node_modules/formidable": {
+            "version": "1.2.2",
+            "resolved": "https://registry.npmjs.org/formidable/-/formidable-1.2.2.tgz",
+            "integrity": "sha512-V8gLm+41I/8kguQ4/o1D3RIHRmhYFG4pnNyonvua+40rqcEmT4+V71yaZ3B457xbbgCsCfjSPi65u/W6vK1U5Q=="
+        },
+        "node_modules/forwarded": {
+            "version": "0.1.2",
+            "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
+            "integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ=",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/fragment-cache": {
+            "version": "0.2.1",
+            "resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz",
+            "integrity": "sha1-QpD60n8T6Jvn8zeZxrxaCr//DRk=",
+            "dependencies": {
+                "map-cache": "^0.2.2"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/fresh": {
+            "version": "0.5.2",
+            "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
+            "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac=",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/from2": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/from2/-/from2-2.3.0.tgz",
+            "integrity": "sha1-i/tVAr3kpNNs/e6gB/zKIdfjgq8=",
+            "dev": true,
+            "dependencies": {
+                "inherits": "^2.0.1",
+                "readable-stream": "^2.0.0"
+            }
+        },
+        "node_modules/from2/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dev": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/fs-constants": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/fs-constants/-/fs-constants-1.0.0.tgz",
+            "integrity": "sha512-y6OAwoSIf7FyjMIv94u+b5rdheZEjzR63GTyZJm5qh4Bi+2YgwLCcI/fPFZkL5PSixOt6ZNKm+w+Hfp/Bciwow=="
+        },
+        "node_modules/fs-extra": {
+            "version": "0.26.7",
+            "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
+            "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k=",
+            "dependencies": {
+                "graceful-fs": "^4.1.2",
+                "jsonfile": "^2.1.0",
+                "klaw": "^1.0.0",
+                "path-is-absolute": "^1.0.0",
+                "rimraf": "^2.2.8"
+            }
+        },
+        "node_modules/fs-extra/node_modules/rimraf": {
+            "version": "2.7.1",
+            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/fs-minipass": {
+            "version": "1.2.7",
+            "resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-1.2.7.tgz",
+            "integrity": "sha512-GWSSJGFy4e9GUeCcbIkED+bgAoFyj7XF1mV8rma3QW4NIqX9Kyx79N/PF61H5udOV3aY1IaMLs6pGbH71nlCTA==",
+            "dependencies": {
+                "minipass": "^2.6.0"
+            }
+        },
+        "node_modules/fs-write-stream-atomic": {
+            "version": "1.0.10",
+            "resolved": "https://registry.npmjs.org/fs-write-stream-atomic/-/fs-write-stream-atomic-1.0.10.tgz",
+            "integrity": "sha1-tH31NJPvkR33VzHnCp3tAYnbQMk=",
+            "dev": true,
+            "dependencies": {
+                "graceful-fs": "^4.1.2",
+                "iferr": "^0.1.5",
+                "imurmurhash": "^0.1.4",
+                "readable-stream": "1 || 2"
+            }
+        },
+        "node_modules/fs-write-stream-atomic/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dev": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/fs.realpath": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
+            "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
+        },
+        "node_modules/fsevents": {
+            "version": "2.1.3",
+            "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.1.3.tgz",
+            "integrity": "sha512-Auw9a4AxqWpa9GUfj370BMPzzyncfBABW8Mab7BGWBYDj4Isgq+cDKtx0i6u9jcX9pQDnswsaaOTgTmA5pEjuQ==",
+            "dev": true,
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "engines": {
+                "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+            }
+        },
+        "node_modules/fstream": {
+            "version": "1.0.12",
+            "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.12.tgz",
+            "integrity": "sha512-WvJ193OHa0GHPEL+AycEJgxvBEwyfRkN1vhjca23OaPVMCaLCXTd5qAu82AjTcgP1UJmytkOKb63Ypde7raDIg==",
+            "dependencies": {
+                "graceful-fs": "^4.1.2",
+                "inherits": "~2.0.0",
+                "mkdirp": ">=0.5 0",
+                "rimraf": "2"
+            },
+            "engines": {
+                "node": ">=0.6"
+            }
+        },
+        "node_modules/fstream/node_modules/rimraf": {
+            "version": "2.7.1",
+            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/function-bind": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
+            "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
+        },
+        "node_modules/function-plot": {
+            "version": "1.22.7",
+            "resolved": "https://registry.npmjs.org/function-plot/-/function-plot-1.22.7.tgz",
+            "integrity": "sha512-rB6FeVqvgNECmt5PhIvFFEOyEjM9AWLIpMkj9Nzbzq9f81Irgn3ZrXAuv5+qnuzM99jPL7ZM4kK3+ImiKXcSHA==",
+            "dependencies": {
+                "built-in-math-eval": "^0.3.0",
+                "clamp": "^1.0.1",
+                "d3-axis": "^2.0.0",
+                "d3-color": "^2.0.0",
+                "d3-format": "^2.0.0",
+                "d3-interpolate": "^2.0.1",
+                "d3-scale": "^3.2.2",
+                "d3-selection": "^2.0.0",
+                "d3-shape": "^2.0.0",
+                "d3-zoom": "^2.0.0",
+                "interval-arithmetic-eval": "^0.4.7"
+            }
+        },
+        "node_modules/gauge": {
+            "version": "2.7.4",
+            "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
+            "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c=",
+            "dependencies": {
+                "aproba": "^1.0.3",
+                "console-control-strings": "^1.0.0",
+                "has-unicode": "^2.0.0",
+                "object-assign": "^4.1.0",
+                "signal-exit": "^3.0.0",
+                "string-width": "^1.0.1",
+                "strip-ansi": "^3.0.1",
+                "wide-align": "^1.1.0"
+            }
+        },
+        "node_modules/gauge/node_modules/ansi-regex": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+            "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/gauge/node_modules/is-fullwidth-code-point": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+            "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
+            "dependencies": {
+                "number-is-nan": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/gauge/node_modules/string-width": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+            "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
+            "dependencies": {
+                "code-point-at": "^1.0.0",
+                "is-fullwidth-code-point": "^1.0.0",
+                "strip-ansi": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/gauge/node_modules/strip-ansi": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+            "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
+            "dependencies": {
+                "ansi-regex": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/gaxios": {
+            "version": "2.3.4",
+            "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-2.3.4.tgz",
+            "integrity": "sha512-US8UMj8C5pRnao3Zykc4AAVr+cffoNKRTg9Rsf2GiuZCW69vgJj38VK2PzlPuQU73FZ/nTk9/Av6/JGcE1N9vA==",
+            "dependencies": {
+                "abort-controller": "^3.0.0",
+                "extend": "^3.0.2",
+                "https-proxy-agent": "^5.0.0",
+                "is-stream": "^2.0.0",
+                "node-fetch": "^2.3.0"
+            },
+            "engines": {
+                "node": ">=8.10.0"
+            }
+        },
+        "node_modules/gaxios/node_modules/is-stream": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.0.tgz",
+            "integrity": "sha512-XCoy+WlUr7d1+Z8GgSuXmpuUFC9fOhRXglJMx+dwLKTkL44Cjd4W1Z5P+BQZpr+cR93aGP4S/s7Ftw6Nd/kiEw==",
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/gaxios/node_modules/node-fetch": {
+            "version": "2.6.0",
+            "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.0.tgz",
+            "integrity": "sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA==",
+            "engines": {
+                "node": "4.x || >=6.0.0"
+            }
+        },
+        "node_modules/gaze": {
+            "version": "1.1.3",
+            "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.3.tgz",
+            "integrity": "sha512-BRdNm8hbWzFzWHERTrejLqwHDfS4GibPoq5wjTPIoJHoBtKGPg3xAFfxmM+9ztbXelxcf2hwQcaz1PtmFeue8g==",
+            "dependencies": {
+                "globule": "^1.0.0"
+            },
+            "engines": {
+                "node": ">= 4.0.0"
+            }
+        },
+        "node_modules/gcp-metadata": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-2.0.4.tgz",
+            "integrity": "sha512-p1lXhJvcKvJHWfQXhkd4Za1kyXRsGZA0JH7Cjs07W9hrg84d/j5tqQhbGewlSLx9gNyuQUid69uLux48YbggLg==",
+            "dependencies": {
+                "gaxios": "^2.0.1",
+                "json-bigint": "^0.3.0"
+            },
+            "engines": {
+                "node": ">=8.10.0"
+            }
+        },
+        "node_modules/get-caller-file": {
+            "version": "2.0.5",
+            "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+            "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+            "engines": {
+                "node": "6.* || 8.* || >= 10.*"
+            }
+        },
+        "node_modules/get-func-name": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/get-func-name/-/get-func-name-2.0.0.tgz",
+            "integrity": "sha1-6td0q+5y4gQJQzoGY2YCPdaIekE=",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/get-node-dimensions": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/get-node-dimensions/-/get-node-dimensions-1.2.1.tgz",
+            "integrity": "sha512-2MSPMu7S1iOTL+BOa6K1S62hB2zUAYNF/lV0gSVlOaacd087lc6nR1H1r0e3B1CerTo+RceOmi1iJW+vp21xcQ=="
+        },
+        "node_modules/get-prototype-chain": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/get-prototype-chain/-/get-prototype-chain-1.0.1.tgz",
+            "integrity": "sha1-oXGhFeoeSQbG7ThDofABwYUQQW8=",
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/get-stdin": {
+            "version": "5.0.1",
+            "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-5.0.1.tgz",
+            "integrity": "sha1-Ei4WFZHiH/TFJTAwVpPyDmOTo5g=",
+            "engines": {
+                "node": ">=0.12.0"
+            }
+        },
+        "node_modules/get-stream": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
+            "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/get-value": {
+            "version": "2.0.6",
+            "resolved": "https://registry.npmjs.org/get-value/-/get-value-2.0.6.tgz",
+            "integrity": "sha1-3BXKHGcjh8p2vTesCjlbogQqLCg=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/getpass": {
+            "version": "0.1.7",
+            "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
+            "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
+            "dependencies": {
+                "assert-plus": "^1.0.0"
+            }
+        },
+        "node_modules/github-from-package": {
+            "version": "0.0.0",
+            "resolved": "https://registry.npmjs.org/github-from-package/-/github-from-package-0.0.0.tgz",
+            "integrity": "sha1-l/tdlr/eiXMxPyDoKI75oWf6ZM4="
+        },
+        "node_modules/glob": {
+            "version": "7.1.6",
+            "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.6.tgz",
+            "integrity": "sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==",
+            "dependencies": {
+                "fs.realpath": "^1.0.0",
+                "inflight": "^1.0.4",
+                "inherits": "2",
+                "minimatch": "^3.0.4",
+                "once": "^1.3.0",
+                "path-is-absolute": "^1.0.0"
+            },
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/glob-parent": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
+            "integrity": "sha1-nmr2KZ2NO9K9QEMIMr0RPfkGxa4=",
+            "dependencies": {
+                "is-glob": "^3.1.0",
+                "path-dirname": "^1.0.0"
+            }
+        },
+        "node_modules/glob-parent/node_modules/is-glob": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
+            "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo=",
+            "dependencies": {
+                "is-extglob": "^2.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/global-dirs": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/global-dirs/-/global-dirs-0.1.1.tgz",
+            "integrity": "sha1-sxnA3UYH81PzvpzKTHL8FIxJ9EU=",
+            "dependencies": {
+                "ini": "^1.3.4"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/global-modules": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-2.0.0.tgz",
+            "integrity": "sha512-NGbfmJBp9x8IxyJSd1P+otYK8vonoJactOogrVfFRIAEY1ukil8RSKDz2Yo7wh1oihl51l/r6W4epkeKJHqL8A==",
+            "dev": true,
+            "dependencies": {
+                "global-prefix": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/global-modules/node_modules/global-prefix": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-3.0.0.tgz",
+            "integrity": "sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==",
+            "dev": true,
+            "dependencies": {
+                "ini": "^1.3.5",
+                "kind-of": "^6.0.2",
+                "which": "^1.3.1"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/global-prefix": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-1.0.2.tgz",
+            "integrity": "sha1-2/dDxsFJklk8ZVVoy2btMsASLr4=",
+            "dev": true,
+            "dependencies": {
+                "expand-tilde": "^2.0.2",
+                "homedir-polyfill": "^1.0.1",
+                "ini": "^1.3.4",
+                "is-windows": "^1.0.1",
+                "which": "^1.2.14"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/globals": {
+            "version": "11.12.0",
+            "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
+            "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/globby": {
+            "version": "7.1.1",
+            "resolved": "https://registry.npmjs.org/globby/-/globby-7.1.1.tgz",
+            "integrity": "sha1-+yzP+UAfhgCUXfral0QMypcrhoA=",
+            "dev": true,
+            "dependencies": {
+                "array-union": "^1.0.1",
+                "dir-glob": "^2.0.0",
+                "glob": "^7.1.2",
+                "ignore": "^3.3.5",
+                "pify": "^3.0.0",
+                "slash": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/globby/node_modules/pify": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
+            "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=",
+            "dev": true,
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/globule": {
+            "version": "1.3.1",
+            "resolved": "https://registry.npmjs.org/globule/-/globule-1.3.1.tgz",
+            "integrity": "sha512-OVyWOHgw29yosRHCHo7NncwR1hW5ew0W/UrvtwvjefVJeQ26q4/8r8FmPsSF1hJ93IgWkyv16pCTz6WblMzm/g==",
+            "dependencies": {
+                "glob": "~7.1.1",
+                "lodash": "~4.17.12",
+                "minimatch": "~3.0.2"
+            },
+            "engines": {
+                "node": ">= 0.10"
+            }
+        },
+        "node_modules/golden-layout": {
+            "version": "1.5.9",
+            "resolved": "https://registry.npmjs.org/golden-layout/-/golden-layout-1.5.9.tgz",
+            "integrity": "sha1-o5vB9qZ+b4hreXwBbdkk6UJrp38=",
+            "dependencies": {
+                "jquery": "*"
+            }
+        },
+        "node_modules/google-auth-library": {
+            "version": "4.2.6",
+            "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-4.2.6.tgz",
+            "integrity": "sha512-oJ6tCA9rbsYeIVY+mcLPFHa2hatz3XO6idYIrlI/KhhlMxZrO3tKyU8O2Pxu5KnSBBP7Wj4HtbM1LLKngNFaFw==",
+            "dependencies": {
+                "arrify": "^2.0.0",
+                "base64-js": "^1.3.0",
+                "fast-text-encoding": "^1.0.0",
+                "gaxios": "^2.0.0",
+                "gcp-metadata": "^2.0.0",
+                "gtoken": "^3.0.0",
+                "jws": "^3.1.5",
+                "lru-cache": "^5.0.0"
+            },
+            "engines": {
+                "node": ">=8.10.0"
+            }
+        },
+        "node_modules/google-maps-react": {
+            "version": "2.0.6",
+            "resolved": "https://registry.npmjs.org/google-maps-react/-/google-maps-react-2.0.6.tgz",
+            "integrity": "sha512-M8Eo9WndfQEfxcmm6yRq03qdJgw1x6rQmJ9DN+a+xPQ3K7yNDGkVDbinrf4/8vcox7nELbeopbm4bpefKewWfQ=="
+        },
+        "node_modules/google-p12-pem": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/google-p12-pem/-/google-p12-pem-2.0.4.tgz",
+            "integrity": "sha512-S4blHBQWZRnEW44OcR7TL9WR+QCqByRvhNDZ/uuQfpxywfupikf/miba8js1jZi6ZOGv5slgSuoshCWh6EMDzg==",
+            "dependencies": {
+                "node-forge": "^0.9.0"
+            },
+            "bin": {
+                "gp12-pem": "build/src/bin/gp12-pem.js"
+            },
+            "engines": {
+                "node": ">=8.10.0"
+            }
+        },
+        "node_modules/googleapis": {
+            "version": "40.0.1",
+            "resolved": "https://registry.npmjs.org/googleapis/-/googleapis-40.0.1.tgz",
+            "integrity": "sha512-B6qZVCautOOspEhru9GZ814I+ztkGWyA4ZEUfaXwXHBruX/HAWqedbsuUEx1w3nCECywK/FLTNUdcbH9zpaMaw==",
+            "dependencies": {
+                "google-auth-library": "^4.0.0",
+                "googleapis-common": "^2.0.2"
+            },
+            "engines": {
+                "node": ">=8.10.0"
+            }
+        },
+        "node_modules/googleapis-common": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/googleapis-common/-/googleapis-common-2.0.4.tgz",
+            "integrity": "sha512-8RRkxr24v1jIKCC1onFWA8RGnwFV55m3Qpil9DLX1yLc9e5qvOJsRoDOhhD2e7jFRONYEhT/BzT8vJZANqSr9w==",
+            "dependencies": {
+                "extend": "^3.0.2",
+                "gaxios": "^2.0.1",
+                "google-auth-library": "^4.2.5",
+                "qs": "^6.7.0",
+                "url-template": "^2.0.8",
+                "uuid": "^3.3.2"
+            },
+            "engines": {
+                "node": ">=8.10.0"
+            }
+        },
+        "node_modules/googleapis-common/node_modules/qs": {
+            "version": "6.9.3",
+            "resolved": "https://registry.npmjs.org/qs/-/qs-6.9.3.tgz",
+            "integrity": "sha512-EbZYNarm6138UKKq46tdx08Yo/q9ZhFoAXAI1meAFd2GtbRDhbZY2WQSICskT0c5q99aFzLG1D4nvTk9tqfXIw==",
+            "engines": {
+                "node": ">=0.6"
+            }
+        },
+        "node_modules/googlephotos": {
+            "version": "0.2.5",
+            "resolved": "https://registry.npmjs.org/googlephotos/-/googlephotos-0.2.5.tgz",
+            "integrity": "sha512-XPmD3gu8aMVuwauKVzzahD2Vn8Cn8WtBRGgSF5J9A85Fn6N2GM0OToxWbEoTfyKahK+ryGHGcIYzDX98ndxE9g==",
+            "dependencies": {
+                "lodash.chunk": "^4.2.0",
+                "request": "^2.86.0",
+                "request-promise": "^4.2.2"
+            },
+            "engines": {
+                "node": ">=6.0.0"
+            }
+        },
+        "node_modules/got": {
+            "version": "6.7.1",
+            "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz",
+            "integrity": "sha1-JAzQV4WpoY5WHcG0S0HHY+8ejbA=",
+            "dependencies": {
+                "create-error-class": "^3.0.0",
+                "duplexer3": "^0.1.4",
+                "get-stream": "^3.0.0",
+                "is-redirect": "^1.0.0",
+                "is-retry-allowed": "^1.0.0",
+                "is-stream": "^1.0.0",
+                "lowercase-keys": "^1.0.0",
+                "safe-buffer": "^5.0.1",
+                "timed-out": "^4.0.0",
+                "unzip-response": "^2.0.1",
+                "url-parse-lax": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/graceful-fs": {
+            "version": "4.2.4",
+            "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.4.tgz",
+            "integrity": "sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw=="
+        },
+        "node_modules/growl": {
+            "version": "1.10.5",
+            "resolved": "https://registry.npmjs.org/growl/-/growl-1.10.5.tgz",
+            "integrity": "sha512-qBr4OuELkhPenW6goKVXiv47US3clb3/IbuWF9KNKEijAy9oeHxU9IgzjvJhHkUzhaj7rOUD7+YGWqUjLp5oSA==",
+            "engines": {
+                "node": ">=4.x"
+            }
+        },
+        "node_modules/growly": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
+            "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE=",
+            "dev": true
+        },
+        "node_modules/gtoken": {
+            "version": "3.0.2",
+            "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-3.0.2.tgz",
+            "integrity": "sha512-BOBi6Zz31JfxhSHRZBIDdbwIbOPyux10WxJHdx8wz/FMP1zyN1xFrsAWsgcLe5ww5v/OZu/MePUEZAjgJXSauA==",
+            "dependencies": {
+                "gaxios": "^2.0.0",
+                "google-p12-pem": "^2.0.0",
+                "jws": "^3.1.5",
+                "mime": "^2.2.0"
+            },
+            "engines": {
+                "node": ">=8.10.0"
+            }
+        },
+        "node_modules/gtoken/node_modules/mime": {
+            "version": "2.4.4",
+            "resolved": "https://registry.npmjs.org/mime/-/mime-2.4.4.tgz",
+            "integrity": "sha512-LRxmNwziLPT828z+4YkNzloCFC2YM4wrB99k+AV5ZbEyfGNWfG8SO1FUXLmLDBSo89NrJZ4DIWeLjy1CHGhMGA==",
+            "bin": {
+                "mime": "cli.js"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/gud": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/gud/-/gud-1.0.0.tgz",
+            "integrity": "sha512-zGEOVKFM5sVPPrYs7J5/hYEw2Pof8KCyOwyhG8sAF26mCAeUFAcYPu1mwB7hhpIP29zOIBaDqwuHdLp0jvZXjw=="
+        },
+        "node_modules/handle-thing": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-2.0.1.tgz",
+            "integrity": "sha512-9Qn4yBxelxoh2Ow62nP+Ka/kMnOXRi8BXnRaUwezLNhqelnN49xKz4F/dPP8OYLxLxq6JDtZb2i9XznUQbNPTg==",
+            "dev": true
+        },
+        "node_modules/har-schema": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-2.0.0.tgz",
+            "integrity": "sha1-qUwiJOvKwEeCoNkDVSHyRzW37JI=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/har-validator": {
+            "version": "5.1.3",
+            "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-5.1.3.tgz",
+            "integrity": "sha512-sNvOCzEQNr/qrvJgc3UG/kD4QtlHycrzwS+6mfTrrSq97BvaYcPZZI1ZSqGSPR73Cxn4LKTD4PttRwfU7jWq5g==",
+            "dependencies": {
+                "ajv": "^6.5.5",
+                "har-schema": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/has": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz",
+            "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==",
+            "dependencies": {
+                "function-bind": "^1.1.1"
+            },
+            "engines": {
+                "node": ">= 0.4.0"
+            }
+        },
+        "node_modules/has-ansi": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
+            "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
+            "dependencies": {
+                "ansi-regex": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/has-ansi/node_modules/ansi-regex": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+            "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/has-binary2": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/has-binary2/-/has-binary2-1.0.3.tgz",
+            "integrity": "sha512-G1LWKhDSvhGeAQ8mPVQlqNcOB2sJdwATtZKl2pDKKHfpf/rYj24lkinxf69blJbnsvtqqNU+L3SL50vzZhXOnw==",
+            "dependencies": {
+                "isarray": "2.0.1"
+            }
+        },
+        "node_modules/has-binary2/node_modules/isarray": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.1.tgz",
+            "integrity": "sha1-o32U7ZzaLVmGXJ92/llu4fM4dB4="
+        },
+        "node_modules/has-cors": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz",
+            "integrity": "sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk="
+        },
+        "node_modules/has-flag": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
+            "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/has-symbols": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.1.tgz",
+            "integrity": "sha512-PLcsoqu++dmEIZB+6totNFKq/7Do+Z0u4oT0zKOJNl3lYK6vGwwu2hjHs+68OEZbTjiUE9bgOABXbP/GvrS0Kg==",
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/has-unicode": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
+            "integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk="
+        },
+        "node_modules/has-value": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/has-value/-/has-value-1.0.0.tgz",
+            "integrity": "sha1-GLKB2lhbHFxR3vJMkw7SmgvmsXc=",
+            "dependencies": {
+                "get-value": "^2.0.6",
+                "has-values": "^1.0.0",
+                "isobject": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/has-values": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/has-values/-/has-values-1.0.0.tgz",
+            "integrity": "sha1-lbC2P+whRmGab+V/51Yo1aOe/k8=",
+            "dependencies": {
+                "is-number": "^3.0.0",
+                "kind-of": "^4.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/has-values/node_modules/is-buffer": {
+            "version": "1.1.6",
+            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
+            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
+        },
+        "node_modules/has-values/node_modules/kind-of": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
+            "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc=",
+            "dependencies": {
+                "is-buffer": "^1.1.5"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/hash-base": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-3.1.0.tgz",
+            "integrity": "sha512-1nmYp/rhMDiE7AYkDw+lLwlAzz0AntGIe51F3RfFfEqyQ3feY2eI/NcwC6umIQVOASPMsWJLJScWKSSvzL9IVA==",
+            "dev": true,
+            "dependencies": {
+                "inherits": "^2.0.4",
+                "readable-stream": "^3.6.0",
+                "safe-buffer": "^5.2.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/hash-base/node_modules/safe-buffer": {
+            "version": "5.2.1",
+            "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
+            "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
+            "dev": true
+        },
+        "node_modules/hash.js": {
+            "version": "1.1.7",
+            "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.1.7.tgz",
+            "integrity": "sha512-taOaskGt4z4SOANNseOviYDvjEJinIkRgmp7LbKP2YTTmVxWBl87s/uzK9r+44BclBSp2X7K1hqeNfz9JbBeXA==",
+            "dev": true,
+            "dependencies": {
+                "inherits": "^2.0.3",
+                "minimalistic-assert": "^1.0.1"
+            }
+        },
+        "node_modules/he": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz",
+            "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==",
+            "bin": {
+                "he": "bin/he"
+            }
+        },
+        "node_modules/hmac-drbg": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
+            "integrity": "sha1-0nRXAQJabHdabFRXk+1QL8DGSaE=",
+            "dev": true,
+            "dependencies": {
+                "hash.js": "^1.0.3",
+                "minimalistic-assert": "^1.0.0",
+                "minimalistic-crypto-utils": "^1.0.1"
+            }
+        },
+        "node_modules/hoist-non-react-statics": {
+            "version": "3.3.2",
+            "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
+            "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
+            "dependencies": {
+                "react-is": "^16.7.0"
+            }
+        },
+        "node_modules/homedir-polyfill": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.3.tgz",
+            "integrity": "sha512-eSmmWE5bZTK2Nou4g0AI3zZ9rswp7GRKoKXS1BLUkvPviOqs4YTN1djQIqrXy9k5gEtdLPy86JjRwsNM9tnDcA==",
+            "dev": true,
+            "dependencies": {
+                "parse-passwd": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/hosted-git-info": {
+            "version": "2.8.8",
+            "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.8.tgz",
+            "integrity": "sha512-f/wzC2QaWBs7t9IYqB4T3sR1xviIViXJRJTWBlx2Gf3g0Xi5vI7Yy4koXQ1c9OYDGHN9sBy1DQ2AB8fqZBWhUg=="
+        },
+        "node_modules/howler": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/howler/-/howler-2.2.0.tgz",
+            "integrity": "sha512-sGPkrAQy7jh5mNDbkRNG0F82R2HFDYNsQXBcX4smXQT0y0F4UMsa/+jXaGwWvcrajWr2tDB7JUkH7G5qSnuIyQ=="
+        },
+        "node_modules/hpack.js": {
+            "version": "2.1.6",
+            "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
+            "integrity": "sha1-h3dMCUnlE/QuhFdbPEVoH63ioLI=",
+            "dev": true,
+            "dependencies": {
+                "inherits": "^2.0.1",
+                "obuf": "^1.0.0",
+                "readable-stream": "^2.0.1",
+                "wbuf": "^1.1.0"
+            }
+        },
+        "node_modules/hpack.js/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dev": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/html": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/html/-/html-1.0.0.tgz",
+            "integrity": "sha1-pUT6nqVJK/s6LMqCEKEL57WvH2E=",
+            "dependencies": {
+                "concat-stream": "^1.4.7"
+            },
+            "bin": {
+                "html": "bin/html.js"
+            }
+        },
+        "node_modules/html-encoding-sniffer": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-1.0.2.tgz",
+            "integrity": "sha512-71lZziiDnsuabfdYiUeWdCVyKuqwWi23L8YeIgV9jSSZHCtb6wB1BKWooH7L3tn4/FuZJMVWyNaIDr4RGmaSYw==",
+            "dev": true,
+            "dependencies": {
+                "whatwg-encoding": "^1.0.1"
+            }
+        },
+        "node_modules/html-entities": {
+            "version": "1.3.1",
+            "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.3.1.tgz",
+            "integrity": "sha512-rhE/4Z3hIhzHAUKbW8jVcCyuT5oJCXXqhN/6mXXVCpzTmvJnoH2HL/bt3EZ6p55jbFJBeAe1ZNpL5BugLujxNA==",
+            "dev": true
+        },
+        "node_modules/html-to-image": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/html-to-image/-/html-to-image-0.1.1.tgz",
+            "integrity": "sha512-UAjpXmokENeOyzfLwL0+zQ502lXyg6pkzVUmRjtljOH9dR/YdEYQhWrQ/O14hmH5/1L7jv1aOupU4Zi3Y8+iow=="
+        },
+        "node_modules/html-to-text": {
+            "version": "5.1.1",
+            "resolved": "https://registry.npmjs.org/html-to-text/-/html-to-text-5.1.1.tgz",
+            "integrity": "sha512-Bci6bD/JIfZSvG4s0gW/9mMKwBRoe/1RWLxUME/d6WUSZCdY7T60bssf/jFf7EYXRyqU4P5xdClVqiYU0/ypdA==",
+            "dependencies": {
+                "he": "^1.2.0",
+                "htmlparser2": "^3.10.1",
+                "lodash": "^4.17.11",
+                "minimist": "^1.2.0"
+            },
+            "bin": {
+                "html-to-text": "bin/cli.js"
+            },
+            "engines": {
+                "node": ">= 4.0.0"
+            }
+        },
+        "node_modules/htmlparser2": {
+            "version": "3.10.1",
+            "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.10.1.tgz",
+            "integrity": "sha512-IgieNijUMbkDovyoKObU1DUhm1iwNYE/fuifEoEHfd1oZKZDaONBSkal7Y01shxsM49R4XaMdGez3WnF9UfiCQ==",
+            "dependencies": {
+                "domelementtype": "^1.3.1",
+                "domhandler": "^2.3.0",
+                "domutils": "^1.5.1",
+                "entities": "^1.1.1",
+                "inherits": "^2.0.1",
+                "readable-stream": "^3.1.1"
+            }
+        },
+        "node_modules/http-deceiver": {
+            "version": "1.2.7",
+            "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz",
+            "integrity": "sha1-+nFolEq5pRnTN8sL7HKE3D5yPYc=",
+            "dev": true
+        },
+        "node_modules/http-errors": {
+            "version": "1.7.2",
+            "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.7.2.tgz",
+            "integrity": "sha512-uUQBt3H/cSIVfch6i1EuPNy/YsRSOUBXTVfZ+yR7Zjez3qjBz6i9+i4zjNaoqcoFVI4lQJ5plg63TvGfRSDCRg==",
+            "dependencies": {
+                "depd": "~1.1.2",
+                "inherits": "2.0.3",
+                "setprototypeof": "1.1.1",
+                "statuses": ">= 1.5.0 < 2",
+                "toidentifier": "1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/http-errors/node_modules/inherits": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
+            "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
+        },
+        "node_modules/http-proxy": {
+            "version": "1.18.1",
+            "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.1.tgz",
+            "integrity": "sha512-7mz/721AbnJwIVbnaSv1Cz3Am0ZLT/UBwkC92VlxhXv/k/BBQfM2fXElQNC27BVGr0uwUpplYPQM9LnaBMR5NQ==",
+            "dev": true,
+            "dependencies": {
+                "eventemitter3": "^4.0.0",
+                "follow-redirects": "^1.0.0",
+                "requires-port": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=8.0.0"
+            }
+        },
+        "node_modules/http-proxy-middleware": {
+            "version": "0.19.1",
+            "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.19.1.tgz",
+            "integrity": "sha512-yHYTgWMQO8VvwNS22eLLloAkvungsKdKTLO8AJlftYIKNfJr3GK3zK0ZCfzDDGUBttdGc8xFy1mCitvNKQtC3Q==",
+            "dev": true,
+            "dependencies": {
+                "http-proxy": "^1.17.0",
+                "is-glob": "^4.0.0",
+                "lodash": "^4.17.11",
+                "micromatch": "^3.1.10"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/http-signature": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.2.0.tgz",
+            "integrity": "sha1-muzZJRFHcvPZW2WmCruPfBj7rOE=",
+            "dependencies": {
+                "assert-plus": "^1.0.0",
+                "jsprim": "^1.2.2",
+                "sshpk": "^1.7.0"
+            },
+            "engines": {
+                "node": ">=0.8",
+                "npm": ">=1.3.7"
+            }
+        },
+        "node_modules/https-browserify": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz",
+            "integrity": "sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM=",
+            "dev": true
+        },
+        "node_modules/https-proxy-agent": {
+            "version": "5.0.0",
+            "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-5.0.0.tgz",
+            "integrity": "sha512-EkYm5BcKUGiduxzSt3Eppko+PiNWNEpa4ySk9vTC6wDsQJW9rHSa+UhGNJoRYp7bz6Ht1eaRIa6QaJqO5rCFbA==",
+            "dependencies": {
+                "agent-base": "6",
+                "debug": "4"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/https-proxy-agent/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/hyphenate-style-name": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.3.tgz",
+            "integrity": "sha512-EcuixamT82oplpoJ2XU4pDtKGWQ7b00CD9f1ug9IaQ3p1bkHMiKCZ9ut9QDI6qsa6cpUuB+A/I+zLtdNK4n2DQ=="
+        },
+        "node_modules/i": {
+            "version": "0.3.6",
+            "resolved": "https://registry.npmjs.org/i/-/i-0.3.6.tgz",
+            "integrity": "sha1-2WyScyB28HJxG2sQ/X1PZa2O4j0=",
+            "engines": {
+                "node": ">=0.4"
+            }
+        },
+        "node_modules/iconv-lite": {
+            "version": "0.4.24",
+            "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
+            "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
+            "dependencies": {
+                "safer-buffer": ">= 2.1.2 < 3"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/icss-replace-symbols": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz",
+            "integrity": "sha1-Bupvg2ead0njhs/h/oEq5dsiPe0=",
+            "dev": true
+        },
+        "node_modules/icss-utils": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-4.1.1.tgz",
+            "integrity": "sha512-4aFq7wvWyMHKgxsH8QQtGpvbASCf+eM3wPRLI6R+MgAnTCZ6STYsRvttLvRWK0Nfif5piF394St3HeJDaljGPA==",
+            "dev": true,
+            "dependencies": {
+                "postcss": "^7.0.14"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/ieee754": {
+            "version": "1.1.13",
+            "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.13.tgz",
+            "integrity": "sha512-4vf7I2LYV/HaWerSo3XmlMkp5eZ83i+/CDluXi/IGTs/O1sejBNhTtnxzmRZfvOUqj7lZjqHkeTvpgSFDlWZTg=="
+        },
+        "node_modules/iferr": {
+            "version": "0.1.5",
+            "resolved": "https://registry.npmjs.org/iferr/-/iferr-0.1.5.tgz",
+            "integrity": "sha1-xg7taebY/bazEEofy8ocGS3FtQE=",
+            "dev": true
+        },
+        "node_modules/ignore": {
+            "version": "3.3.10",
+            "resolved": "https://registry.npmjs.org/ignore/-/ignore-3.3.10.tgz",
+            "integrity": "sha512-Pgs951kaMm5GXP7MOvxERINe3gsaVjUWFm+UZPSq9xYriQAksyhg0csnS0KXSNRD5NmNdapXEpjxG49+AKh/ug==",
+            "dev": true
+        },
+        "node_modules/ignore-by-default": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/ignore-by-default/-/ignore-by-default-1.0.1.tgz",
+            "integrity": "sha1-SMptcvbGo68Aqa1K5odr44ieKwk="
+        },
+        "node_modules/ignore-walk": {
+            "version": "3.0.3",
+            "resolved": "https://registry.npmjs.org/ignore-walk/-/ignore-walk-3.0.3.tgz",
+            "integrity": "sha512-m7o6xuOaT1aqheYHKf8W6J5pYH85ZI9w077erOzLje3JsB1gkafkAhHHY19dqjulgIZHFm32Cp5uNZgcQqdJKw==",
+            "dependencies": {
+                "minimatch": "^3.0.4"
+            }
+        },
+        "node_modules/image-data-uri": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/image-data-uri/-/image-data-uri-2.0.1.tgz",
+            "integrity": "sha512-BZh721F2Q5TwBdwpiqrBrHEdj8daj8KuMZK/DOCyqQlz1CqFhhuZWbK5ZCUnAvFJr8LaKHTaWl9ja3/a3DC2Ew==",
+            "dependencies": {
+                "fs-extra": "^0.26.7",
+                "magicli": "0.0.8",
+                "mime-types": "^2.1.18",
+                "request": "^2.88.0"
+            },
+            "bin": {
+                "image-data-uri": "bin/magicli.js"
+            }
+        },
+        "node_modules/image-size": {
+            "version": "0.7.5",
+            "resolved": "https://registry.npmjs.org/image-size/-/image-size-0.7.5.tgz",
+            "integrity": "sha512-Hiyv+mXHfFEP7LzUL/llg9RwFxxY+o9N3JVLIeG5E7iFIFAalxvRU9UZthBdYDEVnzHMgjnKJPPpay5BWf1g9g==",
+            "bin": {
+                "image-size": "bin/image-size.js"
+            },
+            "engines": {
+                "node": ">=6.9.0"
+            }
+        },
+        "node_modules/image-size-stream": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/image-size-stream/-/image-size-stream-1.1.0.tgz",
+            "integrity": "sha1-Ivou2mbG31AQh0bacUkmSy0l+Gs=",
+            "dependencies": {
+                "image-size": "github:netroy/image-size#da2c863807a3e9602617bdd357b0de3ab4a064c1",
+                "readable-stream": "^1.0.33",
+                "tryit": "^1.0.1"
+            }
+        },
+        "node_modules/image-size-stream/node_modules/image-size": {
+            "resolved": "git+ssh://git@github.com/netroy/image-size.git#da2c863807a3e9602617bdd357b0de3ab4a064c1",
+            "bin": {
+                "image-size": "bin/image-size"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/image-size-stream/node_modules/isarray": {
+            "version": "0.0.1",
+            "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+            "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+        },
+        "node_modules/image-size-stream/node_modules/readable-stream": {
+            "version": "1.1.14",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
+            "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.1",
+                "isarray": "0.0.1",
+                "string_decoder": "~0.10.x"
+            }
+        },
+        "node_modules/image-size-stream/node_modules/string_decoder": {
+            "version": "0.10.31",
+            "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+            "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
+        },
+        "node_modules/immediate": {
+            "version": "3.0.6",
+            "resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz",
+            "integrity": "sha1-nbHb0Pr43m++D13V5Wu2BigN5ps="
+        },
+        "node_modules/import-fresh": {
+            "version": "3.2.1",
+            "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.2.1.tgz",
+            "integrity": "sha512-6e1q1cnWP2RXD9/keSkxHScg508CdXqXWgWBaETNhyuBFz+kUZlKboh+ISK+bU++DmbHimVBrOz/zzPe0sZ3sQ==",
+            "dependencies": {
+                "parent-module": "^1.0.0",
+                "resolve-from": "^4.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/import-lazy": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/import-lazy/-/import-lazy-2.1.0.tgz",
+            "integrity": "sha1-BWmOPUXIjo1+nZLLBYTnfwlvPkM=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/import-local": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/import-local/-/import-local-2.0.0.tgz",
+            "integrity": "sha512-b6s04m3O+s3CGSbqDIyP4R6aAwAeYlVq9+WUWep6iHa8ETRf9yei1U48C5MmfJmV9AiLYYBKPMq/W+/WRpQmCQ==",
+            "dev": true,
+            "dependencies": {
+                "pkg-dir": "^3.0.0",
+                "resolve-cwd": "^2.0.0"
+            },
+            "bin": {
+                "import-local-fixture": "fixtures/cli.js"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/import-local/node_modules/pkg-dir": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-3.0.0.tgz",
+            "integrity": "sha512-/E57AYkoeQ25qkxMj5PBOVgF8Kiu/h7cYS30Z5+R7WaiCCBfLq58ZI/dSeaEKb9WVJV5n/03QwrN3IeWIFllvw==",
+            "dev": true,
+            "dependencies": {
+                "find-up": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/imurmurhash": {
+            "version": "0.1.4",
+            "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
+            "integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o=",
+            "engines": {
+                "node": ">=0.8.19"
+            }
+        },
+        "node_modules/in-publish": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.1.tgz",
+            "integrity": "sha512-oDM0kUSNFC31ShNxHKUyfZKy8ZeXZBWMjMdZHKLOk13uvT27VTL/QzRGfRUcevJhpkZAvlhPYuXkF7eNWrtyxQ==",
+            "bin": {
+                "in-install": "in-install.js",
+                "in-publish": "in-publish.js",
+                "not-in-install": "not-in-install.js",
+                "not-in-publish": "not-in-publish.js"
+            }
+        },
+        "node_modules/indent-string": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz",
+            "integrity": "sha1-ji1INIdCEhtKghi3oTfppSBJ3IA=",
+            "dependencies": {
+                "repeating": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/indexes-of": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz",
+            "integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc=",
+            "dev": true
+        },
+        "node_modules/indexof": {
+            "version": "0.0.1",
+            "resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz",
+            "integrity": "sha1-gtwzbSMrkGIXnQWrMpOmYFn9Q10="
+        },
+        "node_modules/infer-owner": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/infer-owner/-/infer-owner-1.0.4.tgz",
+            "integrity": "sha512-IClj+Xz94+d7irH5qRyfJonOdfTzuDaifE6ZPWfx0N0+/ATZCbuTPq2prFl526urkQd90WyUKIh1DfBQ2hMz9A==",
+            "dev": true
+        },
+        "node_modules/inflight": {
+            "version": "1.0.6",
+            "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
+            "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
+            "dependencies": {
+                "once": "^1.3.0",
+                "wrappy": "1"
+            }
+        },
+        "node_modules/infobox-parser": {
+            "version": "3.3.1",
+            "resolved": "https://registry.npmjs.org/infobox-parser/-/infobox-parser-3.3.1.tgz",
+            "integrity": "sha512-Aj1uF/taawGhet8cazhXz2uEDFMOqH8hnuw720wvi7Zw6bJWmA45Ta2FI9xMG5wvvo4CB6GR9S1/RUFtC6EtAg==",
+            "dependencies": {
+                "camelcase": "^4.1.0"
+            }
+        },
+        "node_modules/infobox-parser/node_modules/camelcase": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+            "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/inherits": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
+            "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
+        },
+        "node_modules/ini": {
+            "version": "1.3.5",
+            "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz",
+            "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/inline-style-prefixer": {
+            "version": "3.0.8",
+            "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.8.tgz",
+            "integrity": "sha1-hVG45bTVcyROZqNLBPfTIHaitTQ=",
+            "dependencies": {
+                "bowser": "^1.7.3",
+                "css-in-js-utils": "^2.0.0"
+            }
+        },
+        "node_modules/inspect-function": {
+            "version": "0.2.2",
+            "resolved": "https://registry.npmjs.org/inspect-function/-/inspect-function-0.2.2.tgz",
+            "integrity": "sha1-hdoMUli8TDMK4yg7Z0fgdZ2QpjU=",
+            "dependencies": {
+                "split-skip": "0.0.1",
+                "unpack-string": "0.0.2"
+            }
+        },
+        "node_modules/inspect-function/node_modules/split-skip": {
+            "version": "0.0.1",
+            "resolved": "https://registry.npmjs.org/split-skip/-/split-skip-0.0.1.tgz",
+            "integrity": "sha1-gK2ONumOV2RUzDtmfB3SXYZejwA="
+        },
+        "node_modules/inspect-parameters-declaration": {
+            "version": "0.0.9",
+            "resolved": "https://registry.npmjs.org/inspect-parameters-declaration/-/inspect-parameters-declaration-0.0.9.tgz",
+            "integrity": "sha512-c3jrKKA1rwwrsjdGMAo2hFWV0vNe3/RKHxpE/OBt41LP3ynOVI1qmgxpZYK5SQu3jtWCyaho8L7AZzCjJ4mEUw==",
+            "dependencies": {
+                "magicli": "0.0.5",
+                "split-skip": "0.0.2",
+                "stringify-parameters": "0.0.4",
+                "unpack-string": "0.0.2"
+            },
+            "bin": {
+                "inspect-parameters-declaration": "bin/cli.js"
+            }
+        },
+        "node_modules/inspect-parameters-declaration/node_modules/magicli": {
+            "version": "0.0.5",
+            "resolved": "https://registry.npmjs.org/magicli/-/magicli-0.0.5.tgz",
+            "integrity": "sha1-zufQ+7THBRiqyxHsPrfiX/SaSSE=",
+            "dependencies": {
+                "commander": "^2.9.0",
+                "get-stdin": "^5.0.1",
+                "inspect-function": "^0.2.1",
+                "pipe-functions": "^1.2.0"
+            }
+        },
+        "node_modules/inspect-property": {
+            "version": "0.0.6",
+            "resolved": "https://registry.npmjs.org/inspect-property/-/inspect-property-0.0.6.tgz",
+            "integrity": "sha512-LgjHkRl9W6bj2n+kWrAOgvCYPTYt+LanE4rtd/vKNq6yEb+SvVV7UTLzoSPpDX6/U1cAz7VfqPr+lPAIz7wHaQ==",
+            "dependencies": {
+                "for-each-property": "0.0.4",
+                "for-each-property-deep": "0.0.3",
+                "inspect-function": "^0.3.1"
+            }
+        },
+        "node_modules/inspect-property/node_modules/inspect-function": {
+            "version": "0.3.4",
+            "resolved": "https://registry.npmjs.org/inspect-function/-/inspect-function-0.3.4.tgz",
+            "integrity": "sha512-s0RsbJqK/sNZ+U1mykGoTickog3ea1A9Qk4mXniogOBu4PgkkZ56elScO7QC/r8D94lhGmJ2NyDI1ipOA/uq/g==",
+            "dependencies": {
+                "inspect-parameters-declaration": "0.0.8",
+                "magicli": "0.0.8",
+                "split-skip": "0.0.1",
+                "stringify-parameters": "0.0.4",
+                "unpack-string": "0.0.2"
+            },
+            "bin": {
+                "inspect-function": "bin/magicli.js"
+            }
+        },
+        "node_modules/inspect-property/node_modules/inspect-parameters-declaration": {
+            "version": "0.0.8",
+            "resolved": "https://registry.npmjs.org/inspect-parameters-declaration/-/inspect-parameters-declaration-0.0.8.tgz",
+            "integrity": "sha512-W4QzN1LgFmasKOM+NoLlDd2OAZM3enNZlVUOXoGQKmYBDFgxoPDOyebF55ALaf8avyM9TavNwibXxg347RrzCg==",
+            "dependencies": {
+                "magicli": "0.0.5",
+                "split-skip": "0.0.2",
+                "stringify-parameters": "0.0.4",
+                "unpack-string": "0.0.2"
+            },
+            "bin": {
+                "inspect-parameters-declaration": "bin/cli.js"
+            }
+        },
+        "node_modules/inspect-property/node_modules/inspect-parameters-declaration/node_modules/inspect-function": {
+            "version": "0.2.2",
+            "resolved": "https://registry.npmjs.org/inspect-function/-/inspect-function-0.2.2.tgz",
+            "integrity": "sha1-hdoMUli8TDMK4yg7Z0fgdZ2QpjU=",
+            "dependencies": {
+                "split-skip": "0.0.1",
+                "unpack-string": "0.0.2"
+            }
+        },
+        "node_modules/inspect-property/node_modules/inspect-parameters-declaration/node_modules/inspect-function/node_modules/split-skip": {
+            "version": "0.0.1",
+            "resolved": "https://registry.npmjs.org/split-skip/-/split-skip-0.0.1.tgz",
+            "integrity": "sha1-gK2ONumOV2RUzDtmfB3SXYZejwA="
+        },
+        "node_modules/inspect-property/node_modules/inspect-parameters-declaration/node_modules/magicli": {
+            "version": "0.0.5",
+            "resolved": "https://registry.npmjs.org/magicli/-/magicli-0.0.5.tgz",
+            "integrity": "sha1-zufQ+7THBRiqyxHsPrfiX/SaSSE=",
+            "dependencies": {
+                "commander": "^2.9.0",
+                "get-stdin": "^5.0.1",
+                "inspect-function": "^0.2.1",
+                "pipe-functions": "^1.2.0"
+            }
+        },
+        "node_modules/inspect-property/node_modules/inspect-parameters-declaration/node_modules/split-skip": {
+            "version": "0.0.2",
+            "resolved": "https://registry.npmjs.org/split-skip/-/split-skip-0.0.2.tgz",
+            "integrity": "sha1-2J2Iu9L3Pka1FYqjcKVhIk6A1GE="
+        },
+        "node_modules/inspect-property/node_modules/split-skip": {
+            "version": "0.0.1",
+            "resolved": "https://registry.npmjs.org/split-skip/-/split-skip-0.0.1.tgz",
+            "integrity": "sha1-gK2ONumOV2RUzDtmfB3SXYZejwA="
+        },
+        "node_modules/internal-ip": {
+            "version": "4.3.0",
+            "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-4.3.0.tgz",
+            "integrity": "sha512-S1zBo1D6zcsyuC6PMmY5+55YMILQ9av8lotMx447Bq6SAgo/sDK6y6uUKmuYhW7eacnIhFfsPmCNYdDzsnnDCg==",
+            "dev": true,
+            "dependencies": {
+                "default-gateway": "^4.2.0",
+                "ipaddr.js": "^1.9.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/internmap": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/internmap/-/internmap-1.0.0.tgz",
+            "integrity": "sha512-SdoDWwNOTE2n4JWUsLn4KXZGuZPjPF9yyOGc8bnfWnBQh7BD/l80rzSznKc/r4Y0aQ7z3RTk9X+tV4tHBpu+dA=="
+        },
+        "node_modules/interpret": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.2.0.tgz",
+            "integrity": "sha512-mT34yGKMNceBQUoVn7iCDKDntA7SC6gycMAWzGx1z/CMCTV7b2AAtXlo3nRyHZ1FelRkQbQjprHSYGwzLtkVbw==",
+            "engines": {
+                "node": ">= 0.10"
+            }
+        },
+        "node_modules/interval-arithmetic": {
+            "version": "1.0.6",
+            "resolved": "https://registry.npmjs.org/interval-arithmetic/-/interval-arithmetic-1.0.6.tgz",
+            "integrity": "sha512-eVotDGYPNiEaJ63oa4CeEHgOczZJ3gNHqG5wfVQ2o8sN2CEczQyR82Sjey/Bp36x8e7PtBcBvitcMnw6VUpjgQ==",
+            "dependencies": {
+                "@types/assert": "^1.4.6",
+                "is-safe-integer": "^2.0.0",
+                "nextafter": "^1.0.0",
+                "typedarray": "0.0.6"
+            }
+        },
+        "node_modules/interval-arithmetic-eval": {
+            "version": "0.4.7",
+            "resolved": "https://registry.npmjs.org/interval-arithmetic-eval/-/interval-arithmetic-eval-0.4.7.tgz",
+            "integrity": "sha512-ClK+N4efbsgjlZR8h0qd0LQbyzUzJ9IkrjmTnD5MVb4Ytebd0lesoVP4AxLclcsEI+nIieskQ8cepHIWUPaRhQ==",
+            "dependencies": {
+                "interval-arithmetic": "^1.0.6",
+                "math-codegen": "^0.3.5"
+            }
+        },
+        "node_modules/ip": {
+            "version": "1.1.5",
+            "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
+            "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo=",
+            "dev": true
+        },
+        "node_modules/ip-regex": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/ip-regex/-/ip-regex-2.1.0.tgz",
+            "integrity": "sha1-+ni/XS5pE8kRzp+BnuUUa7bYROk=",
+            "dev": true,
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/ipaddr.js": {
+            "version": "1.9.1",
+            "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz",
+            "integrity": "sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==",
+            "engines": {
+                "node": ">= 0.10"
+            }
+        },
+        "node_modules/is-absolute-url": {
+            "version": "3.0.3",
+            "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-3.0.3.tgz",
+            "integrity": "sha512-opmNIX7uFnS96NtPmhWQgQx6/NYFgsUXYMllcfzwWKUMwfo8kku1TvE6hkNcH+Q1ts5cMVrsY7j0bxXQDciu9Q==",
+            "dev": true,
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/is-accessor-descriptor": {
+            "version": "0.1.6",
+            "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+            "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
+            "dependencies": {
+                "kind-of": "^3.0.2"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-accessor-descriptor/node_modules/is-buffer": {
+            "version": "1.1.6",
+            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
+            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
+        },
+        "node_modules/is-accessor-descriptor/node_modules/kind-of": {
+            "version": "3.2.2",
+            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+            "dependencies": {
+                "is-buffer": "^1.1.5"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-arguments": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.0.4.tgz",
+            "integrity": "sha512-xPh0Rmt8NE65sNzvyUmWgI1tz3mKq74lGA0mL8LYZcoIzKOzDh6HmrYm3d18k60nHerC8A9Km8kYu87zfSFnLA==",
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/is-arrayish": {
+            "version": "0.2.1",
+            "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
+            "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0="
+        },
+        "node_modules/is-binary-path": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz",
+            "integrity": "sha1-dfFmQrSA8YenEcgUFh/TpKdlWJg=",
+            "dependencies": {
+                "binary-extensions": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-buffer": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.4.tgz",
+            "integrity": "sha512-Kq1rokWXOPXWuaMAqZiJW4XxsmD9zGx9q4aePabbn3qCRGedtH7Cm+zV8WETitMfu1wdh+Rvd6w5egwSngUX2A==",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/is-callable": {
+            "version": "1.1.5",
+            "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.5.tgz",
+            "integrity": "sha512-ESKv5sMCJB2jnHTWZ3O5itG+O128Hsus4K4Qh1h2/cgn2vbgnLSVqfV46AeJA9D5EeeLa9w81KUXMtn34zhX+Q==",
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/is-ci": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/is-ci/-/is-ci-1.2.1.tgz",
+            "integrity": "sha512-s6tfsaQaQi3JNciBH6shVqEDvhGut0SUXr31ag8Pd8BBbVVlcGfWhpPmEOoM6RJ5TFhbypvf5yyRw/VXW1IiWg==",
+            "dependencies": {
+                "ci-info": "^1.5.0"
+            },
+            "bin": {
+                "is-ci": "bin.js"
+            }
+        },
+        "node_modules/is-data-descriptor": {
+            "version": "0.1.4",
+            "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+            "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
+            "dependencies": {
+                "kind-of": "^3.0.2"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-data-descriptor/node_modules/is-buffer": {
+            "version": "1.1.6",
+            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
+            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
+        },
+        "node_modules/is-data-descriptor/node_modules/kind-of": {
+            "version": "3.2.2",
+            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+            "dependencies": {
+                "is-buffer": "^1.1.5"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-date-object": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.2.tgz",
+            "integrity": "sha512-USlDT524woQ08aoZFzh3/Z6ch9Y/EWXEHQ/AaRN0SkKq4t2Jw2R2339tSXmwuVoY7LLlBCbOIlx2myP/L5zk0g==",
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/is-descriptor": {
+            "version": "0.1.6",
+            "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
+            "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==",
+            "dependencies": {
+                "is-accessor-descriptor": "^0.1.6",
+                "is-data-descriptor": "^0.1.4",
+                "kind-of": "^5.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-descriptor/node_modules/kind-of": {
+            "version": "5.1.0",
+            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
+            "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-directory": {
+            "version": "0.3.1",
+            "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz",
+            "integrity": "sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-expression": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/is-expression/-/is-expression-3.0.0.tgz",
+            "integrity": "sha1-Oayqa+f9HzRx3ELHQW5hwkMXrJ8=",
+            "dependencies": {
+                "acorn": "~4.0.2",
+                "object-assign": "^4.0.1"
+            }
+        },
+        "node_modules/is-expression/node_modules/acorn": {
+            "version": "4.0.13",
+            "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
+            "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c=",
+            "bin": {
+                "acorn": "bin/acorn"
+            },
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/is-extendable": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-1.0.1.tgz",
+            "integrity": "sha512-arnXMxT1hhoKo9k1LZdmlNyJdDDfy2v0fXjFlmok4+i8ul/6WlbVge9bhM74OpNPQPMGUToDtz+KXa1PneJxOA==",
+            "dependencies": {
+                "is-plain-object": "^2.0.4"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-extglob": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+            "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-finite": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.1.0.tgz",
+            "integrity": "sha512-cdyMtqX/BOqqNBBiKlIVkytNHm49MtMlYyn1zxzvJKWmFMlGzm+ry5BBfYyeY9YmNKbRSo/o7OX9w9ale0wg3w==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-fullwidth-code-point": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+            "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/is-glob": {
+            "version": "4.0.1",
+            "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.1.tgz",
+            "integrity": "sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg==",
+            "dependencies": {
+                "is-extglob": "^2.1.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-in-browser": {
+            "version": "1.1.3",
+            "resolved": "https://registry.npmjs.org/is-in-browser/-/is-in-browser-1.1.3.tgz",
+            "integrity": "sha1-Vv9NtoOgeMYILrldrX3GLh0E+DU="
+        },
+        "node_modules/is-installed-globally": {
+            "version": "0.1.0",
+            "resolved": "https://registry.npmjs.org/is-installed-globally/-/is-installed-globally-0.1.0.tgz",
+            "integrity": "sha1-Df2Y9akRFxbdU13aZJL2e/PSWoA=",
+            "dependencies": {
+                "global-dirs": "^0.1.0",
+                "is-path-inside": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/is-npm": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/is-npm/-/is-npm-1.0.0.tgz",
+            "integrity": "sha1-8vtjpl5JBbQGyGBydloaTceTufQ=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-number": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
+            "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
+            "dependencies": {
+                "kind-of": "^3.0.2"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-number/node_modules/is-buffer": {
+            "version": "1.1.6",
+            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
+            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
+        },
+        "node_modules/is-number/node_modules/kind-of": {
+            "version": "3.2.2",
+            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+            "dependencies": {
+                "is-buffer": "^1.1.5"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-obj": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
+            "integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-path-cwd": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-2.2.0.tgz",
+            "integrity": "sha512-w942bTcih8fdJPJmQHFzkS76NEP8Kzzvmw92cXsazb8intwLqPibPPdXf4ANdKV3rYMuuQYGIWtvz9JilB3NFQ==",
+            "dev": true,
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/is-path-in-cwd": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-2.1.0.tgz",
+            "integrity": "sha512-rNocXHgipO+rvnP6dk3zI20RpOtrAM/kzbB258Uw5BWr3TpXi861yzjo16Dn4hUox07iw5AyeMLHWsujkjzvRQ==",
+            "dev": true,
+            "dependencies": {
+                "is-path-inside": "^2.1.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/is-path-in-cwd/node_modules/is-path-inside": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-2.1.0.tgz",
+            "integrity": "sha512-wiyhTzfDWsvwAW53OBWF5zuvaOGlZ6PwYxAbPVDhpm+gM09xKQGjBq/8uYN12aDvMxnAnq3dxTyoSoRNmg5YFg==",
+            "dev": true,
+            "dependencies": {
+                "path-is-inside": "^1.0.2"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/is-path-inside": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.1.tgz",
+            "integrity": "sha1-jvW33lBDej/cprToZe96pVy0gDY=",
+            "dependencies": {
+                "path-is-inside": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-plain-object": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
+            "integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==",
+            "dependencies": {
+                "isobject": "^3.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-promise": {
+            "version": "2.2.2",
+            "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-2.2.2.tgz",
+            "integrity": "sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ=="
+        },
+        "node_modules/is-redirect": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/is-redirect/-/is-redirect-1.0.0.tgz",
+            "integrity": "sha1-HQPd7VO9jbDzDCbk+V02/HyH3CQ=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-regex": {
+            "version": "1.0.5",
+            "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.5.tgz",
+            "integrity": "sha512-vlKW17SNq44owv5AQR3Cq0bQPEb8+kF3UKZ2fiZNOWtztYE5i0CzCZxFDwO58qAOWtxdBRVO/V5Qin1wjCqFYQ==",
+            "dependencies": {
+                "has": "^1.0.3"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/is-retry-allowed": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.2.0.tgz",
+            "integrity": "sha512-RUbUeKwvm3XG2VYamhJL1xFktgjvPzL0Hq8C+6yrWIswDy3BIXGqCxhxkc30N9jqK311gVU137K8Ei55/zVJRg==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-safe-integer": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/is-safe-integer/-/is-safe-integer-2.0.0.tgz",
+            "integrity": "sha512-eDaA39/1+3SNtYTRP28lRYOHMwiB1gfqXQaXcf/+f4mLwKgm8TTDkwJldsdtbgrK1R5CoDbf6AQ0KqP7BKoGtQ==",
+            "dependencies": {
+                "max-safe-integer": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-stream": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
+            "integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-symbol": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.3.tgz",
+            "integrity": "sha512-OwijhaRSgqvhm/0ZdAcXNZt9lYdKFpcRDT5ULUuYXPoT794UNOdU+gpT6Rzo7b4V2HUl/op6GqY894AZwv9faQ==",
+            "dependencies": {
+                "has-symbols": "^1.0.1"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/is-typedarray": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
+            "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo="
+        },
+        "node_modules/is-utf8": {
+            "version": "0.2.1",
+            "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
+            "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI="
+        },
+        "node_modules/is-what": {
+            "version": "3.10.0",
+            "resolved": "https://registry.npmjs.org/is-what/-/is-what-3.10.0.tgz",
+            "integrity": "sha512-U4RYCXNOmATQHlOPlOCHCfXyKEFIPqvyaKDqYRuLbD6EYKcTTfc3YXkAYjzOVxO3zt34L+Wh2feIyWrYiZ7kng=="
+        },
+        "node_modules/is-windows": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-1.0.2.tgz",
+            "integrity": "sha512-eXK1UInq2bPmjyX6e3VHIzMLobc4J94i4AWn+Hpq3OU5KkrRC96OAcR3PRJ/pGu6m8TRnBHP9dkXQVsT/COVIA==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/is-wsl": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-1.1.0.tgz",
+            "integrity": "sha1-HxbkqiKwTRM2tmGIpmrzxgDDpm0=",
+            "dev": true,
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/isarray": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+            "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+        },
+        "node_modules/isexe": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
+            "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA="
+        },
+        "node_modules/isobject": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
+            "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/isomorphic-fetch": {
+            "version": "2.2.1",
+            "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
+            "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=",
+            "dependencies": {
+                "node-fetch": "^1.0.1",
+                "whatwg-fetch": ">=0.10.0"
+            }
+        },
+        "node_modules/isstream": {
+            "version": "0.1.2",
+            "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
+            "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo="
+        },
+        "node_modules/its-set": {
+            "version": "1.2.3",
+            "resolved": "https://registry.npmjs.org/its-set/-/its-set-1.2.3.tgz",
+            "integrity": "sha512-UQc+xLLn+0a8KKRXRj3OS2kERK8G7zcayPpPULqZnPwuJ1hGWEO8+j0T5eycu7DKXYjezw3pyF8oV1fJkJxV5w==",
+            "dependencies": {
+                "babel-runtime": "6.x.x",
+                "lodash.get": "^4.4.2"
+            }
+        },
+        "node_modules/jquery": {
+            "version": "3.5.1",
+            "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.5.1.tgz",
+            "integrity": "sha512-XwIBPqcMn57FxfT+Go5pzySnm4KWkT1Tv7gjrpT1srtf8Weynl6R273VJ5GjkRb51IzMp5nbaPjJXMWeju2MKg=="
+        },
+        "node_modules/js-base64": {
+            "version": "2.5.2",
+            "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.5.2.tgz",
+            "integrity": "sha512-Vg8czh0Q7sFBSUMWWArX/miJeBWYBPpdU/3M/DKSaekLMqrqVPaedp+5mZhie/r0lgrcaYBfwXatEew6gwgiQQ=="
+        },
+        "node_modules/js-datepicker": {
+            "version": "4.6.6",
+            "resolved": "https://registry.npmjs.org/js-datepicker/-/js-datepicker-4.6.6.tgz",
+            "integrity": "sha512-kLsE2oHfQM6pzdWNA7Y8HwCHaZIVURItPds7YVJnbe1z1OmQFzN7lfg6yFbDDWOyNjdHZGzWDy3jSDN2W0pNZQ=="
+        },
+        "node_modules/js-stringify": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/js-stringify/-/js-stringify-1.0.2.tgz",
+            "integrity": "sha1-Fzb939lyTyijaCrcYjCufk6Weds="
+        },
+        "node_modules/js-tokens": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
+            "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
+        },
+        "node_modules/js-yaml": {
+            "version": "3.13.1",
+            "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.13.1.tgz",
+            "integrity": "sha512-YfbcO7jXDdyj0DGxYVSlSeQNHbD7XPWvrVWeVUujrQEoZzWJIRrCPoyk6kL6IAjAG2IolMK4T0hNUe0HOUs5Jw==",
+            "dependencies": {
+                "argparse": "^1.0.7",
+                "esprima": "^4.0.0"
+            },
+            "bin": {
+                "js-yaml": "bin/js-yaml.js"
+            }
+        },
+        "node_modules/jsbn": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
+            "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM="
+        },
+        "node_modules/jsdom": {
+            "version": "15.2.1",
+            "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-15.2.1.tgz",
+            "integrity": "sha512-fAl1W0/7T2G5vURSyxBzrJ1LSdQn6Tr5UX/xD4PXDx/PDgwygedfW6El/KIj3xJ7FU61TTYnc/l/B7P49Eqt6g==",
+            "dev": true,
+            "dependencies": {
+                "abab": "^2.0.0",
+                "acorn": "^7.1.0",
+                "acorn-globals": "^4.3.2",
+                "array-equal": "^1.0.0",
+                "cssom": "^0.4.1",
+                "cssstyle": "^2.0.0",
+                "data-urls": "^1.1.0",
+                "domexception": "^1.0.1",
+                "escodegen": "^1.11.1",
+                "html-encoding-sniffer": "^1.0.2",
+                "nwsapi": "^2.2.0",
+                "parse5": "5.1.0",
+                "pn": "^1.1.0",
+                "request": "^2.88.0",
+                "request-promise-native": "^1.0.7",
+                "saxes": "^3.1.9",
+                "symbol-tree": "^3.2.2",
+                "tough-cookie": "^3.0.1",
+                "w3c-hr-time": "^1.0.1",
+                "w3c-xmlserializer": "^1.1.2",
+                "webidl-conversions": "^4.0.2",
+                "whatwg-encoding": "^1.0.5",
+                "whatwg-mimetype": "^2.3.0",
+                "whatwg-url": "^7.0.0",
+                "ws": "^7.0.0",
+                "xml-name-validator": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/jsdom/node_modules/acorn": {
+            "version": "7.1.1",
+            "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.1.1.tgz",
+            "integrity": "sha512-add7dgA5ppRPxCFJoAGfMDi7PIBXq1RtGo7BhbLaxwrXPOmw8gq48Y9ozT01hUKy9byMjlR20EJhu5zlkErEkg==",
+            "dev": true,
+            "bin": {
+                "acorn": "bin/acorn"
+            },
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/jsdom/node_modules/acorn-globals": {
+            "version": "4.3.4",
+            "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-4.3.4.tgz",
+            "integrity": "sha512-clfQEh21R+D0leSbUdWf3OcfqyaCSAQ8Ryq00bofSekfr9W8u1jyYZo6ir0xu9Gtcf7BjcHJpnbZH7JOCpP60A==",
+            "dev": true,
+            "dependencies": {
+                "acorn": "^6.0.1",
+                "acorn-walk": "^6.0.1"
+            }
+        },
+        "node_modules/jsdom/node_modules/acorn-globals/node_modules/acorn": {
+            "version": "6.4.1",
+            "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.1.tgz",
+            "integrity": "sha512-ZVA9k326Nwrj3Cj9jlh3wGFutC2ZornPNARZwsNYqQYgN0EsV2d53w5RN/co65Ohn4sUAUtb1rSUAOD6XN9idA==",
+            "dev": true,
+            "bin": {
+                "acorn": "bin/acorn"
+            },
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/jsdom/node_modules/parse5": {
+            "version": "5.1.0",
+            "resolved": "https://registry.npmjs.org/parse5/-/parse5-5.1.0.tgz",
+            "integrity": "sha512-fxNG2sQjHvlVAYmzBZS9YlDp6PTSSDwa98vkD4QgVDDCAo84z5X1t5XyJQ62ImdLXx5NdIIfihey6xpum9/gRQ==",
+            "dev": true
+        },
+        "node_modules/jsdom/node_modules/tough-cookie": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-3.0.1.tgz",
+            "integrity": "sha512-yQyJ0u4pZsv9D4clxO69OEjLWYw+jbgspjTue4lTQZLfV0c5l1VmK2y1JK8E9ahdpltPOaAThPcp5nKPUgSnsg==",
+            "dev": true,
+            "dependencies": {
+                "ip-regex": "^2.1.0",
+                "psl": "^1.1.28",
+                "punycode": "^2.1.1"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/jsesc": {
+            "version": "2.5.2",
+            "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz",
+            "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==",
+            "bin": {
+                "jsesc": "bin/jsesc"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/json-bigint": {
+            "version": "0.3.0",
+            "resolved": "https://registry.npmjs.org/json-bigint/-/json-bigint-0.3.0.tgz",
+            "integrity": "sha1-DM2RLEuCcNBfBW+9E4FLU9OCWx4=",
+            "dependencies": {
+                "bignumber.js": "^7.0.0"
+            }
+        },
+        "node_modules/json-parse-better-errors": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz",
+            "integrity": "sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw=="
+        },
+        "node_modules/json-schema": {
+            "version": "0.2.3",
+            "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
+            "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM="
+        },
+        "node_modules/json-schema-traverse": {
+            "version": "0.4.1",
+            "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+            "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg=="
+        },
+        "node_modules/json-stringify-safe": {
+            "version": "5.0.1",
+            "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
+            "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus="
+        },
+        "node_modules/json3": {
+            "version": "3.3.3",
+            "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.3.tgz",
+            "integrity": "sha512-c7/8mbUsKigAbLkD5B010BK4D9LZm7A1pNItkEwiUZRpIN66exu/e7YQWysGun+TRKaJp8MhemM+VkfWv42aCA==",
+            "dev": true
+        },
+        "node_modules/jsondiffpatch": {
+            "version": "0.4.1",
+            "resolved": "https://registry.npmjs.org/jsondiffpatch/-/jsondiffpatch-0.4.1.tgz",
+            "integrity": "sha512-t0etAxTUk1w5MYdNOkZBZ8rvYYN5iL+2dHCCx/DpkFm/bW28M6y5nUS83D4XdZiHy35Fpaw6LBb+F88fHZnVCw==",
+            "dependencies": {
+                "chalk": "^2.3.0",
+                "diff-match-patch": "^1.0.0"
+            },
+            "bin": {
+                "jsondiffpatch": "bin/jsondiffpatch"
+            },
+            "engines": {
+                "node": ">=8.17.0"
+            }
+        },
+        "node_modules/jsonfile": {
+            "version": "2.4.0",
+            "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
+            "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=",
+            "dependencies": {
+                "graceful-fs": "^4.1.6"
+            }
+        },
+        "node_modules/jsonschema": {
+            "version": "1.2.6",
+            "resolved": "https://registry.npmjs.org/jsonschema/-/jsonschema-1.2.6.tgz",
+            "integrity": "sha512-SqhURKZG07JyKKeo/ir24QnS4/BV7a6gQy93bUSe4lUdNp0QNpIz2c9elWJQ9dpc5cQYY6cvCzgRwy0MQCLyqA==",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/jsprim": {
+            "version": "1.4.1",
+            "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
+            "integrity": "sha1-MT5mvB5cwG5Di8G3SZwuXFastqI=",
+            "engines": [
+                "node >=0.6.0"
+            ],
+            "dependencies": {
+                "assert-plus": "1.0.0",
+                "extsprintf": "1.3.0",
+                "json-schema": "0.2.3",
+                "verror": "1.10.0"
+            }
+        },
+        "node_modules/jss": {
+            "version": "10.3.0",
+            "resolved": "https://registry.npmjs.org/jss/-/jss-10.3.0.tgz",
+            "integrity": "sha512-B5sTRW9B6uHaUVzSo9YiMEOEp3UX8lWevU0Fsv+xtRnsShmgCfIYX44bTH8bPJe6LQKqEXku3ulKuHLbxBS97Q==",
+            "dependencies": {
+                "@babel/runtime": "^7.3.1",
+                "csstype": "^2.6.5",
+                "is-in-browser": "^1.1.3",
+                "tiny-warning": "^1.0.2"
+            }
+        },
+        "node_modules/jss-plugin-camel-case": {
+            "version": "10.3.0",
+            "resolved": "https://registry.npmjs.org/jss-plugin-camel-case/-/jss-plugin-camel-case-10.3.0.tgz",
+            "integrity": "sha512-tadWRi/SLWqLK3EUZEdDNJL71F3ST93Zrl9JYMjV0QDqKPAl0Liue81q7m/nFUpnSTXczbKDy4wq8rI8o7WFqA==",
+            "dependencies": {
+                "@babel/runtime": "^7.3.1",
+                "hyphenate-style-name": "^1.0.3",
+                "jss": "^10.3.0"
+            }
+        },
+        "node_modules/jss-plugin-default-unit": {
+            "version": "10.3.0",
+            "resolved": "https://registry.npmjs.org/jss-plugin-default-unit/-/jss-plugin-default-unit-10.3.0.tgz",
+            "integrity": "sha512-tT5KkIXAsZOSS9WDSe8m8lEHIjoEOj4Pr0WrG0WZZsMXZ1mVLFCSsD2jdWarQWDaRNyMj/I4d7czRRObhOxSuw==",
+            "dependencies": {
+                "@babel/runtime": "^7.3.1",
+                "jss": "^10.3.0"
+            }
+        },
+        "node_modules/jss-plugin-global": {
+            "version": "10.3.0",
+            "resolved": "https://registry.npmjs.org/jss-plugin-global/-/jss-plugin-global-10.3.0.tgz",
+            "integrity": "sha512-etYTG/y3qIR/vxZnKY+J3wXwObyBDNhBiB3l/EW9/pE3WHE//BZdK8LFvQcrCO48sZW1Z6paHo6klxUPP7WbzA==",
+            "dependencies": {
+                "@babel/runtime": "^7.3.1",
+                "jss": "^10.3.0"
+            }
+        },
+        "node_modules/jss-plugin-nested": {
+            "version": "10.3.0",
+            "resolved": "https://registry.npmjs.org/jss-plugin-nested/-/jss-plugin-nested-10.3.0.tgz",
+            "integrity": "sha512-qWiEkoXNEkkZ+FZrWmUGpf+zBsnEOmKXhkjNX85/ZfWhH9dfGxUCKuJFuOWFM+rjQfxV4csfesq4hY0jk8Qt0w==",
+            "dependencies": {
+                "@babel/runtime": "^7.3.1",
+                "jss": "^10.3.0",
+                "tiny-warning": "^1.0.2"
+            }
+        },
+        "node_modules/jss-plugin-props-sort": {
+            "version": "10.3.0",
+            "resolved": "https://registry.npmjs.org/jss-plugin-props-sort/-/jss-plugin-props-sort-10.3.0.tgz",
+            "integrity": "sha512-boetORqL/lfd7BWeFD3K+IyPqyIC+l3CRrdZr+NPq7Noqp+xyg/0MR7QisgzpxCEulk+j2CRcEUoZsvgPC4nTg==",
+            "dependencies": {
+                "@babel/runtime": "^7.3.1",
+                "jss": "^10.3.0"
+            }
+        },
+        "node_modules/jss-plugin-rule-value-function": {
+            "version": "10.3.0",
+            "resolved": "https://registry.npmjs.org/jss-plugin-rule-value-function/-/jss-plugin-rule-value-function-10.3.0.tgz",
+            "integrity": "sha512-7WiMrKIHH3rwxTuJki9+7nY11r1UXqaUZRhHvqTD4/ZE+SVhvtD5Tx21ivNxotwUSleucA/8boX+NF21oXzr5Q==",
+            "dependencies": {
+                "@babel/runtime": "^7.3.1",
+                "jss": "^10.3.0",
+                "tiny-warning": "^1.0.2"
+            }
+        },
+        "node_modules/jss-plugin-vendor-prefixer": {
+            "version": "10.3.0",
+            "resolved": "https://registry.npmjs.org/jss-plugin-vendor-prefixer/-/jss-plugin-vendor-prefixer-10.3.0.tgz",
+            "integrity": "sha512-sZQbrcZyP5V0ADjCLwUA1spVWoaZvM7XZ+2fSeieZFBj31cRsnV7X70FFDerMHeiHAXKWzYek+67nMDjhrZAVQ==",
+            "dependencies": {
+                "@babel/runtime": "^7.3.1",
+                "css-vendor": "^2.0.8",
+                "jss": "^10.3.0"
+            }
+        },
+        "node_modules/jstransformer": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/jstransformer/-/jstransformer-1.0.0.tgz",
+            "integrity": "sha1-7Yvwkh4vPx7U1cGkT2hwntJHIsM=",
+            "dependencies": {
+                "is-promise": "^2.0.0",
+                "promise": "^7.0.1"
+            }
+        },
+        "node_modules/jszip": {
+            "version": "3.5.0",
+            "resolved": "https://registry.npmjs.org/jszip/-/jszip-3.5.0.tgz",
+            "integrity": "sha512-WRtu7TPCmYePR1nazfrtuF216cIVon/3GWOvHS9QR5bIwSbnxtdpma6un3jyGGNhHsKCSzn5Ypk+EkDRvTGiFA==",
+            "dependencies": {
+                "lie": "~3.3.0",
+                "pako": "~1.0.2",
+                "readable-stream": "~2.3.6",
+                "set-immediate-shim": "~1.0.1"
+            }
+        },
+        "node_modules/jszip/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/jwa": {
+            "version": "1.4.1",
+            "resolved": "https://registry.npmjs.org/jwa/-/jwa-1.4.1.tgz",
+            "integrity": "sha512-qiLX/xhEEFKUAJ6FiBMbes3w9ATzyk5W7Hvzpa/SLYdxNtng+gcurvrI7TbACjIXlsJyr05/S1oUhZrc63evQA==",
+            "dependencies": {
+                "buffer-equal-constant-time": "1.0.1",
+                "ecdsa-sig-formatter": "1.0.11",
+                "safe-buffer": "^5.0.1"
+            }
+        },
+        "node_modules/jws": {
+            "version": "3.2.2",
+            "resolved": "https://registry.npmjs.org/jws/-/jws-3.2.2.tgz",
+            "integrity": "sha512-YHlZCB6lMTllWDtSPHz/ZXTsi8S00usEV6v1tjq8tOUZzw7DpSDWVXjXDre6ed1w/pd495ODpHZYSdkRTsa0HA==",
+            "dependencies": {
+                "jwa": "^1.4.1",
+                "safe-buffer": "^5.0.1"
+            }
+        },
+        "node_modules/kareem": {
+            "version": "2.3.1",
+            "resolved": "https://registry.npmjs.org/kareem/-/kareem-2.3.1.tgz",
+            "integrity": "sha512-l3hLhffs9zqoDe8zjmb/mAN4B8VT3L56EUvKNqLFVs9YlFA+zx7ke1DO8STAdDyYNkeSo1nKmjuvQeI12So8Xw=="
+        },
+        "node_modules/keycode": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.2.0.tgz",
+            "integrity": "sha1-PQr1bce4uOXLqNCpfxByBO7CKwQ="
+        },
+        "node_modules/keygrip": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/keygrip/-/keygrip-1.1.0.tgz",
+            "integrity": "sha512-iYSchDJ+liQ8iwbSI2QqsQOvqv58eJCEanyJPJi+Khyu8smkcKSFUCbPwzFcL7YVtZ6eONjqRX/38caJ7QjRAQ==",
+            "dependencies": {
+                "tsscmp": "1.0.6"
+            },
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/killable": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/killable/-/killable-1.0.1.tgz",
+            "integrity": "sha512-LzqtLKlUwirEUyl/nicirVmNiPvYs7l5n8wOPP7fyJVpUPkvCnW/vuiXGpylGUlnPDnB7311rARzAt3Mhswpjg==",
+            "dev": true
+        },
+        "node_modules/kind-of": {
+            "version": "6.0.3",
+            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz",
+            "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/klaw": {
+            "version": "1.3.1",
+            "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
+            "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk=",
+            "dependencies": {
+                "graceful-fs": "^4.1.9"
+            }
+        },
+        "node_modules/latest-version": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz",
+            "integrity": "sha1-ogU4P+oyKzO1rjsYq+4NwvNW7hU=",
+            "dependencies": {
+                "package-json": "^4.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/lazy-cache": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
+            "integrity": "sha1-odePw6UEdMuAhF07O24dpJpEbo4=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/lazystream": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/lazystream/-/lazystream-1.0.0.tgz",
+            "integrity": "sha1-9plf4PggOS9hOWvolGJAe7dxaOQ=",
+            "dependencies": {
+                "readable-stream": "^2.0.5"
+            },
+            "engines": {
+                "node": ">= 0.6.3"
+            }
+        },
+        "node_modules/lazystream/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/levn": {
+            "version": "0.3.0",
+            "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
+            "integrity": "sha1-OwmSTt+fCDwEkP3UwLxEIeBHZO4=",
+            "dev": true,
+            "dependencies": {
+                "prelude-ls": "~1.1.2",
+                "type-check": "~0.3.2"
+            },
+            "engines": {
+                "node": ">= 0.8.0"
+            }
+        },
+        "node_modules/libxmljs": {
+            "version": "0.19.7",
+            "resolved": "https://registry.npmjs.org/libxmljs/-/libxmljs-0.19.7.tgz",
+            "integrity": "sha512-lFJyG9T1mVwTzNTw6ZkvIt0O+NsIR+FTE+RcC2QDFGU8YMnQrnyEOGrj6HWSe1AdwQK7s37BOp4NL+pcAqfK2g==",
+            "hasInstallScript": true,
+            "dependencies": {
+                "bindings": "~1.3.0",
+                "nan": "~2.14.0",
+                "node-pre-gyp": "~0.11.0"
+            },
+            "engines": {
+                "node": ">=0.8.0"
+            }
+        },
+        "node_modules/libxmljs/node_modules/node-pre-gyp": {
+            "version": "0.11.0",
+            "resolved": "https://registry.npmjs.org/node-pre-gyp/-/node-pre-gyp-0.11.0.tgz",
+            "integrity": "sha512-TwWAOZb0j7e9eGaf9esRx3ZcLaE5tQ2lvYy1pb5IAaG1a2e2Kv5Lms1Y4hpj+ciXJRofIxxlt5haeQ/2ANeE0Q==",
+            "dependencies": {
+                "detect-libc": "^1.0.2",
+                "mkdirp": "^0.5.1",
+                "needle": "^2.2.1",
+                "nopt": "^4.0.1",
+                "npm-packlist": "^1.1.6",
+                "npmlog": "^4.0.2",
+                "rc": "^1.2.7",
+                "rimraf": "^2.6.1",
+                "semver": "^5.3.0",
+                "tar": "^4"
+            },
+            "bin": {
+                "node-pre-gyp": "bin/node-pre-gyp"
+            }
+        },
+        "node_modules/libxmljs/node_modules/rimraf": {
+            "version": "2.7.1",
+            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/lie": {
+            "version": "3.3.0",
+            "resolved": "https://registry.npmjs.org/lie/-/lie-3.3.0.tgz",
+            "integrity": "sha512-UaiMJzeWRlEujzAuw5LokY1L5ecNQYZKfmyZ9L7wDHb/p5etKaxXhohBcrw0EYby+G/NA52vRSN4N39dxHAIwQ==",
+            "dependencies": {
+                "immediate": "~3.0.5"
+            }
+        },
+        "node_modules/lines-and-columns": {
+            "version": "1.1.6",
+            "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.1.6.tgz",
+            "integrity": "sha1-HADHQ7QzzQpOgHWPe2SldEDZ/wA="
+        },
+        "node_modules/load-json-file": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
+            "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
+            "dependencies": {
+                "graceful-fs": "^4.1.2",
+                "parse-json": "^2.2.0",
+                "pify": "^2.0.0",
+                "pinkie-promise": "^2.0.0",
+                "strip-bom": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/load-json-file/node_modules/parse-json": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
+            "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck=",
+            "dependencies": {
+                "error-ex": "^1.2.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/load-json-file/node_modules/pify": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+            "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/loader-runner": {
+            "version": "2.4.0",
+            "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-2.4.0.tgz",
+            "integrity": "sha512-Jsmr89RcXGIwivFY21FcRrisYZfvLMTWx5kOLc+JTxtpBOG6xML0vzbc6SEQG2FO9/4Fc3wW4LVcB5DmGflaRw==",
+            "dev": true,
+            "engines": {
+                "node": ">=4.3.0 <5.0.0 || >=5.10"
+            }
+        },
+        "node_modules/loader-utils": {
+            "version": "1.4.0",
+            "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.4.0.tgz",
+            "integrity": "sha512-qH0WSMBtn/oHuwjy/NucEgbx5dbxxnxup9s4PVXJUDHZBQY+s0NWA9rJf53RBnQZxfch7euUui7hpoAPvALZdA==",
+            "dependencies": {
+                "big.js": "^5.2.2",
+                "emojis-list": "^3.0.0",
+                "json5": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/loader-utils/node_modules/json5": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.1.tgz",
+            "integrity": "sha512-aKS4WQjPenRxiQsC93MNfjx+nbF4PAdYzmd/1JIj8HYzqfbu86beTuNgXDzPknWk0n0uARlyewZo4s++ES36Ow==",
+            "dependencies": {
+                "minimist": "^1.2.0"
+            },
+            "bin": {
+                "json5": "lib/cli.js"
+            }
+        },
+        "node_modules/locate-path": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz",
+            "integrity": "sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A==",
+            "dependencies": {
+                "p-locate": "^3.0.0",
+                "path-exists": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/lodash": {
+            "version": "4.17.15",
+            "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.15.tgz",
+            "integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A=="
+        },
+        "node_modules/lodash._getnative": {
+            "version": "3.9.1",
+            "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
+            "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U="
+        },
+        "node_modules/lodash.chunk": {
+            "version": "4.2.0",
+            "resolved": "https://registry.npmjs.org/lodash.chunk/-/lodash.chunk-4.2.0.tgz",
+            "integrity": "sha1-ZuXOH3btJ7QwPYxlEujRIW6BBrw="
+        },
+        "node_modules/lodash.curry": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/lodash.curry/-/lodash.curry-4.1.1.tgz",
+            "integrity": "sha1-JI42By7ekGUB11lmIAqG2riyMXA="
+        },
+        "node_modules/lodash.debounce": {
+            "version": "3.1.1",
+            "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-3.1.1.tgz",
+            "integrity": "sha1-gSIRw3ipTMKdWqTjNGzwv846ffU=",
+            "dependencies": {
+                "lodash._getnative": "^3.0.0"
+            }
+        },
+        "node_modules/lodash.defaults": {
+            "version": "4.2.0",
+            "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
+            "integrity": "sha1-0JF4cW/+pN3p5ft7N/bwgCJ0WAw="
+        },
+        "node_modules/lodash.difference": {
+            "version": "4.5.0",
+            "resolved": "https://registry.npmjs.org/lodash.difference/-/lodash.difference-4.5.0.tgz",
+            "integrity": "sha1-nMtOUF1Ia5FlE0V3KIWi3yf9AXw="
+        },
+        "node_modules/lodash.flatten": {
+            "version": "4.4.0",
+            "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
+            "integrity": "sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8="
+        },
+        "node_modules/lodash.flow": {
+            "version": "3.5.0",
+            "resolved": "https://registry.npmjs.org/lodash.flow/-/lodash.flow-3.5.0.tgz",
+            "integrity": "sha1-h79AKSuM+D5OjOGjrkIJ4gBxZ1o="
+        },
+        "node_modules/lodash.get": {
+            "version": "4.4.2",
+            "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
+            "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
+        },
+        "node_modules/lodash.isequal": {
+            "version": "4.5.0",
+            "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
+            "integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA="
+        },
+        "node_modules/lodash.isplainobject": {
+            "version": "4.0.6",
+            "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
+            "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
+        },
+        "node_modules/lodash.memoize": {
+            "version": "4.1.2",
+            "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
+            "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4="
+        },
+        "node_modules/lodash.merge": {
+            "version": "4.6.2",
+            "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
+            "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ=="
+        },
+        "node_modules/lodash.padend": {
+            "version": "4.6.1",
+            "resolved": "https://registry.npmjs.org/lodash.padend/-/lodash.padend-4.6.1.tgz",
+            "integrity": "sha1-U8y6BH0G4VjTEfRdpiX05J5vFm4="
+        },
+        "node_modules/lodash.sortby": {
+            "version": "4.7.0",
+            "resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz",
+            "integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg=",
+            "dev": true
+        },
+        "node_modules/lodash.throttle": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz",
+            "integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ="
+        },
+        "node_modules/lodash.union": {
+            "version": "4.6.0",
+            "resolved": "https://registry.npmjs.org/lodash.union/-/lodash.union-4.6.0.tgz",
+            "integrity": "sha1-SLtQiECfFvGCFmZkHETdGqrjzYg="
+        },
+        "node_modules/log-symbols": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-2.2.0.tgz",
+            "integrity": "sha512-VeIAFslyIerEJLXHziedo2basKbMKtTw3vfn5IzG0XTjhAVEJyNHnL2p7vc+wBDSdQuUpNw3M2u6xb9QsAY5Eg==",
+            "dependencies": {
+                "chalk": "^2.0.1"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/loglevel": {
+            "version": "1.6.8",
+            "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.6.8.tgz",
+            "integrity": "sha512-bsU7+gc9AJ2SqpzxwU3+1fedl8zAntbtC5XYlt3s2j1hJcn2PsXSmgN8TaLG/J1/2mod4+cE/3vNL70/c1RNCA==",
+            "dev": true,
+            "engines": {
+                "node": ">= 0.6.0"
+            }
+        },
+        "node_modules/loglevelnext": {
+            "version": "1.0.5",
+            "resolved": "https://registry.npmjs.org/loglevelnext/-/loglevelnext-1.0.5.tgz",
+            "integrity": "sha512-V/73qkPuJmx4BcBF19xPBr+0ZRVBhc4POxvZTZdMeXpJ4NItXSJ/MSwuFT0kQJlCbXvdlZoQQ/418bS1y9Jh6A==",
+            "dev": true,
+            "dependencies": {
+                "es6-symbol": "^3.1.1",
+                "object.assign": "^4.1.0"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/longest": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/longest/-/longest-1.0.1.tgz",
+            "integrity": "sha1-MKCy2jj3N3DoKUoNIuZiXtd9AJc=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/loose-envify": {
+            "version": "1.4.0",
+            "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
+            "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
+            "dependencies": {
+                "js-tokens": "^3.0.0 || ^4.0.0"
+            },
+            "bin": {
+                "loose-envify": "cli.js"
+            }
+        },
+        "node_modules/loud-rejection": {
+            "version": "1.6.0",
+            "resolved": "https://registry.npmjs.org/loud-rejection/-/loud-rejection-1.6.0.tgz",
+            "integrity": "sha1-W0b4AUft7leIcPCG0Eghz5mOVR8=",
+            "dependencies": {
+                "currently-unhandled": "^0.4.1",
+                "signal-exit": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/lowercase-keys": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.1.tgz",
+            "integrity": "sha512-G2Lj61tXDnVFFOi8VZds+SoQjtQC3dgokKdDG2mTm1tx4m50NUHBOZSBwQQHyy0V12A0JTG4icfZQH+xPyh8VA==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/lru-cache": {
+            "version": "5.1.1",
+            "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
+            "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
+            "dependencies": {
+                "yallist": "^3.0.2"
+            }
+        },
+        "node_modules/magicli": {
+            "version": "0.0.8",
+            "resolved": "https://registry.npmjs.org/magicli/-/magicli-0.0.8.tgz",
+            "integrity": "sha512-x/eBenweAHF+DsYy172sK4doRxZl0yrJnfxhLJiN7H6hPM3Ya0PfI6uBZshZ3ScFFSQD7HXgBqMdbnXKEZsO1g==",
+            "dependencies": {
+                "cliss": "0.0.2",
+                "find-up": "^2.1.0",
+                "for-each-property": "0.0.4",
+                "inspect-property": "0.0.6"
+            }
+        },
+        "node_modules/magicli/node_modules/find-up": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
+            "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c=",
+            "dependencies": {
+                "locate-path": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/magicli/node_modules/locate-path": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",
+            "integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4=",
+            "dependencies": {
+                "p-locate": "^2.0.0",
+                "path-exists": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/magicli/node_modules/p-limit": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.3.0.tgz",
+            "integrity": "sha512-vvcXsLAJ9Dr5rQOPk7toZQZJApBl2K4J6dANSsEuh6QI41JYcsS/qhTGa9ErIUUgK3WNQoJYvylxvjqmiqEA9Q==",
+            "dependencies": {
+                "p-try": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/magicli/node_modules/p-locate": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-2.0.0.tgz",
+            "integrity": "sha1-IKAQOyIqcMj9OcwuWAaA893l7EM=",
+            "dependencies": {
+                "p-limit": "^1.1.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/magicli/node_modules/p-try": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/p-try/-/p-try-1.0.0.tgz",
+            "integrity": "sha1-y8ec26+P1CKOE/Yh8rGiN8GyB7M=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/make-dir": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.3.0.tgz",
+            "integrity": "sha512-2w31R7SJtieJJnQtGc7RVL2StM2vGYVfqUOvUDxH6bC6aJTxPxTF0GnIgCyu7tjockiUWAYQRbxa7vKn34s5sQ==",
+            "dependencies": {
+                "pify": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/make-dir/node_modules/pify": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
+            "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/make-error": {
+            "version": "1.3.6",
+            "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
+            "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==",
+            "dev": true
+        },
+        "node_modules/map-cache": {
+            "version": "0.2.2",
+            "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
+            "integrity": "sha1-wyq9C9ZSXZsFFkW7TyasXcmKDb8=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/map-obj": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz",
+            "integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/map-visit": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/map-visit/-/map-visit-1.0.0.tgz",
+            "integrity": "sha1-7Nyo8TFE5mDxtb1B8S80edmN+48=",
+            "dependencies": {
+                "object-visit": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/material-colors": {
+            "version": "1.2.6",
+            "resolved": "https://registry.npmjs.org/material-colors/-/material-colors-1.2.6.tgz",
+            "integrity": "sha512-6qE4B9deFBIa9YSpOc9O0Sgc43zTeVYbgDT5veRKSlB2+ZuHNoVVxA1L/ckMUayV9Ay9y7Z/SZCLcGteW9i7bg=="
+        },
+        "node_modules/material-ui": {
+            "version": "0.20.2",
+            "resolved": "https://registry.npmjs.org/material-ui/-/material-ui-0.20.2.tgz",
+            "integrity": "sha512-VeqgQkdvtK193w+FFvXDEwlVxI4rWk83eWbpYLeOIHDPWr3rbB9B075JRnJt/8IsI2X8q5Aia5W3+7m4KkleDg==",
+            "dependencies": {
+                "babel-runtime": "^6.23.0",
+                "inline-style-prefixer": "^3.0.8",
+                "keycode": "^2.1.8",
+                "lodash.merge": "^4.6.0",
+                "lodash.throttle": "^4.1.1",
+                "prop-types": "^15.5.7",
+                "react-event-listener": "^0.6.2",
+                "react-transition-group": "^1.2.1",
+                "recompose": "^0.26.0",
+                "simple-assign": "^0.1.0",
+                "warning": "^3.0.0"
+            }
+        },
+        "node_modules/material-ui/node_modules/react-transition-group": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-1.2.1.tgz",
+            "integrity": "sha512-CWaL3laCmgAFdxdKbhhps+c0HRGF4c+hdM4H23+FI1QBNUyx/AMeIJGWorehPNSaKnQNOAxL7PQmqMu78CDj3Q==",
+            "dependencies": {
+                "chain-function": "^1.0.0",
+                "dom-helpers": "^3.2.0",
+                "loose-envify": "^1.3.1",
+                "prop-types": "^15.5.6",
+                "warning": "^3.0.0"
+            }
+        },
+        "node_modules/math-codegen": {
+            "version": "0.3.5",
+            "resolved": "https://registry.npmjs.org/math-codegen/-/math-codegen-0.3.5.tgz",
+            "integrity": "sha1-R5nuRnfe0Ud2bQA8ykt4ee3UDMo=",
+            "dependencies": {
+                "extend": "^3.0.0",
+                "mr-parser": "^0.2.1"
+            }
+        },
+        "node_modules/mathquill": {
+            "version": "0.10.1-a",
+            "resolved": "https://registry.npmjs.org/mathquill/-/mathquill-0.10.1-a.tgz",
+            "integrity": "sha1-vyylaQEAY6w0vNXVKa3Ag3zVPD8=",
+            "dependencies": {
+                "jquery": "^1.12.3"
+            }
+        },
+        "node_modules/mathquill/node_modules/jquery": {
+            "version": "1.12.4",
+            "resolved": "https://registry.npmjs.org/jquery/-/jquery-1.12.4.tgz",
+            "integrity": "sha1-AeHfuikP5z3rp3zurLD5ui/sngw="
+        },
+        "node_modules/max-safe-integer": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/max-safe-integer/-/max-safe-integer-1.0.1.tgz",
+            "integrity": "sha1-84BgvixWPYwC5tSK85Ei/YO29BA=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/md5.js": {
+            "version": "1.3.5",
+            "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
+            "integrity": "sha512-xitP+WxNPcTTOgnTJcrhM0xvdPepipPSf3I8EIpGKeFLjt3PlJLIDG3u8EX53ZIubkb+5U2+3rELYpEhHhzdkg==",
+            "dev": true,
+            "dependencies": {
+                "hash-base": "^3.0.0",
+                "inherits": "^2.0.1",
+                "safe-buffer": "^5.1.2"
+            }
+        },
+        "node_modules/media-typer": {
+            "version": "0.3.0",
+            "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
+            "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g=",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/memoize-one": {
+            "version": "5.1.1",
+            "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-5.1.1.tgz",
+            "integrity": "sha512-HKeeBpWvqiVJD57ZUAsJNm71eHTykffzcLZVYWiVfQeI1rJtuEaS7hQiEpWfVVk18donPwJEcFKIkCmPJNOhHA=="
+        },
+        "node_modules/memory-fs": {
+            "version": "0.5.0",
+            "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.5.0.tgz",
+            "integrity": "sha512-jA0rdU5KoQMC0e6ppoNRtpp6vjFq6+NY7r8hywnC7V+1Xj/MtHwGIbB1QaK/dunyjWteJzmkpd7ooeWg10T7GA==",
+            "dev": true,
+            "dependencies": {
+                "errno": "^0.1.3",
+                "readable-stream": "^2.0.1"
+            },
+            "engines": {
+                "node": ">=4.3.0 <5.0.0 || >=5.10"
+            }
+        },
+        "node_modules/memory-fs/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dev": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/memory-pager": {
+            "version": "1.5.0",
+            "resolved": "https://registry.npmjs.org/memory-pager/-/memory-pager-1.5.0.tgz",
+            "integrity": "sha512-ZS4Bp4r/Zoeq6+NLJpP+0Zzm0pR8whtGPf1XExKLJBAczGMnSi3It14OiNCStjQjM6NU1okjQGSxgEZN8eBYKg==",
+            "optional": true
+        },
+        "node_modules/meow": {
+            "version": "3.7.0",
+            "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz",
+            "integrity": "sha1-cstmi0JSKCkKu/qFaJJYcwioAfs=",
+            "dependencies": {
+                "camelcase-keys": "^2.0.0",
+                "decamelize": "^1.1.2",
+                "loud-rejection": "^1.0.0",
+                "map-obj": "^1.0.1",
+                "minimist": "^1.1.3",
+                "normalize-package-data": "^2.3.4",
+                "object-assign": "^4.0.1",
+                "read-pkg-up": "^1.0.1",
+                "redent": "^1.0.0",
+                "trim-newlines": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/merge-anything": {
+            "version": "2.4.4",
+            "resolved": "https://registry.npmjs.org/merge-anything/-/merge-anything-2.4.4.tgz",
+            "integrity": "sha512-l5XlriUDJKQT12bH+rVhAHjwIuXWdAIecGwsYjv2LJo+dA1AeRTmeQS+3QBpO6lEthBMDi2IUMpLC1yyRvGlwQ==",
+            "dependencies": {
+                "is-what": "^3.3.1"
+            }
+        },
+        "node_modules/merge-descriptors": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz",
+            "integrity": "sha1-sAqqVW3YtEVoFQ7J0blT8/kMu2E="
+        },
+        "node_modules/methods": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
+            "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4=",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/microevent.ts": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/microevent.ts/-/microevent.ts-0.1.1.tgz",
+            "integrity": "sha512-jo1OfR4TaEwd5HOrt5+tAZ9mqT4jmpNAusXtyfNzqVm9uiSYFZlKM1wYL4oU7azZW/PxQW53wM0S6OR1JHNa2g==",
+            "dev": true
+        },
+        "node_modules/micromatch": {
+            "version": "3.1.10",
+            "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.10.tgz",
+            "integrity": "sha512-MWikgl9n9M3w+bpsY3He8L+w9eF9338xRl8IAO5viDizwSzziFEyUzo2xrrloB64ADbTf8uA8vRqqttDTOmccg==",
+            "dependencies": {
+                "arr-diff": "^4.0.0",
+                "array-unique": "^0.3.2",
+                "braces": "^2.3.1",
+                "define-property": "^2.0.2",
+                "extend-shallow": "^3.0.2",
+                "extglob": "^2.0.4",
+                "fragment-cache": "^0.2.1",
+                "kind-of": "^6.0.2",
+                "nanomatch": "^1.2.9",
+                "object.pick": "^1.3.0",
+                "regex-not": "^1.0.0",
+                "snapdragon": "^0.8.1",
+                "to-regex": "^3.0.2"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/miller-rabin": {
+            "version": "4.0.1",
+            "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.1.tgz",
+            "integrity": "sha512-115fLhvZVqWwHPbClyntxEVfVDfl9DLLTuJvq3g2O/Oxi8AiNouAHvDSzHS0viUJc+V5vm3eq91Xwqn9dp4jRA==",
+            "dev": true,
+            "dependencies": {
+                "bn.js": "^4.0.0",
+                "brorand": "^1.0.1"
+            },
+            "bin": {
+                "miller-rabin": "bin/miller-rabin"
+            }
+        },
+        "node_modules/miller-rabin/node_modules/bn.js": {
+            "version": "4.12.0",
+            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
+            "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==",
+            "dev": true
+        },
+        "node_modules/mime": {
+            "version": "1.6.0",
+            "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
+            "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
+            "bin": {
+                "mime": "cli.js"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/mime-db": {
+            "version": "1.44.0",
+            "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.44.0.tgz",
+            "integrity": "sha512-/NOTfLrsPBVeH7YtFPgsVWveuL+4SjjYxaQ1xtM1KMFj7HdxlBlxeyNLzhyJVx7r4rZGJAZ/6lkKCitSc/Nmpg==",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/mime-types": {
+            "version": "2.1.27",
+            "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.27.tgz",
+            "integrity": "sha512-JIhqnCasI9yD+SsmkquHBxTSEuZdQX5BuQnS2Vc7puQQQ+8yiP5AY5uWhpdv4YL4VM5c6iliiYWPgJ/nJQLp7w==",
+            "dependencies": {
+                "mime-db": "1.44.0"
+            },
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/mimic-response": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-2.1.0.tgz",
+            "integrity": "sha512-wXqjST+SLt7R009ySCglWBCFpjUygmCIfD790/kVbiGmUgfYGuB14PiTd5DwVxSV4NcYHjzMkoj5LjQZwTQLEA==",
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/minimalistic-assert": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",
+            "integrity": "sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A==",
+            "dev": true
+        },
+        "node_modules/minimalistic-crypto-utils": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz",
+            "integrity": "sha1-9sAMHAsIIkblxNmd+4x8CDsrWCo=",
+            "dev": true
+        },
+        "node_modules/minimatch": {
+            "version": "3.0.4",
+            "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
+            "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
+            "dependencies": {
+                "brace-expansion": "^1.1.7"
+            },
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/minimist": {
+            "version": "1.2.5",
+            "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz",
+            "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw=="
+        },
+        "node_modules/minipass": {
+            "version": "2.9.0",
+            "resolved": "https://registry.npmjs.org/minipass/-/minipass-2.9.0.tgz",
+            "integrity": "sha512-wxfUjg9WebH+CUDX/CdbRlh5SmfZiy/hpkxaRI16Y9W56Pa75sWgd/rvFilSgrauD9NyFymP/+JFV3KwzIsJeg==",
+            "dependencies": {
+                "safe-buffer": "^5.1.2",
+                "yallist": "^3.0.0"
+            }
+        },
+        "node_modules/minizlib": {
+            "version": "1.3.3",
+            "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-1.3.3.tgz",
+            "integrity": "sha512-6ZYMOEnmVsdCeTJVE0W9ZD+pVnE8h9Hma/iOwwRDsdQoePpoX56/8B6z3P9VNwppJuBKNRuFDRNRqRWexT9G9Q==",
+            "dependencies": {
+                "minipass": "^2.9.0"
+            }
+        },
+        "node_modules/mississippi": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/mississippi/-/mississippi-2.0.0.tgz",
+            "integrity": "sha512-zHo8v+otD1J10j/tC+VNoGK9keCuByhKovAvdn74dmxJl9+mWHnx6EMsDN4lgRoMI/eYo2nchAxniIbUPb5onw==",
+            "dev": true,
+            "dependencies": {
+                "concat-stream": "^1.5.0",
+                "duplexify": "^3.4.2",
+                "end-of-stream": "^1.1.0",
+                "flush-write-stream": "^1.0.0",
+                "from2": "^2.1.0",
+                "parallel-transform": "^1.1.0",
+                "pump": "^2.0.1",
+                "pumpify": "^1.3.3",
+                "stream-each": "^1.1.0",
+                "through2": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/mississippi/node_modules/pump": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/pump/-/pump-2.0.1.tgz",
+            "integrity": "sha512-ruPMNRkN3MHP1cWJc9OWr+T/xDP0jhXYCLfJcBuX54hhfIBnaQmAUMfDcG4DM5UMWByBbJY69QSphm3jtDKIkA==",
+            "dev": true,
+            "dependencies": {
+                "end-of-stream": "^1.1.0",
+                "once": "^1.3.1"
+            }
+        },
+        "node_modules/mixin-deep": {
+            "version": "1.3.2",
+            "resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.3.2.tgz",
+            "integrity": "sha512-WRoDn//mXBiJ1H40rqa3vH0toePwSsGb45iInWlTySa+Uu4k3tYUSxa2v1KqAiLtvlrSzaExqS1gtk96A9zvEA==",
+            "dependencies": {
+                "for-in": "^1.0.2",
+                "is-extendable": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/mkdirp": {
+            "version": "0.5.4",
+            "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.4.tgz",
+            "integrity": "sha512-iG9AK/dJLtJ0XNgTuDbSyNS3zECqDlAhnQW4CsNxBG3LQJBbHmRX1egw39DmtOdCAqY+dKXV+sgPgilNWUKMVw==",
+            "dependencies": {
+                "minimist": "^1.2.5"
+            },
+            "bin": {
+                "mkdirp": "bin/cmd.js"
+            }
+        },
+        "node_modules/mkdirp-classic": {
+            "version": "0.5.2",
+            "resolved": "https://registry.npmjs.org/mkdirp-classic/-/mkdirp-classic-0.5.2.tgz",
+            "integrity": "sha512-ejdnDQcR75gwknmMw/tx02AuRs8jCtqFoFqDZMjiNxsu85sRIJVXDKHuLYvUUPRBUtV2FpSZa9bL1BUa3BdR2g=="
+        },
+        "node_modules/mobile-detect": {
+            "version": "1.4.4",
+            "resolved": "https://registry.npmjs.org/mobile-detect/-/mobile-detect-1.4.4.tgz",
+            "integrity": "sha512-vTgEjKjS89C5yHL5qWPpT6BzKuOVqABp+A3Szpbx34pIy3sngxlGaFpgHhfj6fKze1w0QKeOSDbU7SKu7wDvRQ=="
+        },
+        "node_modules/mobx": {
+            "version": "5.15.7",
+            "resolved": "https://registry.npmjs.org/mobx/-/mobx-5.15.7.tgz",
+            "integrity": "sha512-wyM3FghTkhmC+hQjyPGGFdpehrcX1KOXsDuERhfK2YbJemkUhEB+6wzEN639T21onxlfYBmriA1PFnvxTUhcKw=="
+        },
+        "node_modules/mobx-react": {
+            "version": "5.4.4",
+            "resolved": "https://registry.npmjs.org/mobx-react/-/mobx-react-5.4.4.tgz",
+            "integrity": "sha512-2mTzpyEjVB/RGk2i6KbcmP4HWcAUFox5ZRCrGvSyz49w20I4C4qql63grPpYrS9E9GKwgydBHQlA4y665LuRCQ==",
+            "dependencies": {
+                "hoist-non-react-statics": "^3.0.0",
+                "react-lifecycles-compat": "^3.0.2"
+            }
+        },
+        "node_modules/mobx-react-devtools": {
+            "version": "6.1.1",
+            "resolved": "https://registry.npmjs.org/mobx-react-devtools/-/mobx-react-devtools-6.1.1.tgz",
+            "integrity": "sha512-nc5IXLdEUFLn3wZal65KF3/JFEFd+mbH4KTz/IG5BOPyw7jo8z29w/8qm7+wiCyqVfUIgJ1gL4+HVKmcXIOgqA=="
+        },
+        "node_modules/mobx-utils": {
+            "version": "5.6.1",
+            "resolved": "https://registry.npmjs.org/mobx-utils/-/mobx-utils-5.6.1.tgz",
+            "integrity": "sha512-bpTJzM8MXniGnXCZY+ImjPDqBKQ3+G3g/QFSPtNkH6HM3x14DAPqKH7No7NDyhbXBMv3FaVetsgnoEPozbi45Q=="
+        },
+        "node_modules/mocha": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/mocha/-/mocha-5.2.0.tgz",
+            "integrity": "sha512-2IUgKDhc3J7Uug+FxMXuqIyYzH7gJjXECKe/w43IGgQHTSj3InJi+yAA7T24L9bQMRKiUEHxEX37G5JpVUGLcQ==",
+            "dev": true,
+            "dependencies": {
+                "browser-stdout": "1.3.1",
+                "commander": "2.15.1",
+                "debug": "3.1.0",
+                "diff": "3.5.0",
+                "escape-string-regexp": "1.0.5",
+                "glob": "7.1.2",
+                "growl": "1.10.5",
+                "he": "1.1.1",
+                "minimatch": "3.0.4",
+                "mkdirp": "0.5.1",
+                "supports-color": "5.4.0"
+            },
+            "bin": {
+                "_mocha": "bin/_mocha",
+                "mocha": "bin/mocha"
+            },
+            "engines": {
+                "node": ">= 4.0.0"
+            }
+        },
+        "node_modules/mocha/node_modules/commander": {
+            "version": "2.15.1",
+            "resolved": "https://registry.npmjs.org/commander/-/commander-2.15.1.tgz",
+            "integrity": "sha512-VlfT9F3V0v+jr4yxPc5gg9s62/fIVWsd2Bk2iD435um1NlGMYdVCq+MjcXnhYq2icNOizHr1kK+5TI6H0Hy0ag==",
+            "dev": true
+        },
+        "node_modules/mocha/node_modules/debug": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+            "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+            "dev": true,
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/mocha/node_modules/glob": {
+            "version": "7.1.2",
+            "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
+            "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
+            "dev": true,
+            "dependencies": {
+                "fs.realpath": "^1.0.0",
+                "inflight": "^1.0.4",
+                "inherits": "2",
+                "minimatch": "^3.0.4",
+                "once": "^1.3.0",
+                "path-is-absolute": "^1.0.0"
+            },
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/mocha/node_modules/he": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz",
+            "integrity": "sha1-k0EP0hsAlzUVH4howvJx80J+I/0=",
+            "dev": true,
+            "bin": {
+                "he": "bin/he"
+            }
+        },
+        "node_modules/mocha/node_modules/minimist": {
+            "version": "0.0.8",
+            "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
+            "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=",
+            "dev": true
+        },
+        "node_modules/mocha/node_modules/mkdirp": {
+            "version": "0.5.1",
+            "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
+            "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
+            "dev": true,
+            "dependencies": {
+                "minimist": "0.0.8"
+            },
+            "bin": {
+                "mkdirp": "bin/cmd.js"
+            }
+        },
+        "node_modules/mocha/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
+            "dev": true
+        },
+        "node_modules/mocha/node_modules/supports-color": {
+            "version": "5.4.0",
+            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.4.0.tgz",
+            "integrity": "sha512-zjaXglF5nnWpsq470jSv6P9DwPvgLkuapYmfDm3JWOm0vkNTVF2tI4UrN2r6jH1qM/uc/WtxYY1hYoA2dOKj5w==",
+            "dev": true,
+            "dependencies": {
+                "has-flag": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/mongodb": {
+            "version": "3.5.9",
+            "resolved": "https://registry.npmjs.org/mongodb/-/mongodb-3.5.9.tgz",
+            "integrity": "sha512-vXHBY1CsGYcEPoVWhwgxIBeWqP3dSu9RuRDsoLRPTITrcrgm1f0Ubu1xqF9ozMwv53agmEiZm0YGo+7WL3Nbug==",
+            "dependencies": {
+                "bl": "^2.2.0",
+                "bson": "^1.1.4",
+                "denque": "^1.4.1",
+                "require_optional": "^1.0.1",
+                "safe-buffer": "^5.1.2"
+            },
+            "engines": {
+                "node": ">=4"
+            },
+            "optionalDependencies": {
+                "saslprep": "^1.0.0"
+            }
+        },
+        "node_modules/mongodb-core": {
+            "version": "2.1.20",
+            "resolved": "https://registry.npmjs.org/mongodb-core/-/mongodb-core-2.1.20.tgz",
+            "integrity": "sha512-IN57CX5/Q1bhDq6ShAR6gIv4koFsZP7L8WOK1S0lR0pVDQaScffSMV5jxubLsmZ7J+UdqmykKw4r9hG3XQEGgQ==",
+            "dependencies": {
+                "bson": "~1.0.4",
+                "require_optional": "~1.0.0"
+            }
+        },
+        "node_modules/mongodb/node_modules/bl": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/bl/-/bl-2.2.0.tgz",
+            "integrity": "sha512-wbgvOpqopSr7uq6fJrLH8EsvYMJf9gzfo2jCsL2eTy75qXPukA4pCgHamOQkZtY5vmfVtjB+P3LNlMHW5CEZXA==",
+            "dependencies": {
+                "readable-stream": "^2.3.5",
+                "safe-buffer": "^5.1.1"
+            }
+        },
+        "node_modules/mongodb/node_modules/bson": {
+            "version": "1.1.4",
+            "resolved": "https://registry.npmjs.org/bson/-/bson-1.1.4.tgz",
+            "integrity": "sha512-S/yKGU1syOMzO86+dGpg2qGoDL0zvzcb262G+gqEy6TgP6rt6z6qxSFX/8X6vLC91P7G7C3nLs0+bvDzmvBA3Q==",
+            "engines": {
+                "node": ">=0.6.19"
+            }
+        },
+        "node_modules/mongodb/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/mongoose": {
+            "version": "5.9.20",
+            "resolved": "https://registry.npmjs.org/mongoose/-/mongoose-5.9.20.tgz",
+            "integrity": "sha512-vRP6Csu2obzSl3ed7kTQMrolBNgweiRJ/eBU1PSe/rJfjqWS1oqDE2D1ZPGxkVOsKXs7Gyd84GAXerj8IB2UWg==",
+            "dependencies": {
+                "bson": "^1.1.4",
+                "kareem": "2.3.1",
+                "mongodb": "3.5.9",
+                "mongoose-legacy-pluralize": "1.0.2",
+                "mpath": "0.7.0",
+                "mquery": "3.2.2",
+                "ms": "2.1.2",
+                "regexp-clone": "1.0.0",
+                "safe-buffer": "5.1.2",
+                "sift": "7.0.1",
+                "sliced": "1.0.1"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/mongoose-legacy-pluralize": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/mongoose-legacy-pluralize/-/mongoose-legacy-pluralize-1.0.2.tgz",
+            "integrity": "sha512-Yo/7qQU4/EyIS8YDFSeenIvXxZN+ld7YdV9LqFVQJzTLye8unujAWPZ4NWKfFA+RNjh+wvTWKY9Z3E5XM6ZZiQ=="
+        },
+        "node_modules/mongoose/node_modules/bson": {
+            "version": "1.1.4",
+            "resolved": "https://registry.npmjs.org/bson/-/bson-1.1.4.tgz",
+            "integrity": "sha512-S/yKGU1syOMzO86+dGpg2qGoDL0zvzcb262G+gqEy6TgP6rt6z6qxSFX/8X6vLC91P7G7C3nLs0+bvDzmvBA3Q==",
+            "engines": {
+                "node": ">=0.6.19"
+            }
+        },
+        "node_modules/mongoose/node_modules/ms": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+            "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+        },
+        "node_modules/move-concurrently": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz",
+            "integrity": "sha1-viwAX9oy4LKa8fBdfEszIUxwH5I=",
+            "dev": true,
+            "dependencies": {
+                "aproba": "^1.1.1",
+                "copy-concurrently": "^1.0.0",
+                "fs-write-stream-atomic": "^1.0.8",
+                "mkdirp": "^0.5.1",
+                "rimraf": "^2.5.4",
+                "run-queue": "^1.0.3"
+            }
+        },
+        "node_modules/move-concurrently/node_modules/rimraf": {
+            "version": "2.7.1",
+            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+            "dev": true,
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/mpath": {
+            "version": "0.7.0",
+            "resolved": "https://registry.npmjs.org/mpath/-/mpath-0.7.0.tgz",
+            "integrity": "sha512-Aiq04hILxhz1L+f7sjGyn7IxYzWm1zLNNXcfhDtx04kZ2Gk7uvFdgZ8ts1cWa/6d0TQmag2yR8zSGZUmp0tFNg==",
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/mquery": {
+            "version": "3.2.2",
+            "resolved": "https://registry.npmjs.org/mquery/-/mquery-3.2.2.tgz",
+            "integrity": "sha512-XB52992COp0KP230I3qloVUbkLUxJIu328HBP2t2EsxSFtf4W1HPSOBWOXf1bqxK4Xbb66lfMJ+Bpfd9/yZE1Q==",
+            "dependencies": {
+                "bluebird": "3.5.1",
+                "debug": "3.1.0",
+                "regexp-clone": "^1.0.0",
+                "safe-buffer": "5.1.2",
+                "sliced": "1.0.1"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/mquery/node_modules/bluebird": {
+            "version": "3.5.1",
+            "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.1.tgz",
+            "integrity": "sha512-MKiLiV+I1AA596t9w1sQJ8jkiSr5+ZKi0WKrYGUn6d1Fx+Ij4tIj+m2WMQSGczs5jZVxV339chE8iwk6F64wjA=="
+        },
+        "node_modules/mquery/node_modules/debug": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+            "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/mquery/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        },
+        "node_modules/mr-parser": {
+            "version": "0.2.1",
+            "resolved": "https://registry.npmjs.org/mr-parser/-/mr-parser-0.2.1.tgz",
+            "integrity": "sha1-hhi5ukF+KOn0OaQcaVtVTq/u2Sc="
+        },
+        "node_modules/ms": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz",
+            "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg=="
+        },
+        "node_modules/multicast-dns": {
+            "version": "6.2.3",
+            "resolved": "https://registry.npmjs.org/multicast-dns/-/multicast-dns-6.2.3.tgz",
+            "integrity": "sha512-ji6J5enbMyGRHIAkAOu3WdV8nggqviKCEKtXcOqfphZZtQrmHKycfynJ2V7eVPUA4NhJ6V7Wf4TmGbTwKE9B6g==",
+            "dev": true,
+            "dependencies": {
+                "dns-packet": "^1.3.1",
+                "thunky": "^1.0.2"
+            },
+            "bin": {
+                "multicast-dns": "cli.js"
+            }
+        },
+        "node_modules/multicast-dns-service-types": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/multicast-dns-service-types/-/multicast-dns-service-types-1.1.0.tgz",
+            "integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE=",
+            "dev": true
+        },
+        "node_modules/nan": {
+            "version": "2.14.1",
+            "resolved": "https://registry.npmjs.org/nan/-/nan-2.14.1.tgz",
+            "integrity": "sha512-isWHgVjnFjh2x2yuJ/tj3JbwoHu3UC2dX5G/88Cm24yB6YopVgxvBObDY7n5xW6ExmFhJpSEQqFPvq9zaXc8Jw=="
+        },
+        "node_modules/nanoid": {
+            "version": "3.1.10",
+            "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.10.tgz",
+            "integrity": "sha512-iZFMXKeXWkxzlfmMfM91gw7YhN2sdJtixY+eZh9V6QWJWTOiurhpKhBMgr82pfzgSqglQgqYSCowEYsz8D++6w==",
+            "bin": {
+                "nanoid": "bin/nanoid.cjs"
+            },
+            "engines": {
+                "node": "^10 || ^12 || >=13.7"
+            }
+        },
+        "node_modules/nanomatch": {
+            "version": "1.2.13",
+            "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.13.tgz",
+            "integrity": "sha512-fpoe2T0RbHwBTBUOftAfBPaDEi06ufaUai0mE6Yn1kacc3SnTErfb/h+X94VXzI64rKFHYImXSvdwGGCmwOqCA==",
+            "dependencies": {
+                "arr-diff": "^4.0.0",
+                "array-unique": "^0.3.2",
+                "define-property": "^2.0.2",
+                "extend-shallow": "^3.0.2",
+                "fragment-cache": "^0.2.1",
+                "is-windows": "^1.0.2",
+                "kind-of": "^6.0.2",
+                "object.pick": "^1.3.0",
+                "regex-not": "^1.0.0",
+                "snapdragon": "^0.8.1",
+                "to-regex": "^3.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/napi-build-utils": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/napi-build-utils/-/napi-build-utils-1.0.2.tgz",
+            "integrity": "sha512-ONmRUqK7zj7DWX0D9ADe03wbwOBZxNAfF20PlGfCWQcD3+/MakShIHrMqx9YwPTfxDdF1zLeL+RGZiR9kGMLdg=="
+        },
+        "node_modules/native-or-bluebird": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/native-or-bluebird/-/native-or-bluebird-1.2.0.tgz",
+            "integrity": "sha1-OcR7/Xgl0fuf+tMiEK4l2q3xAck="
+        },
+        "node_modules/needle": {
+            "version": "2.4.1",
+            "resolved": "https://registry.npmjs.org/needle/-/needle-2.4.1.tgz",
+            "integrity": "sha512-x/gi6ijr4B7fwl6WYL9FwlCvRQKGlUNvnceho8wxkwXqN8jvVmmmATTmZPRRG7b/yC1eode26C2HO9jl78Du9g==",
+            "dependencies": {
+                "debug": "^3.2.6",
+                "iconv-lite": "^0.4.4",
+                "sax": "^1.2.4"
+            },
+            "bin": {
+                "needle": "bin/needle"
+            },
+            "engines": {
+                "node": ">= 4.4.x"
+            }
+        },
+        "node_modules/negotiator": {
+            "version": "0.6.2",
+            "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.2.tgz",
+            "integrity": "sha512-hZXc7K2e+PgeI1eDBe/10Ard4ekbfrrqG8Ep+8Jmf4JID2bNg7NvCPOZN+kfF574pFQI7mum2AUqDidoKqcTOw==",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/neo-async": {
+            "version": "2.6.1",
+            "resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.6.1.tgz",
+            "integrity": "sha512-iyam8fBuCUpWeKPGpaNMetEocMt364qkCsfL9JuhjXX6dRnguRVOfk2GZaDpPjcOKiiXCPINZC1GczQ7iTq3Zw==",
+            "dev": true
+        },
+        "node_modules/next-tick": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/next-tick/-/next-tick-1.0.0.tgz",
+            "integrity": "sha1-yobR/ogoFpsBICCOPchCS524NCw="
+        },
+        "node_modules/nextafter": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/nextafter/-/nextafter-1.0.0.tgz",
+            "integrity": "sha1-t9d7U1MQ4+CX5gJauwqQNHfsGjo=",
+            "dependencies": {
+                "double-bits": "^1.1.0"
+            }
+        },
+        "node_modules/nice-try": {
+            "version": "1.0.5",
+            "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
+            "integrity": "sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==",
+            "dev": true
+        },
+        "node_modules/node-abi": {
+            "version": "2.16.0",
+            "resolved": "https://registry.npmjs.org/node-abi/-/node-abi-2.16.0.tgz",
+            "integrity": "sha512-+sa0XNlWDA6T+bDLmkCUYn6W5k5W6BPRL6mqzSCs6H/xUgtl4D5x2fORKDzopKiU6wsyn/+wXlRXwXeSp+mtoA==",
+            "dependencies": {
+                "semver": "^5.4.1"
+            }
+        },
+        "node_modules/node-ensure": {
+            "version": "0.0.0",
+            "resolved": "https://registry.npmjs.org/node-ensure/-/node-ensure-0.0.0.tgz",
+            "integrity": "sha1-7K52QVDemYYexcgQ/V0Jaxg5Mqc="
+        },
+        "node_modules/node-environment-flags": {
+            "version": "1.0.5",
+            "resolved": "https://registry.npmjs.org/node-environment-flags/-/node-environment-flags-1.0.5.tgz",
+            "integrity": "sha512-VNYPRfGfmZLx0Ye20jWzHUjyTW/c+6Wq+iLhDzUI4XmhrDd9l/FozXV3F2xOaXjvp0co0+v1YSR3CMP6g+VvLQ==",
+            "dependencies": {
+                "object.getownpropertydescriptors": "^2.0.3",
+                "semver": "^5.7.0"
+            }
+        },
+        "node_modules/node-fetch": {
+            "version": "1.7.3",
+            "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.3.tgz",
+            "integrity": "sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==",
+            "dependencies": {
+                "encoding": "^0.1.11",
+                "is-stream": "^1.0.1"
+            }
+        },
+        "node_modules/node-forge": {
+            "version": "0.9.1",
+            "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.9.1.tgz",
+            "integrity": "sha512-G6RlQt5Sb4GMBzXvhfkeFmbqR6MzhtnT7VTHuLadjkii3rdYHNdw0m8zA4BTxVIh68FicCQ2NSUANpsqkr9jvQ==",
+            "engines": {
+                "node": ">= 4.5.0"
+            }
+        },
+        "node_modules/node-gyp": {
+            "version": "3.8.0",
+            "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.8.0.tgz",
+            "integrity": "sha512-3g8lYefrRRzvGeSowdJKAKyks8oUpLEd/DyPV4eMhVlhJ0aNaZqIrNUIPuEWWTAoPqyFkfGrM67MC69baqn6vA==",
+            "dependencies": {
+                "fstream": "^1.0.0",
+                "glob": "^7.0.3",
+                "graceful-fs": "^4.1.2",
+                "mkdirp": "^0.5.0",
+                "nopt": "2 || 3",
+                "npmlog": "0 || 1 || 2 || 3 || 4",
+                "osenv": "0",
+                "request": "^2.87.0",
+                "rimraf": "2",
+                "semver": "~5.3.0",
+                "tar": "^2.0.0",
+                "which": "1"
+            },
+            "bin": {
+                "node-gyp": "bin/node-gyp.js"
+            },
+            "engines": {
+                "node": ">= 0.8.0"
+            }
+        },
+        "node_modules/node-gyp/node_modules/nopt": {
+            "version": "3.0.6",
+            "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz",
+            "integrity": "sha1-xkZdvwirzU2zWTF/eaxopkayj/k=",
+            "dependencies": {
+                "abbrev": "1"
+            },
+            "bin": {
+                "nopt": "bin/nopt.js"
+            }
+        },
+        "node_modules/node-gyp/node_modules/rimraf": {
+            "version": "2.7.1",
+            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/node-gyp/node_modules/semver": {
+            "version": "5.3.0",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
+            "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=",
+            "bin": {
+                "semver": "bin/semver"
+            }
+        },
+        "node_modules/node-gyp/node_modules/tar": {
+            "version": "2.2.2",
+            "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.2.tgz",
+            "integrity": "sha512-FCEhQ/4rE1zYv9rYXJw/msRqsnmlje5jHP6huWeBZ704jUTy02c5AZyWujpMR1ax6mVw9NyJMfuK2CMDWVIfgA==",
+            "dependencies": {
+                "block-stream": "*",
+                "fstream": "^1.0.12",
+                "inherits": "2"
+            }
+        },
+        "node_modules/node-libs-browser": {
+            "version": "2.2.1",
+            "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.2.1.tgz",
+            "integrity": "sha512-h/zcD8H9kaDZ9ALUWwlBUDo6TKF8a7qBSCSEGfjTVIYeqsioSKaAX+BN7NgiMGp6iSIXZ3PxgCu8KS3b71YK5Q==",
+            "dev": true,
+            "dependencies": {
+                "assert": "^1.1.1",
+                "browserify-zlib": "^0.2.0",
+                "buffer": "^4.3.0",
+                "console-browserify": "^1.1.0",
+                "constants-browserify": "^1.0.0",
+                "crypto-browserify": "^3.11.0",
+                "domain-browser": "^1.1.1",
+                "events": "^3.0.0",
+                "https-browserify": "^1.0.0",
+                "os-browserify": "^0.3.0",
+                "path-browserify": "0.0.1",
+                "process": "^0.11.10",
+                "punycode": "^1.2.4",
+                "querystring-es3": "^0.2.0",
+                "readable-stream": "^2.3.3",
+                "stream-browserify": "^2.0.1",
+                "stream-http": "^2.7.2",
+                "string_decoder": "^1.0.0",
+                "timers-browserify": "^2.0.4",
+                "tty-browserify": "0.0.0",
+                "url": "^0.11.0",
+                "util": "^0.11.0",
+                "vm-browserify": "^1.0.1"
+            }
+        },
+        "node_modules/node-libs-browser/node_modules/buffer": {
+            "version": "4.9.2",
+            "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.2.tgz",
+            "integrity": "sha512-xq+q3SRMOxGivLhBNaUdC64hDTQwejJ+H0T/NB1XMtTVEwNTrfFF3gAxiyW0Bu/xWEGhjVKgUcMhCrUy2+uCWg==",
+            "dev": true,
+            "dependencies": {
+                "base64-js": "^1.0.2",
+                "ieee754": "^1.1.4",
+                "isarray": "^1.0.0"
+            }
+        },
+        "node_modules/node-libs-browser/node_modules/punycode": {
+            "version": "1.4.1",
+            "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+            "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
+            "dev": true
+        },
+        "node_modules/node-libs-browser/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dev": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/node-notifier": {
+            "version": "5.4.3",
+            "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.4.3.tgz",
+            "integrity": "sha512-M4UBGcs4jeOK9CjTsYwkvH6/MzuUmGCyTW+kCY7uO+1ZVr0+FHGdPdIf5CCLqAaxnRrWidyoQlNkMIIVwbKB8Q==",
+            "dev": true,
+            "dependencies": {
+                "growly": "^1.3.0",
+                "is-wsl": "^1.1.0",
+                "semver": "^5.5.0",
+                "shellwords": "^0.1.1",
+                "which": "^1.3.0"
+            }
+        },
+        "node_modules/node-sass": {
+            "version": "4.14.1",
+            "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.14.1.tgz",
+            "integrity": "sha512-sjCuOlvGyCJS40R8BscF5vhVlQjNN069NtQ1gSxyK1u9iqvn6tf7O1R4GNowVZfiZUCRt5MmMs1xd+4V/7Yr0g==",
+            "hasInstallScript": true,
+            "dependencies": {
+                "async-foreach": "^0.1.3",
+                "chalk": "^1.1.1",
+                "cross-spawn": "^3.0.0",
+                "gaze": "^1.0.0",
+                "get-stdin": "^4.0.1",
+                "glob": "^7.0.3",
+                "in-publish": "^2.0.0",
+                "lodash": "^4.17.15",
+                "meow": "^3.7.0",
+                "mkdirp": "^0.5.1",
+                "nan": "^2.13.2",
+                "node-gyp": "^3.8.0",
+                "npmlog": "^4.0.0",
+                "request": "^2.88.0",
+                "sass-graph": "2.2.5",
+                "stdout-stream": "^1.4.0",
+                "true-case-path": "^1.0.2"
+            },
+            "bin": {
+                "node-sass": "bin/node-sass"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/node-sass-tilde-importer": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/node-sass-tilde-importer/-/node-sass-tilde-importer-1.0.2.tgz",
+            "integrity": "sha512-Swcmr38Y7uB78itQeBm3mThjxBy9/Ah/ykPIaURY/L6Nec9AyRoL/jJ7ECfMR+oZeCTVQNxVMu/aHU+TLRVbdg==",
+            "dependencies": {
+                "find-parent-dir": "^0.3.0"
+            }
+        },
+        "node_modules/node-sass/node_modules/ansi-regex": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+            "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/node-sass/node_modules/ansi-styles": {
+            "version": "2.2.1",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+            "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/node-sass/node_modules/chalk": {
+            "version": "1.1.3",
+            "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+            "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+            "dependencies": {
+                "ansi-styles": "^2.2.1",
+                "escape-string-regexp": "^1.0.2",
+                "has-ansi": "^2.0.0",
+                "strip-ansi": "^3.0.0",
+                "supports-color": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/node-sass/node_modules/get-stdin": {
+            "version": "4.0.1",
+            "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
+            "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/node-sass/node_modules/strip-ansi": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+            "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
+            "dependencies": {
+                "ansi-regex": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/node-sass/node_modules/supports-color": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+            "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
+            "engines": {
+                "node": ">=0.8.0"
+            }
+        },
+        "node_modules/node-stream-zip": {
+            "version": "1.11.2",
+            "resolved": "https://registry.npmjs.org/node-stream-zip/-/node-stream-zip-1.11.2.tgz",
+            "integrity": "sha512-cowCX+OyzS3tN2i4BMMFxCr/pE6cQlEMTbVCugmos0TNEJQNtcG04tR41CY8lumO1I7F5GFiLaU4WavomJthaA==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/nodemailer": {
+            "version": "5.1.1",
+            "resolved": "https://registry.npmjs.org/nodemailer/-/nodemailer-5.1.1.tgz",
+            "integrity": "sha512-hKGCoeNdFL2W7S76J/Oucbw0/qRlfG815tENdhzcqTpSjKgAN91mFOqU2lQUflRRxFM7iZvCyaFcAR9noc/CqQ==",
+            "engines": {
+                "node": ">=6.0.0"
+            }
+        },
+        "node_modules/nodemon": {
+            "version": "1.19.4",
+            "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-1.19.4.tgz",
+            "integrity": "sha512-VGPaqQBNk193lrJFotBU8nvWZPqEZY2eIzymy2jjY0fJ9qIsxA0sxQ8ATPl0gZC645gijYEc1jtZvpS8QWzJGQ==",
+            "hasInstallScript": true,
+            "dependencies": {
+                "chokidar": "^2.1.8",
+                "debug": "^3.2.6",
+                "ignore-by-default": "^1.0.1",
+                "minimatch": "^3.0.4",
+                "pstree.remy": "^1.1.7",
+                "semver": "^5.7.1",
+                "supports-color": "^5.5.0",
+                "touch": "^3.1.0",
+                "undefsafe": "^2.0.2",
+                "update-notifier": "^2.5.0"
+            },
+            "bin": {
+                "nodemon": "bin/nodemon.js"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/noop-logger": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/noop-logger/-/noop-logger-0.1.1.tgz",
+            "integrity": "sha1-lKKxYzxPExdVMAfYlm/Q6EG2pMI="
+        },
+        "node_modules/nopt": {
+            "version": "4.0.3",
+            "resolved": "https://registry.npmjs.org/nopt/-/nopt-4.0.3.tgz",
+            "integrity": "sha512-CvaGwVMztSMJLOeXPrez7fyfObdZqNUK1cPAEzLHrTybIua9pMdmmPR5YwtfNftIOMv3DPUhFaxsZMNTQO20Kg==",
+            "dependencies": {
+                "abbrev": "1",
+                "osenv": "^0.1.4"
+            },
+            "bin": {
+                "nopt": "bin/nopt.js"
+            }
+        },
+        "node_modules/normalize-package-data": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.5.0.tgz",
+            "integrity": "sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==",
+            "dependencies": {
+                "hosted-git-info": "^2.1.4",
+                "resolve": "^1.10.0",
+                "semver": "2 || 3 || 4 || 5",
+                "validate-npm-package-license": "^3.0.1"
+            }
+        },
+        "node_modules/normalize-path": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
+            "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/normalize.css": {
+            "version": "8.0.1",
+            "resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz",
+            "integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg=="
+        },
+        "node_modules/npm": {
+            "version": "6.14.5",
+            "resolved": "https://registry.npmjs.org/npm/-/npm-6.14.5.tgz",
+            "integrity": "sha512-CDwa3FJd0XJpKDbWCST484H+mCNjF26dPrU+xnREW+upR0UODjMEfXPl3bxWuAwZIX6c2ASg1plLO7jP8ehWeA==",
+            "bundleDependencies": [
+                "JSONStream",
+                "abbrev",
+                "ansicolors",
+                "ansistyles",
+                "aproba",
+                "archy",
+                "bin-links",
+                "bluebird",
+                "byte-size",
+                "cacache",
+                "call-limit",
+                "chownr",
+                "ci-info",
+                "cli-columns",
+                "cli-table3",
+                "cmd-shim",
+                "columnify",
+                "config-chain",
+                "debuglog",
+                "detect-indent",
+                "detect-newline",
+                "dezalgo",
+                "editor",
+                "figgy-pudding",
+                "find-npm-prefix",
+                "fs-vacuum",
+                "fs-write-stream-atomic",
+                "gentle-fs",
+                "glob",
+                "graceful-fs",
+                "has-unicode",
+                "hosted-git-info",
+                "iferr",
+                "imurmurhash",
+                "infer-owner",
+                "inflight",
+                "inherits",
+                "ini",
+                "init-package-json",
+                "is-cidr",
+                "json-parse-better-errors",
+                "lazy-property",
+                "libcipm",
+                "libnpm",
+                "libnpmaccess",
+                "libnpmhook",
+                "libnpmorg",
+                "libnpmsearch",
+                "libnpmteam",
+                "libnpx",
+                "lock-verify",
+                "lockfile",
+                "lodash._baseindexof",
+                "lodash._baseuniq",
+                "lodash._bindcallback",
+                "lodash._cacheindexof",
+                "lodash._createcache",
+                "lodash._getnative",
+                "lodash.clonedeep",
+                "lodash.restparam",
+                "lodash.union",
+                "lodash.uniq",
+                "lodash.without",
+                "lru-cache",
+                "meant",
+                "mississippi",
+                "mkdirp",
+                "move-concurrently",
+                "node-gyp",
+                "nopt",
+                "normalize-package-data",
+                "npm-audit-report",
+                "npm-cache-filename",
+                "npm-install-checks",
+                "npm-lifecycle",
+                "npm-package-arg",
+                "npm-packlist",
+                "npm-pick-manifest",
+                "npm-profile",
+                "npm-registry-fetch",
+                "npm-user-validate",
+                "npmlog",
+                "once",
+                "opener",
+                "osenv",
+                "pacote",
+                "path-is-inside",
+                "promise-inflight",
+                "qrcode-terminal",
+                "query-string",
+                "qw",
+                "read",
+                "read-cmd-shim",
+                "read-installed",
+                "read-package-json",
+                "read-package-tree",
+                "readable-stream",
+                "readdir-scoped-modules",
+                "request",
+                "retry",
+                "rimraf",
+                "safe-buffer",
+                "semver",
+                "sha",
+                "slide",
+                "sorted-object",
+                "sorted-union-stream",
+                "ssri",
+                "stringify-package",
+                "tar",
+                "text-table",
+                "tiny-relative-date",
+                "uid-number",
+                "umask",
+                "unique-filename",
+                "unpipe",
+                "update-notifier",
+                "uuid",
+                "validate-npm-package-license",
+                "validate-npm-package-name",
+                "which",
+                "worker-farm",
+                "write-file-atomic"
+            ],
+            "dependencies": {
+                "abbrev": "~1.1.1",
+                "ansicolors": "~0.3.2",
+                "ansistyles": "~0.1.3",
+                "aproba": "^2.0.0",
+                "archy": "~1.0.0",
+                "bin-links": "^1.1.7",
+                "bluebird": "^3.5.5",
+                "byte-size": "^5.0.1",
+                "cacache": "^12.0.3",
+                "call-limit": "^1.1.1",
+                "chownr": "^1.1.4",
+                "ci-info": "^2.0.0",
+                "cli-columns": "^3.1.2",
+                "cli-table3": "^0.5.1",
+                "cmd-shim": "^3.0.3",
+                "columnify": "~1.5.4",
+                "config-chain": "^1.1.12",
+                "debuglog": "*",
+                "detect-indent": "~5.0.0",
+                "detect-newline": "^2.1.0",
+                "dezalgo": "~1.0.3",
+                "editor": "~1.0.0",
+                "figgy-pudding": "^3.5.1",
+                "find-npm-prefix": "^1.0.2",
+                "fs-vacuum": "~1.2.10",
+                "fs-write-stream-atomic": "~1.0.10",
+                "gentle-fs": "^2.3.0",
+                "glob": "^7.1.6",
+                "graceful-fs": "^4.2.4",
+                "has-unicode": "~2.0.1",
+                "hosted-git-info": "^2.8.8",
+                "iferr": "^1.0.2",
+                "imurmurhash": "*",
+                "infer-owner": "^1.0.4",
+                "inflight": "~1.0.6",
+                "inherits": "^2.0.4",
+                "ini": "^1.3.5",
+                "init-package-json": "^1.10.3",
+                "is-cidr": "^3.0.0",
+                "json-parse-better-errors": "^1.0.2",
+                "JSONStream": "^1.3.5",
+                "lazy-property": "~1.0.0",
+                "libcipm": "^4.0.7",
+                "libnpm": "^3.0.1",
+                "libnpmaccess": "^3.0.2",
+                "libnpmhook": "^5.0.3",
+                "libnpmorg": "^1.0.1",
+                "libnpmsearch": "^2.0.2",
+                "libnpmteam": "^1.0.2",
+                "libnpx": "^10.2.2",
+                "lock-verify": "^2.1.0",
+                "lockfile": "^1.0.4",
+                "lodash._baseindexof": "*",
+                "lodash._baseuniq": "~4.6.0",
+                "lodash._bindcallback": "*",
+                "lodash._cacheindexof": "*",
+                "lodash._createcache": "*",
+                "lodash._getnative": "*",
+                "lodash.clonedeep": "~4.5.0",
+                "lodash.restparam": "*",
+                "lodash.union": "~4.6.0",
+                "lodash.uniq": "~4.5.0",
+                "lodash.without": "~4.4.0",
+                "lru-cache": "^5.1.1",
+                "meant": "~1.0.1",
+                "mississippi": "^3.0.0",
+                "mkdirp": "^0.5.5",
+                "move-concurrently": "^1.0.1",
+                "node-gyp": "^5.1.0",
+                "nopt": "^4.0.3",
+                "normalize-package-data": "^2.5.0",
+                "npm-audit-report": "^1.3.2",
+                "npm-cache-filename": "~1.0.2",
+                "npm-install-checks": "^3.0.2",
+                "npm-lifecycle": "^3.1.4",
+                "npm-package-arg": "^6.1.1",
+                "npm-packlist": "^1.4.8",
+                "npm-pick-manifest": "^3.0.2",
+                "npm-profile": "^4.0.4",
+                "npm-registry-fetch": "^4.0.4",
+                "npm-user-validate": "~1.0.0",
+                "npmlog": "~4.1.2",
+                "once": "~1.4.0",
+                "opener": "^1.5.1",
+                "osenv": "^0.1.5",
+                "pacote": "^9.5.12",
+                "path-is-inside": "~1.0.2",
+                "promise-inflight": "~1.0.1",
+                "qrcode-terminal": "^0.12.0",
+                "query-string": "^6.8.2",
+                "qw": "~1.0.1",
+                "read": "~1.0.7",
+                "read-cmd-shim": "^1.0.5",
+                "read-installed": "~4.0.3",
+                "read-package-json": "^2.1.1",
+                "read-package-tree": "^5.3.1",
+                "readable-stream": "^3.6.0",
+                "readdir-scoped-modules": "^1.1.0",
+                "request": "^2.88.0",
+                "retry": "^0.12.0",
+                "rimraf": "^2.7.1",
+                "safe-buffer": "^5.1.2",
+                "semver": "^5.7.1",
+                "sha": "^3.0.0",
+                "slide": "~1.1.6",
+                "sorted-object": "~2.0.1",
+                "sorted-union-stream": "~2.1.3",
+                "ssri": "^6.0.1",
+                "stringify-package": "^1.0.1",
+                "tar": "^4.4.13",
+                "text-table": "~0.2.0",
+                "tiny-relative-date": "^1.3.0",
+                "uid-number": "0.0.6",
+                "umask": "~1.1.0",
+                "unique-filename": "^1.1.1",
+                "unpipe": "~1.0.0",
+                "update-notifier": "^2.5.0",
+                "uuid": "^3.3.3",
+                "validate-npm-package-license": "^3.0.4",
+                "validate-npm-package-name": "~3.0.0",
+                "which": "^1.3.1",
+                "worker-farm": "^1.7.0",
+                "write-file-atomic": "^2.4.3"
+            },
+            "bin": {
+                "npm": "bin/npm-cli.js",
+                "npx": "bin/npx-cli.js"
+            },
+            "engines": {
+                "node": "6 >=6.2.0 || 8 || >=9.3.0"
+            }
+        },
+        "node_modules/npm-bundled": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/npm-bundled/-/npm-bundled-1.1.1.tgz",
+            "integrity": "sha512-gqkfgGePhTpAEgUsGEgcq1rqPXA+tv/aVBlgEzfXwA1yiUJF7xtEt3CtVwOjNYQOVknDk0F20w58Fnm3EtG0fA==",
+            "dependencies": {
+                "npm-normalize-package-bin": "^1.0.1"
+            }
+        },
+        "node_modules/npm-normalize-package-bin": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/npm-normalize-package-bin/-/npm-normalize-package-bin-1.0.1.tgz",
+            "integrity": "sha512-EPfafl6JL5/rU+ot6P3gRSCpPDW5VmIzX959Ob1+ySFUuuYHWHekXpwdUZcKP5C+DS4GEtdJluwBjnsNDl+fSA=="
+        },
+        "node_modules/npm-packlist": {
+            "version": "1.4.8",
+            "resolved": "https://registry.npmjs.org/npm-packlist/-/npm-packlist-1.4.8.tgz",
+            "integrity": "sha512-5+AZgwru5IevF5ZdnFglB5wNlHG1AOOuw28WhUq8/8emhBmLv6jX5by4WJCh7lW0uSYZYS6DXqIsyZVIXRZU9A==",
+            "dependencies": {
+                "ignore-walk": "^3.0.1",
+                "npm-bundled": "^1.0.1",
+                "npm-normalize-package-bin": "^1.0.1"
+            }
+        },
+        "node_modules/npm-run-path": {
+            "version": "2.0.2",
+            "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-2.0.2.tgz",
+            "integrity": "sha1-NakjLfo11wZ7TLLd8jV7GHFTbF8=",
+            "dependencies": {
+                "path-key": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/abbrev": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/agent-base": {
+            "version": "4.3.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "es6-promisify": "^5.0.0"
+            },
+            "engines": {
+                "node": ">= 4.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/agentkeepalive": {
+            "version": "3.5.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "humanize-ms": "^1.2.1"
+            },
+            "engines": {
+                "node": ">= 4.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/ajv": {
+            "version": "5.5.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "co": "^4.6.0",
+                "fast-deep-equal": "^1.0.0",
+                "fast-json-stable-stringify": "^2.0.0",
+                "json-schema-traverse": "^0.3.0"
+            }
+        },
+        "node_modules/npm/node_modules/ansi-align": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "string-width": "^2.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/ansi-regex": {
+            "version": "2.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/ansi-styles": {
+            "version": "3.2.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "color-convert": "^1.9.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/ansicolors": {
+            "version": "0.3.2",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/ansistyles": {
+            "version": "0.1.3",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/aproba": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/archy": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/are-we-there-yet": {
+            "version": "1.1.4",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "delegates": "^1.0.0",
+                "readable-stream": "^2.0.6"
+            }
+        },
+        "node_modules/npm/node_modules/are-we-there-yet/node_modules/readable-stream": {
+            "version": "2.3.6",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/are-we-there-yet/node_modules/string_decoder": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/asap": {
+            "version": "2.0.6",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/asn1": {
+            "version": "0.2.4",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "safer-buffer": "~2.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/assert-plus": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.8"
+            }
+        },
+        "node_modules/npm/node_modules/asynckit": {
+            "version": "0.4.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/aws-sign2": {
+            "version": "0.7.0",
+            "inBundle": true,
+            "license": "Apache-2.0",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/npm/node_modules/aws4": {
+            "version": "1.8.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/balanced-match": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/bcrypt-pbkdf": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "BSD-3-Clause",
+            "optional": true,
+            "dependencies": {
+                "tweetnacl": "^0.14.3"
+            }
+        },
+        "node_modules/npm/node_modules/bin-links": {
+            "version": "1.1.7",
+            "inBundle": true,
+            "license": "Artistic-2.0",
+            "dependencies": {
+                "bluebird": "^3.5.3",
+                "cmd-shim": "^3.0.0",
+                "gentle-fs": "^2.3.0",
+                "graceful-fs": "^4.1.15",
+                "npm-normalize-package-bin": "^1.0.0",
+                "write-file-atomic": "^2.3.0"
+            }
+        },
+        "node_modules/npm/node_modules/bluebird": {
+            "version": "3.5.5",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/boxen": {
+            "version": "1.3.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "ansi-align": "^2.0.0",
+                "camelcase": "^4.0.0",
+                "chalk": "^2.0.1",
+                "cli-boxes": "^1.0.0",
+                "string-width": "^2.0.0",
+                "term-size": "^1.2.0",
+                "widest-line": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/brace-expansion": {
+            "version": "1.1.11",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "balanced-match": "^1.0.0",
+                "concat-map": "0.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/buffer-from": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/builtins": {
+            "version": "1.0.3",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/byline": {
+            "version": "5.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/byte-size": {
+            "version": "5.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=6.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/cacache": {
+            "version": "12.0.3",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "bluebird": "^3.5.5",
+                "chownr": "^1.1.1",
+                "figgy-pudding": "^3.5.1",
+                "glob": "^7.1.4",
+                "graceful-fs": "^4.1.15",
+                "infer-owner": "^1.0.3",
+                "lru-cache": "^5.1.1",
+                "mississippi": "^3.0.0",
+                "mkdirp": "^0.5.1",
+                "move-concurrently": "^1.0.1",
+                "promise-inflight": "^1.0.1",
+                "rimraf": "^2.6.3",
+                "ssri": "^6.0.1",
+                "unique-filename": "^1.1.1",
+                "y18n": "^4.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/call-limit": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/camelcase": {
+            "version": "4.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/capture-stack-trace": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/caseless": {
+            "version": "0.12.0",
+            "inBundle": true,
+            "license": "Apache-2.0"
+        },
+        "node_modules/npm/node_modules/chalk": {
+            "version": "2.4.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "ansi-styles": "^3.2.1",
+                "escape-string-regexp": "^1.0.5",
+                "supports-color": "^5.3.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/chownr": {
+            "version": "1.1.4",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/ci-info": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/cidr-regex": {
+            "version": "2.0.10",
+            "inBundle": true,
+            "license": "BSD-2-Clause",
+            "dependencies": {
+                "ip-regex": "^2.1.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/cli-boxes": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/cli-columns": {
+            "version": "3.1.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "string-width": "^2.0.0",
+                "strip-ansi": "^3.0.1"
+            },
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/npm/node_modules/cli-table3": {
+            "version": "0.5.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "object-assign": "^4.1.0",
+                "string-width": "^2.1.1"
+            },
+            "engines": {
+                "node": ">=6"
+            },
+            "optionalDependencies": {
+                "colors": "^1.1.2"
+            }
+        },
+        "node_modules/npm/node_modules/cliui": {
+            "version": "4.1.0",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "string-width": "^2.1.1",
+                "strip-ansi": "^4.0.0",
+                "wrap-ansi": "^2.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/cliui/node_modules/ansi-regex": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/cliui/node_modules/strip-ansi": {
+            "version": "4.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "ansi-regex": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/clone": {
+            "version": "1.0.4",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.8"
+            }
+        },
+        "node_modules/npm/node_modules/cmd-shim": {
+            "version": "3.0.3",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "graceful-fs": "^4.1.2",
+                "mkdirp": "~0.5.0"
+            }
+        },
+        "node_modules/npm/node_modules/co": {
+            "version": "4.6.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "iojs": ">= 1.0.0",
+                "node": ">= 0.12.0"
+            }
+        },
+        "node_modules/npm/node_modules/code-point-at": {
+            "version": "1.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/color-convert": {
+            "version": "1.9.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "color-name": "^1.1.1"
+            }
+        },
+        "node_modules/npm/node_modules/color-name": {
+            "version": "1.1.3",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/colors": {
+            "version": "1.3.3",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "engines": {
+                "node": ">=0.1.90"
+            }
+        },
+        "node_modules/npm/node_modules/columnify": {
+            "version": "1.5.4",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "strip-ansi": "^3.0.0",
+                "wcwidth": "^1.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/combined-stream": {
+            "version": "1.0.6",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "delayed-stream": "~1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/npm/node_modules/concat-map": {
+            "version": "0.0.1",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/concat-stream": {
+            "version": "1.6.2",
+            "engines": [
+                "node >= 0.8"
+            ],
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "buffer-from": "^1.0.0",
+                "inherits": "^2.0.3",
+                "readable-stream": "^2.2.2",
+                "typedarray": "^0.0.6"
+            }
+        },
+        "node_modules/npm/node_modules/concat-stream/node_modules/readable-stream": {
+            "version": "2.3.6",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/concat-stream/node_modules/string_decoder": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/config-chain": {
+            "version": "1.1.12",
+            "inBundle": true,
+            "dependencies": {
+                "ini": "^1.3.4",
+                "proto-list": "~1.2.1"
+            }
+        },
+        "node_modules/npm/node_modules/configstore": {
+            "version": "3.1.2",
+            "inBundle": true,
+            "license": "BSD-2-Clause",
+            "dependencies": {
+                "dot-prop": "^4.1.0",
+                "graceful-fs": "^4.1.2",
+                "make-dir": "^1.0.0",
+                "unique-string": "^1.0.0",
+                "write-file-atomic": "^2.0.0",
+                "xdg-basedir": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/console-control-strings": {
+            "version": "1.1.0",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/copy-concurrently": {
+            "version": "1.0.5",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "aproba": "^1.1.1",
+                "fs-write-stream-atomic": "^1.0.8",
+                "iferr": "^0.1.5",
+                "mkdirp": "^0.5.1",
+                "rimraf": "^2.5.4",
+                "run-queue": "^1.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/copy-concurrently/node_modules/aproba": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/copy-concurrently/node_modules/iferr": {
+            "version": "0.1.5",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/core-util-is": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/create-error-class": {
+            "version": "3.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "capture-stack-trace": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/cross-spawn": {
+            "version": "5.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "lru-cache": "^4.0.1",
+                "shebang-command": "^1.2.0",
+                "which": "^1.2.9"
+            }
+        },
+        "node_modules/npm/node_modules/cross-spawn/node_modules/lru-cache": {
+            "version": "4.1.5",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "pseudomap": "^1.0.2",
+                "yallist": "^2.1.2"
+            }
+        },
+        "node_modules/npm/node_modules/cross-spawn/node_modules/yallist": {
+            "version": "2.1.2",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/crypto-random-string": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/cyclist": {
+            "version": "0.2.2",
+            "inBundle": true
+        },
+        "node_modules/npm/node_modules/dashdash": {
+            "version": "1.14.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "assert-plus": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10"
+            }
+        },
+        "node_modules/npm/node_modules/debug": {
+            "version": "3.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/debug/node_modules/ms": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/debuglog": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/npm/node_modules/decamelize": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/decode-uri-component": {
+            "version": "0.2.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10"
+            }
+        },
+        "node_modules/npm/node_modules/deep-extend": {
+            "version": "0.6.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/defaults": {
+            "version": "1.0.3",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "clone": "^1.0.2"
+            }
+        },
+        "node_modules/npm/node_modules/define-properties": {
+            "version": "1.1.3",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "object-keys": "^1.0.12"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/npm/node_modules/delayed-stream": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/npm/node_modules/delegates": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/detect-indent": {
+            "version": "5.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/detect-newline": {
+            "version": "2.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/dezalgo": {
+            "version": "1.0.3",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "asap": "^2.0.0",
+                "wrappy": "1"
+            }
+        },
+        "node_modules/npm/node_modules/dot-prop": {
+            "version": "4.2.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "is-obj": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/dotenv": {
+            "version": "5.0.1",
+            "inBundle": true,
+            "license": "BSD-2-Clause",
+            "engines": {
+                "node": ">=4.6.0"
+            }
+        },
+        "node_modules/npm/node_modules/duplexer3": {
+            "version": "0.1.4",
+            "inBundle": true,
+            "license": "BSD-3-Clause"
+        },
+        "node_modules/npm/node_modules/duplexify": {
+            "version": "3.6.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "end-of-stream": "^1.0.0",
+                "inherits": "^2.0.1",
+                "readable-stream": "^2.0.0",
+                "stream-shift": "^1.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/duplexify/node_modules/readable-stream": {
+            "version": "2.3.6",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/duplexify/node_modules/string_decoder": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/ecc-jsbn": {
+            "version": "0.1.2",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "jsbn": "~0.1.0",
+                "safer-buffer": "^2.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/editor": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/encoding": {
+            "version": "0.1.12",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "iconv-lite": "~0.4.13"
+            }
+        },
+        "node_modules/npm/node_modules/end-of-stream": {
+            "version": "1.4.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "once": "^1.4.0"
+            }
+        },
+        "node_modules/npm/node_modules/env-paths": {
+            "version": "2.2.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/err-code": {
+            "version": "1.1.2",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/errno": {
+            "version": "0.1.7",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "prr": "~1.0.1"
+            },
+            "bin": {
+                "errno": "cli.js"
+            }
+        },
+        "node_modules/npm/node_modules/es-abstract": {
+            "version": "1.12.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "es-to-primitive": "^1.1.1",
+                "function-bind": "^1.1.1",
+                "has": "^1.0.1",
+                "is-callable": "^1.1.3",
+                "is-regex": "^1.0.4"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/npm/node_modules/es-to-primitive": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "is-callable": "^1.1.4",
+                "is-date-object": "^1.0.1",
+                "is-symbol": "^1.0.2"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/npm/node_modules/es6-promise": {
+            "version": "4.2.8",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/es6-promisify": {
+            "version": "5.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "es6-promise": "^4.0.3"
+            }
+        },
+        "node_modules/npm/node_modules/escape-string-regexp": {
+            "version": "1.0.5",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.8.0"
+            }
+        },
+        "node_modules/npm/node_modules/execa": {
+            "version": "0.7.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "cross-spawn": "^5.0.1",
+                "get-stream": "^3.0.0",
+                "is-stream": "^1.1.0",
+                "npm-run-path": "^2.0.0",
+                "p-finally": "^1.0.0",
+                "signal-exit": "^3.0.0",
+                "strip-eof": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/execa/node_modules/get-stream": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/extend": {
+            "version": "3.0.2",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/extsprintf": {
+            "version": "1.3.0",
+            "engines": [
+                "node >=0.6.0"
+            ],
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/fast-deep-equal": {
+            "version": "1.1.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/fast-json-stable-stringify": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/figgy-pudding": {
+            "version": "3.5.1",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/find-npm-prefix": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/find-up": {
+            "version": "2.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "locate-path": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/flush-write-stream": {
+            "version": "1.0.3",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "inherits": "^2.0.1",
+                "readable-stream": "^2.0.4"
+            }
+        },
+        "node_modules/npm/node_modules/flush-write-stream/node_modules/readable-stream": {
+            "version": "2.3.6",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/flush-write-stream/node_modules/string_decoder": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/forever-agent": {
+            "version": "0.6.1",
+            "inBundle": true,
+            "license": "Apache-2.0",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/npm/node_modules/form-data": {
+            "version": "2.3.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "asynckit": "^0.4.0",
+                "combined-stream": "1.0.6",
+                "mime-types": "^2.1.12"
+            },
+            "engines": {
+                "node": ">= 0.12"
+            }
+        },
+        "node_modules/npm/node_modules/from2": {
+            "version": "2.3.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "inherits": "^2.0.1",
+                "readable-stream": "^2.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/from2/node_modules/readable-stream": {
+            "version": "2.3.6",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/from2/node_modules/string_decoder": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/fs-minipass": {
+            "version": "1.2.7",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "minipass": "^2.6.0"
+            }
+        },
+        "node_modules/npm/node_modules/fs-minipass/node_modules/minipass": {
+            "version": "2.9.0",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "safe-buffer": "^5.1.2",
+                "yallist": "^3.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/fs-vacuum": {
+            "version": "1.2.10",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "graceful-fs": "^4.1.2",
+                "path-is-inside": "^1.0.1",
+                "rimraf": "^2.5.2"
+            }
+        },
+        "node_modules/npm/node_modules/fs-write-stream-atomic": {
+            "version": "1.0.10",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "graceful-fs": "^4.1.2",
+                "iferr": "^0.1.5",
+                "imurmurhash": "^0.1.4",
+                "readable-stream": "1 || 2"
+            }
+        },
+        "node_modules/npm/node_modules/fs-write-stream-atomic/node_modules/iferr": {
+            "version": "0.1.5",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/fs-write-stream-atomic/node_modules/readable-stream": {
+            "version": "2.3.6",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/fs-write-stream-atomic/node_modules/string_decoder": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/fs.realpath": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/function-bind": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/gauge": {
+            "version": "2.7.4",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "aproba": "^1.0.3",
+                "console-control-strings": "^1.0.0",
+                "has-unicode": "^2.0.0",
+                "object-assign": "^4.1.0",
+                "signal-exit": "^3.0.0",
+                "string-width": "^1.0.1",
+                "strip-ansi": "^3.0.1",
+                "wide-align": "^1.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/gauge/node_modules/aproba": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/gauge/node_modules/string-width": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "code-point-at": "^1.0.0",
+                "is-fullwidth-code-point": "^1.0.0",
+                "strip-ansi": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/genfun": {
+            "version": "5.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/gentle-fs": {
+            "version": "2.3.0",
+            "inBundle": true,
+            "license": "Artistic-2.0",
+            "dependencies": {
+                "aproba": "^1.1.2",
+                "chownr": "^1.1.2",
+                "cmd-shim": "^3.0.3",
+                "fs-vacuum": "^1.2.10",
+                "graceful-fs": "^4.1.11",
+                "iferr": "^0.1.5",
+                "infer-owner": "^1.0.4",
+                "mkdirp": "^0.5.1",
+                "path-is-inside": "^1.0.2",
+                "read-cmd-shim": "^1.0.1",
+                "slide": "^1.1.6"
+            }
+        },
+        "node_modules/npm/node_modules/gentle-fs/node_modules/aproba": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/gentle-fs/node_modules/iferr": {
+            "version": "0.1.5",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/get-caller-file": {
+            "version": "1.0.3",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/get-stream": {
+            "version": "4.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "pump": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/getpass": {
+            "version": "0.1.7",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "assert-plus": "^1.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/glob": {
+            "version": "7.1.6",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "fs.realpath": "^1.0.0",
+                "inflight": "^1.0.4",
+                "inherits": "2",
+                "minimatch": "^3.0.4",
+                "once": "^1.3.0",
+                "path-is-absolute": "^1.0.0"
+            },
+            "engines": {
+                "node": "*"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/isaacs"
+            }
+        },
+        "node_modules/npm/node_modules/global-dirs": {
+            "version": "0.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "ini": "^1.3.4"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/got": {
+            "version": "6.7.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "create-error-class": "^3.0.0",
+                "duplexer3": "^0.1.4",
+                "get-stream": "^3.0.0",
+                "is-redirect": "^1.0.0",
+                "is-retry-allowed": "^1.0.0",
+                "is-stream": "^1.0.0",
+                "lowercase-keys": "^1.0.0",
+                "safe-buffer": "^5.0.1",
+                "timed-out": "^4.0.0",
+                "unzip-response": "^2.0.1",
+                "url-parse-lax": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/got/node_modules/get-stream": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/graceful-fs": {
+            "version": "4.2.4",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/har-schema": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "ISC",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/har-validator": {
+            "version": "5.1.0",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "ajv": "^5.3.0",
+                "har-schema": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/has": {
+            "version": "1.0.3",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "function-bind": "^1.1.1"
+            },
+            "engines": {
+                "node": ">= 0.4.0"
+            }
+        },
+        "node_modules/npm/node_modules/has-flag": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/has-symbols": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/npm/node_modules/has-unicode": {
+            "version": "2.0.1",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/hosted-git-info": {
+            "version": "2.8.8",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/http-cache-semantics": {
+            "version": "3.8.1",
+            "inBundle": true,
+            "license": "BSD-2-Clause"
+        },
+        "node_modules/npm/node_modules/http-proxy-agent": {
+            "version": "2.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "agent-base": "4",
+                "debug": "3.1.0"
+            },
+            "engines": {
+                "node": ">= 4.5.0"
+            }
+        },
+        "node_modules/npm/node_modules/http-signature": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "assert-plus": "^1.0.0",
+                "jsprim": "^1.2.2",
+                "sshpk": "^1.7.0"
+            },
+            "engines": {
+                "node": ">=0.8",
+                "npm": ">=1.3.7"
+            }
+        },
+        "node_modules/npm/node_modules/https-proxy-agent": {
+            "version": "2.2.4",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "agent-base": "^4.3.0",
+                "debug": "^3.1.0"
+            },
+            "engines": {
+                "node": ">= 4.5.0"
+            }
+        },
+        "node_modules/npm/node_modules/humanize-ms": {
+            "version": "1.2.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "ms": "^2.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/iconv-lite": {
+            "version": "0.4.23",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "safer-buffer": ">= 2.1.2 < 3"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/iferr": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=6.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/ignore-walk": {
+            "version": "3.0.3",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "minimatch": "^3.0.4"
+            }
+        },
+        "node_modules/npm/node_modules/import-lazy": {
+            "version": "2.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/imurmurhash": {
+            "version": "0.1.4",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.8.19"
+            }
+        },
+        "node_modules/npm/node_modules/infer-owner": {
+            "version": "1.0.4",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/inflight": {
+            "version": "1.0.6",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "once": "^1.3.0",
+                "wrappy": "1"
+            }
+        },
+        "node_modules/npm/node_modules/inherits": {
+            "version": "2.0.4",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/ini": {
+            "version": "1.3.5",
+            "inBundle": true,
+            "license": "ISC",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/npm/node_modules/init-package-json": {
+            "version": "1.10.3",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "glob": "^7.1.1",
+                "npm-package-arg": "^4.0.0 || ^5.0.0 || ^6.0.0",
+                "promzard": "^0.3.0",
+                "read": "~1.0.1",
+                "read-package-json": "1 || 2",
+                "semver": "2.x || 3.x || 4 || 5",
+                "validate-npm-package-license": "^3.0.1",
+                "validate-npm-package-name": "^3.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/invert-kv": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/ip": {
+            "version": "1.1.5",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/ip-regex": {
+            "version": "2.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/is-callable": {
+            "version": "1.1.4",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/npm/node_modules/is-ci": {
+            "version": "1.2.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "ci-info": "^1.5.0"
+            },
+            "bin": {
+                "is-ci": "bin.js"
+            }
+        },
+        "node_modules/npm/node_modules/is-ci/node_modules/ci-info": {
+            "version": "1.6.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/is-cidr": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "BSD-2-Clause",
+            "dependencies": {
+                "cidr-regex": "^2.0.10"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/is-date-object": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/npm/node_modules/is-fullwidth-code-point": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "number-is-nan": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/is-installed-globally": {
+            "version": "0.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "global-dirs": "^0.1.0",
+                "is-path-inside": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/is-npm": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/is-obj": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/is-path-inside": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "path-is-inside": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/is-redirect": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/is-regex": {
+            "version": "1.0.4",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "has": "^1.0.1"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/npm/node_modules/is-retry-allowed": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/is-stream": {
+            "version": "1.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/is-symbol": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "has-symbols": "^1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/npm/node_modules/is-typedarray": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/isarray": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/isexe": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/isstream": {
+            "version": "0.1.2",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/jsbn": {
+            "version": "0.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "optional": true
+        },
+        "node_modules/npm/node_modules/json-parse-better-errors": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/json-schema": {
+            "version": "0.2.3",
+            "inBundle": true
+        },
+        "node_modules/npm/node_modules/json-schema-traverse": {
+            "version": "0.3.1",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/json-stringify-safe": {
+            "version": "5.0.1",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/jsonparse": {
+            "version": "1.3.1",
+            "engines": [
+                "node >= 0.2.0"
+            ],
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/JSONStream": {
+            "version": "1.3.5",
+            "inBundle": true,
+            "license": "(MIT OR Apache-2.0)",
+            "dependencies": {
+                "jsonparse": "^1.2.0",
+                "through": ">=2.2.7 <3"
+            },
+            "bin": {
+                "JSONStream": "bin.js"
+            },
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/npm/node_modules/jsprim": {
+            "version": "1.4.1",
+            "engines": [
+                "node >=0.6.0"
+            ],
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "assert-plus": "1.0.0",
+                "extsprintf": "1.3.0",
+                "json-schema": "0.2.3",
+                "verror": "1.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/latest-version": {
+            "version": "3.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "package-json": "^4.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/lazy-property": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/lcid": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "invert-kv": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/libcipm": {
+            "version": "4.0.7",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "bin-links": "^1.1.2",
+                "bluebird": "^3.5.1",
+                "figgy-pudding": "^3.5.1",
+                "find-npm-prefix": "^1.0.2",
+                "graceful-fs": "^4.1.11",
+                "ini": "^1.3.5",
+                "lock-verify": "^2.0.2",
+                "mkdirp": "^0.5.1",
+                "npm-lifecycle": "^3.0.0",
+                "npm-logical-tree": "^1.2.1",
+                "npm-package-arg": "^6.1.0",
+                "pacote": "^9.1.0",
+                "read-package-json": "^2.0.13",
+                "rimraf": "^2.6.2",
+                "worker-farm": "^1.6.0"
+            }
+        },
+        "node_modules/npm/node_modules/libnpm": {
+            "version": "3.0.1",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "bin-links": "^1.1.2",
+                "bluebird": "^3.5.3",
+                "find-npm-prefix": "^1.0.2",
+                "libnpmaccess": "^3.0.2",
+                "libnpmconfig": "^1.2.1",
+                "libnpmhook": "^5.0.3",
+                "libnpmorg": "^1.0.1",
+                "libnpmpublish": "^1.1.2",
+                "libnpmsearch": "^2.0.2",
+                "libnpmteam": "^1.0.2",
+                "lock-verify": "^2.0.2",
+                "npm-lifecycle": "^3.0.0",
+                "npm-logical-tree": "^1.2.1",
+                "npm-package-arg": "^6.1.0",
+                "npm-profile": "^4.0.2",
+                "npm-registry-fetch": "^4.0.0",
+                "npmlog": "^4.1.2",
+                "pacote": "^9.5.3",
+                "read-package-json": "^2.0.13",
+                "stringify-package": "^1.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/libnpmaccess": {
+            "version": "3.0.2",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "aproba": "^2.0.0",
+                "get-stream": "^4.0.0",
+                "npm-package-arg": "^6.1.0",
+                "npm-registry-fetch": "^4.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/libnpmconfig": {
+            "version": "1.2.1",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "figgy-pudding": "^3.5.1",
+                "find-up": "^3.0.0",
+                "ini": "^1.3.5"
+            }
+        },
+        "node_modules/npm/node_modules/libnpmconfig/node_modules/find-up": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "locate-path": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/libnpmconfig/node_modules/locate-path": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "p-locate": "^3.0.0",
+                "path-exists": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/libnpmconfig/node_modules/p-limit": {
+            "version": "2.2.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "p-try": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/libnpmconfig/node_modules/p-locate": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "p-limit": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/libnpmconfig/node_modules/p-try": {
+            "version": "2.2.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/libnpmhook": {
+            "version": "5.0.3",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "aproba": "^2.0.0",
+                "figgy-pudding": "^3.4.1",
+                "get-stream": "^4.0.0",
+                "npm-registry-fetch": "^4.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/libnpmorg": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "aproba": "^2.0.0",
+                "figgy-pudding": "^3.4.1",
+                "get-stream": "^4.0.0",
+                "npm-registry-fetch": "^4.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/libnpmpublish": {
+            "version": "1.1.2",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "aproba": "^2.0.0",
+                "figgy-pudding": "^3.5.1",
+                "get-stream": "^4.0.0",
+                "lodash.clonedeep": "^4.5.0",
+                "normalize-package-data": "^2.4.0",
+                "npm-package-arg": "^6.1.0",
+                "npm-registry-fetch": "^4.0.0",
+                "semver": "^5.5.1",
+                "ssri": "^6.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/libnpmsearch": {
+            "version": "2.0.2",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "figgy-pudding": "^3.5.1",
+                "get-stream": "^4.0.0",
+                "npm-registry-fetch": "^4.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/libnpmteam": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "aproba": "^2.0.0",
+                "figgy-pudding": "^3.4.1",
+                "get-stream": "^4.0.0",
+                "npm-registry-fetch": "^4.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/libnpx": {
+            "version": "10.2.2",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "dotenv": "^5.0.1",
+                "npm-package-arg": "^6.0.0",
+                "rimraf": "^2.6.2",
+                "safe-buffer": "^5.1.0",
+                "update-notifier": "^2.3.0",
+                "which": "^1.3.0",
+                "y18n": "^4.0.0",
+                "yargs": "^11.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/locate-path": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "p-locate": "^2.0.0",
+                "path-exists": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/lock-verify": {
+            "version": "2.1.0",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "npm-package-arg": "^6.1.0",
+                "semver": "^5.4.1"
+            }
+        },
+        "node_modules/npm/node_modules/lockfile": {
+            "version": "1.0.4",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "signal-exit": "^3.0.2"
+            }
+        },
+        "node_modules/npm/node_modules/lodash._baseindexof": {
+            "version": "3.1.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/lodash._baseuniq": {
+            "version": "4.6.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "lodash._createset": "~4.0.0",
+                "lodash._root": "~3.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/lodash._bindcallback": {
+            "version": "3.0.1",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/lodash._cacheindexof": {
+            "version": "3.0.2",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/lodash._createcache": {
+            "version": "3.1.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "lodash._getnative": "^3.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/lodash._createset": {
+            "version": "4.0.3",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/lodash._getnative": {
+            "version": "3.9.1",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/lodash._root": {
+            "version": "3.0.1",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/lodash.clonedeep": {
+            "version": "4.5.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/lodash.restparam": {
+            "version": "3.6.1",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/lodash.union": {
+            "version": "4.6.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/lodash.uniq": {
+            "version": "4.5.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/lodash.without": {
+            "version": "4.4.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/lowercase-keys": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/lru-cache": {
+            "version": "5.1.1",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "yallist": "^3.0.2"
+            }
+        },
+        "node_modules/npm/node_modules/make-dir": {
+            "version": "1.3.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "pify": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/make-fetch-happen": {
+            "version": "5.0.2",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "agentkeepalive": "^3.4.1",
+                "cacache": "^12.0.0",
+                "http-cache-semantics": "^3.8.1",
+                "http-proxy-agent": "^2.1.0",
+                "https-proxy-agent": "^2.2.3",
+                "lru-cache": "^5.1.1",
+                "mississippi": "^3.0.0",
+                "node-fetch-npm": "^2.0.2",
+                "promise-retry": "^1.1.1",
+                "socks-proxy-agent": "^4.0.0",
+                "ssri": "^6.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/map-age-cleaner": {
+            "version": "0.1.3",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "p-defer": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/meant": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/mem": {
+            "version": "4.3.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "map-age-cleaner": "^0.1.1",
+                "mimic-fn": "^2.0.0",
+                "p-is-promise": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/mem/node_modules/mimic-fn": {
+            "version": "2.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/mime-db": {
+            "version": "1.35.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/npm/node_modules/mime-types": {
+            "version": "2.1.19",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "mime-db": "~1.35.0"
+            },
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/npm/node_modules/minimatch": {
+            "version": "3.0.4",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "brace-expansion": "^1.1.7"
+            },
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/npm/node_modules/minizlib": {
+            "version": "1.3.3",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "minipass": "^2.9.0"
+            }
+        },
+        "node_modules/npm/node_modules/minizlib/node_modules/minipass": {
+            "version": "2.9.0",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "safe-buffer": "^5.1.2",
+                "yallist": "^3.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/mississippi": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "BSD-2-Clause",
+            "dependencies": {
+                "concat-stream": "^1.5.0",
+                "duplexify": "^3.4.2",
+                "end-of-stream": "^1.1.0",
+                "flush-write-stream": "^1.0.0",
+                "from2": "^2.1.0",
+                "parallel-transform": "^1.1.0",
+                "pump": "^3.0.0",
+                "pumpify": "^1.3.3",
+                "stream-each": "^1.1.0",
+                "through2": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/mkdirp": {
+            "version": "0.5.5",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "minimist": "^1.2.5"
+            },
+            "bin": {
+                "mkdirp": "bin/cmd.js"
+            }
+        },
+        "node_modules/npm/node_modules/mkdirp/node_modules/minimist": {
+            "version": "1.2.5",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/move-concurrently": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "aproba": "^1.1.1",
+                "copy-concurrently": "^1.0.0",
+                "fs-write-stream-atomic": "^1.0.8",
+                "mkdirp": "^0.5.1",
+                "rimraf": "^2.5.4",
+                "run-queue": "^1.0.3"
+            }
+        },
+        "node_modules/npm/node_modules/move-concurrently/node_modules/aproba": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/ms": {
+            "version": "2.1.1",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/mute-stream": {
+            "version": "0.0.7",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/nice-try": {
+            "version": "1.0.5",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/node-fetch-npm": {
+            "version": "2.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "encoding": "^0.1.11",
+                "json-parse-better-errors": "^1.0.0",
+                "safe-buffer": "^5.1.1"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/node-gyp": {
+            "version": "5.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "env-paths": "^2.2.0",
+                "glob": "^7.1.4",
+                "graceful-fs": "^4.2.2",
+                "mkdirp": "^0.5.1",
+                "nopt": "^4.0.1",
+                "npmlog": "^4.1.2",
+                "request": "^2.88.0",
+                "rimraf": "^2.6.3",
+                "semver": "^5.7.1",
+                "tar": "^4.4.12",
+                "which": "^1.3.1"
+            },
+            "bin": {
+                "node-gyp": "bin/node-gyp.js"
+            },
+            "engines": {
+                "node": ">= 6.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/nopt": {
+            "version": "4.0.3",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "abbrev": "1",
+                "osenv": "^0.1.4"
+            },
+            "bin": {
+                "nopt": "bin/nopt.js"
+            }
+        },
+        "node_modules/npm/node_modules/normalize-package-data": {
+            "version": "2.5.0",
+            "inBundle": true,
+            "license": "BSD-2-Clause",
+            "dependencies": {
+                "hosted-git-info": "^2.1.4",
+                "resolve": "^1.10.0",
+                "semver": "2 || 3 || 4 || 5",
+                "validate-npm-package-license": "^3.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/normalize-package-data/node_modules/resolve": {
+            "version": "1.10.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "path-parse": "^1.0.6"
+            }
+        },
+        "node_modules/npm/node_modules/npm-audit-report": {
+            "version": "1.3.2",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "cli-table3": "^0.5.0",
+                "console-control-strings": "^1.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/npm-bundled": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "npm-normalize-package-bin": "^1.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/npm-cache-filename": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/npm-install-checks": {
+            "version": "3.0.2",
+            "inBundle": true,
+            "license": "BSD-2-Clause",
+            "dependencies": {
+                "semver": "^2.3.0 || 3.x || 4 || 5"
+            }
+        },
+        "node_modules/npm/node_modules/npm-lifecycle": {
+            "version": "3.1.4",
+            "inBundle": true,
+            "license": "Artistic-2.0",
+            "dependencies": {
+                "byline": "^5.0.0",
+                "graceful-fs": "^4.1.15",
+                "node-gyp": "^5.0.2",
+                "resolve-from": "^4.0.0",
+                "slide": "^1.1.6",
+                "uid-number": "0.0.6",
+                "umask": "^1.1.0",
+                "which": "^1.3.1"
+            }
+        },
+        "node_modules/npm/node_modules/npm-logical-tree": {
+            "version": "1.2.1",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/npm-normalize-package-bin": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/npm-package-arg": {
+            "version": "6.1.1",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "hosted-git-info": "^2.7.1",
+                "osenv": "^0.1.5",
+                "semver": "^5.6.0",
+                "validate-npm-package-name": "^3.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/npm-packlist": {
+            "version": "1.4.8",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "ignore-walk": "^3.0.1",
+                "npm-bundled": "^1.0.1",
+                "npm-normalize-package-bin": "^1.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/npm-pick-manifest": {
+            "version": "3.0.2",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "figgy-pudding": "^3.5.1",
+                "npm-package-arg": "^6.0.0",
+                "semver": "^5.4.1"
+            }
+        },
+        "node_modules/npm/node_modules/npm-profile": {
+            "version": "4.0.4",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "aproba": "^1.1.2 || 2",
+                "figgy-pudding": "^3.4.1",
+                "npm-registry-fetch": "^4.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/npm-registry-fetch": {
+            "version": "4.0.4",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "bluebird": "^3.5.1",
+                "figgy-pudding": "^3.4.1",
+                "JSONStream": "^1.3.4",
+                "lru-cache": "^5.1.1",
+                "make-fetch-happen": "^5.0.0",
+                "npm-package-arg": "^6.1.0",
+                "safe-buffer": "^5.2.0"
+            }
+        },
+        "node_modules/npm/node_modules/npm-registry-fetch/node_modules/safe-buffer": {
+            "version": "5.2.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/npm-run-path": {
+            "version": "2.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "path-key": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/npm-user-validate": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "BSD-2-Clause"
+        },
+        "node_modules/npm/node_modules/npmlog": {
+            "version": "4.1.2",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "are-we-there-yet": "~1.1.2",
+                "console-control-strings": "~1.1.0",
+                "gauge": "~2.7.3",
+                "set-blocking": "~2.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/number-is-nan": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/oauth-sign": {
+            "version": "0.9.0",
+            "inBundle": true,
+            "license": "Apache-2.0",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/npm/node_modules/object-assign": {
+            "version": "4.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/object-keys": {
+            "version": "1.0.12",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/npm/node_modules/object.getownpropertydescriptors": {
+            "version": "2.0.3",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "define-properties": "^1.1.2",
+                "es-abstract": "^1.5.1"
+            },
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/npm/node_modules/once": {
+            "version": "1.4.0",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "wrappy": "1"
+            }
+        },
+        "node_modules/npm/node_modules/opener": {
+            "version": "1.5.1",
+            "inBundle": true,
+            "license": "(WTFPL OR MIT)",
+            "bin": {
+                "opener": "bin/opener-bin.js"
+            }
+        },
+        "node_modules/npm/node_modules/os-homedir": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/os-locale": {
+            "version": "3.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "execa": "^1.0.0",
+                "lcid": "^2.0.0",
+                "mem": "^4.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/os-locale/node_modules/cross-spawn": {
+            "version": "6.0.5",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "nice-try": "^1.0.4",
+                "path-key": "^2.0.1",
+                "semver": "^5.5.0",
+                "shebang-command": "^1.2.0",
+                "which": "^1.2.9"
+            },
+            "engines": {
+                "node": ">=4.8"
+            }
+        },
+        "node_modules/npm/node_modules/os-locale/node_modules/execa": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "cross-spawn": "^6.0.0",
+                "get-stream": "^4.0.0",
+                "is-stream": "^1.1.0",
+                "npm-run-path": "^2.0.0",
+                "p-finally": "^1.0.0",
+                "signal-exit": "^3.0.0",
+                "strip-eof": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/os-tmpdir": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/osenv": {
+            "version": "0.1.5",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "os-homedir": "^1.0.0",
+                "os-tmpdir": "^1.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/p-defer": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/p-finally": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/p-is-promise": {
+            "version": "2.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/p-limit": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "p-try": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/p-locate": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "p-limit": "^1.1.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/p-try": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/package-json": {
+            "version": "4.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "got": "^6.7.1",
+                "registry-auth-token": "^3.0.1",
+                "registry-url": "^3.0.3",
+                "semver": "^5.1.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/pacote": {
+            "version": "9.5.12",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "bluebird": "^3.5.3",
+                "cacache": "^12.0.2",
+                "chownr": "^1.1.2",
+                "figgy-pudding": "^3.5.1",
+                "get-stream": "^4.1.0",
+                "glob": "^7.1.3",
+                "infer-owner": "^1.0.4",
+                "lru-cache": "^5.1.1",
+                "make-fetch-happen": "^5.0.0",
+                "minimatch": "^3.0.4",
+                "minipass": "^2.3.5",
+                "mississippi": "^3.0.0",
+                "mkdirp": "^0.5.1",
+                "normalize-package-data": "^2.4.0",
+                "npm-normalize-package-bin": "^1.0.0",
+                "npm-package-arg": "^6.1.0",
+                "npm-packlist": "^1.1.12",
+                "npm-pick-manifest": "^3.0.0",
+                "npm-registry-fetch": "^4.0.0",
+                "osenv": "^0.1.5",
+                "promise-inflight": "^1.0.1",
+                "promise-retry": "^1.1.1",
+                "protoduck": "^5.0.1",
+                "rimraf": "^2.6.2",
+                "safe-buffer": "^5.1.2",
+                "semver": "^5.6.0",
+                "ssri": "^6.0.1",
+                "tar": "^4.4.10",
+                "unique-filename": "^1.1.1",
+                "which": "^1.3.1"
+            }
+        },
+        "node_modules/npm/node_modules/pacote/node_modules/minipass": {
+            "version": "2.9.0",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "safe-buffer": "^5.1.2",
+                "yallist": "^3.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/parallel-transform": {
+            "version": "1.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "cyclist": "~0.2.2",
+                "inherits": "^2.0.3",
+                "readable-stream": "^2.1.5"
+            }
+        },
+        "node_modules/npm/node_modules/parallel-transform/node_modules/readable-stream": {
+            "version": "2.3.6",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/parallel-transform/node_modules/string_decoder": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/path-exists": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/path-is-absolute": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/path-is-inside": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "(WTFPL OR MIT)"
+        },
+        "node_modules/npm/node_modules/path-key": {
+            "version": "2.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/path-parse": {
+            "version": "1.0.6",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/performance-now": {
+            "version": "2.1.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/pify": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/prepend-http": {
+            "version": "1.0.4",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/process-nextick-args": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/promise-inflight": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/promise-retry": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "err-code": "^1.0.0",
+                "retry": "^0.10.0"
+            },
+            "engines": {
+                "node": ">=0.12"
+            }
+        },
+        "node_modules/npm/node_modules/promise-retry/node_modules/retry": {
+            "version": "0.10.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/npm/node_modules/promzard": {
+            "version": "0.3.0",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "read": "1"
+            }
+        },
+        "node_modules/npm/node_modules/proto-list": {
+            "version": "1.2.4",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/protoduck": {
+            "version": "5.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "genfun": "^5.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/prr": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/pseudomap": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/psl": {
+            "version": "1.1.29",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/pump": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "end-of-stream": "^1.1.0",
+                "once": "^1.3.1"
+            }
+        },
+        "node_modules/npm/node_modules/pumpify": {
+            "version": "1.5.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "duplexify": "^3.6.0",
+                "inherits": "^2.0.3",
+                "pump": "^2.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/pumpify/node_modules/pump": {
+            "version": "2.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "end-of-stream": "^1.1.0",
+                "once": "^1.3.1"
+            }
+        },
+        "node_modules/npm/node_modules/punycode": {
+            "version": "1.4.1",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/qrcode-terminal": {
+            "version": "0.12.0",
+            "inBundle": true,
+            "bin": {
+                "qrcode-terminal": "bin/qrcode-terminal.js"
+            }
+        },
+        "node_modules/npm/node_modules/qs": {
+            "version": "6.5.2",
+            "inBundle": true,
+            "license": "BSD-3-Clause",
+            "engines": {
+                "node": ">=0.6"
+            }
+        },
+        "node_modules/npm/node_modules/query-string": {
+            "version": "6.8.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "decode-uri-component": "^0.2.0",
+                "split-on-first": "^1.0.0",
+                "strict-uri-encode": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/qw": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/rc": {
+            "version": "1.2.8",
+            "inBundle": true,
+            "license": "(BSD-2-Clause OR MIT OR Apache-2.0)",
+            "dependencies": {
+                "deep-extend": "^0.6.0",
+                "ini": "~1.3.0",
+                "minimist": "^1.2.0",
+                "strip-json-comments": "~2.0.1"
+            },
+            "bin": {
+                "rc": "cli.js"
+            }
+        },
+        "node_modules/npm/node_modules/rc/node_modules/minimist": {
+            "version": "1.2.5",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/read": {
+            "version": "1.0.7",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "mute-stream": "~0.0.4"
+            },
+            "engines": {
+                "node": ">=0.8"
+            }
+        },
+        "node_modules/npm/node_modules/read-cmd-shim": {
+            "version": "1.0.5",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "graceful-fs": "^4.1.2"
+            }
+        },
+        "node_modules/npm/node_modules/read-installed": {
+            "version": "4.0.3",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "debuglog": "^1.0.1",
+                "read-package-json": "^2.0.0",
+                "readdir-scoped-modules": "^1.0.0",
+                "semver": "2 || 3 || 4 || 5",
+                "slide": "~1.1.3",
+                "util-extend": "^1.0.1"
+            },
+            "optionalDependencies": {
+                "graceful-fs": "^4.1.2"
+            }
+        },
+        "node_modules/npm/node_modules/read-package-json": {
+            "version": "2.1.1",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "glob": "^7.1.1",
+                "json-parse-better-errors": "^1.0.1",
+                "normalize-package-data": "^2.0.0",
+                "npm-normalize-package-bin": "^1.0.0"
+            },
+            "optionalDependencies": {
+                "graceful-fs": "^4.1.2"
+            }
+        },
+        "node_modules/npm/node_modules/read-package-tree": {
+            "version": "5.3.1",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "read-package-json": "^2.0.0",
+                "readdir-scoped-modules": "^1.0.0",
+                "util-promisify": "^2.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/readable-stream": {
+            "version": "3.6.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "inherits": "^2.0.3",
+                "string_decoder": "^1.1.1",
+                "util-deprecate": "^1.0.1"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/npm/node_modules/readdir-scoped-modules": {
+            "version": "1.1.0",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "debuglog": "^1.0.1",
+                "dezalgo": "^1.0.0",
+                "graceful-fs": "^4.1.2",
+                "once": "^1.3.0"
+            }
+        },
+        "node_modules/npm/node_modules/registry-auth-token": {
+            "version": "3.4.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "rc": "^1.1.6",
+                "safe-buffer": "^5.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/registry-url": {
+            "version": "3.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "rc": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/request": {
+            "version": "2.88.0",
+            "inBundle": true,
+            "license": "Apache-2.0",
+            "dependencies": {
+                "aws-sign2": "~0.7.0",
+                "aws4": "^1.8.0",
+                "caseless": "~0.12.0",
+                "combined-stream": "~1.0.6",
+                "extend": "~3.0.2",
+                "forever-agent": "~0.6.1",
+                "form-data": "~2.3.2",
+                "har-validator": "~5.1.0",
+                "http-signature": "~1.2.0",
+                "is-typedarray": "~1.0.0",
+                "isstream": "~0.1.2",
+                "json-stringify-safe": "~5.0.1",
+                "mime-types": "~2.1.19",
+                "oauth-sign": "~0.9.0",
+                "performance-now": "^2.1.0",
+                "qs": "~6.5.2",
+                "safe-buffer": "^5.1.2",
+                "tough-cookie": "~2.4.3",
+                "tunnel-agent": "^0.6.0",
+                "uuid": "^3.3.2"
+            },
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/npm/node_modules/require-directory": {
+            "version": "2.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/require-main-filename": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/resolve-from": {
+            "version": "4.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/retry": {
+            "version": "0.12.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/npm/node_modules/rimraf": {
+            "version": "2.7.1",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/npm/node_modules/run-queue": {
+            "version": "1.0.3",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "aproba": "^1.1.1"
+            }
+        },
+        "node_modules/npm/node_modules/run-queue/node_modules/aproba": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/safe-buffer": {
+            "version": "5.1.2",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/safer-buffer": {
+            "version": "2.1.2",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/semver": {
+            "version": "5.7.1",
+            "inBundle": true,
+            "license": "ISC",
+            "bin": {
+                "semver": "bin/semver"
+            }
+        },
+        "node_modules/npm/node_modules/semver-diff": {
+            "version": "2.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "semver": "^5.0.3"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/set-blocking": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/sha": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "(BSD-2-Clause OR MIT)",
+            "dependencies": {
+                "graceful-fs": "^4.1.2"
+            }
+        },
+        "node_modules/npm/node_modules/shebang-command": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "shebang-regex": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/shebang-regex": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/signal-exit": {
+            "version": "3.0.2",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/slide": {
+            "version": "1.1.6",
+            "inBundle": true,
+            "license": "ISC",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/npm/node_modules/smart-buffer": {
+            "version": "4.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">= 6.0.0",
+                "npm": ">= 3.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/socks": {
+            "version": "2.3.3",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "ip": "1.1.5",
+                "smart-buffer": "^4.1.0"
+            },
+            "engines": {
+                "node": ">= 6.0.0",
+                "npm": ">= 3.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/socks-proxy-agent": {
+            "version": "4.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "agent-base": "~4.2.1",
+                "socks": "~2.3.2"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/npm/node_modules/socks-proxy-agent/node_modules/agent-base": {
+            "version": "4.2.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "es6-promisify": "^5.0.0"
+            },
+            "engines": {
+                "node": ">= 4.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/sorted-object": {
+            "version": "2.0.1",
+            "inBundle": true,
+            "license": "(WTFPL OR MIT)"
+        },
+        "node_modules/npm/node_modules/sorted-union-stream": {
+            "version": "2.1.3",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "from2": "^1.3.0",
+                "stream-iterate": "^1.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/sorted-union-stream/node_modules/from2": {
+            "version": "1.3.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "inherits": "~2.0.1",
+                "readable-stream": "~1.1.10"
+            }
+        },
+        "node_modules/npm/node_modules/sorted-union-stream/node_modules/isarray": {
+            "version": "0.0.1",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/sorted-union-stream/node_modules/readable-stream": {
+            "version": "1.1.14",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.1",
+                "isarray": "0.0.1",
+                "string_decoder": "~0.10.x"
+            }
+        },
+        "node_modules/npm/node_modules/sorted-union-stream/node_modules/string_decoder": {
+            "version": "0.10.31",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/spdx-correct": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "Apache-2.0",
+            "dependencies": {
+                "spdx-expression-parse": "^3.0.0",
+                "spdx-license-ids": "^3.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/spdx-exceptions": {
+            "version": "2.1.0",
+            "inBundle": true,
+            "license": "CC-BY-3.0"
+        },
+        "node_modules/npm/node_modules/spdx-expression-parse": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "spdx-exceptions": "^2.1.0",
+                "spdx-license-ids": "^3.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/spdx-license-ids": {
+            "version": "3.0.3",
+            "inBundle": true,
+            "license": "CC0-1.0"
+        },
+        "node_modules/npm/node_modules/split-on-first": {
+            "version": "1.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/npm/node_modules/sshpk": {
+            "version": "1.14.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "asn1": "~0.2.3",
+                "assert-plus": "^1.0.0",
+                "dashdash": "^1.12.0",
+                "getpass": "^0.1.1",
+                "safer-buffer": "^2.0.2"
+            },
+            "bin": {
+                "sshpk-conv": "bin/sshpk-conv",
+                "sshpk-sign": "bin/sshpk-sign",
+                "sshpk-verify": "bin/sshpk-verify"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            },
+            "optionalDependencies": {
+                "bcrypt-pbkdf": "^1.0.0",
+                "ecc-jsbn": "~0.1.1",
+                "jsbn": "~0.1.0",
+                "tweetnacl": "~0.14.0"
+            }
+        },
+        "node_modules/npm/node_modules/ssri": {
+            "version": "6.0.1",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "figgy-pudding": "^3.5.1"
+            }
+        },
+        "node_modules/npm/node_modules/stream-each": {
+            "version": "1.2.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "end-of-stream": "^1.1.0",
+                "stream-shift": "^1.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/stream-iterate": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "readable-stream": "^2.1.5",
+                "stream-shift": "^1.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/stream-iterate/node_modules/readable-stream": {
+            "version": "2.3.6",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/stream-iterate/node_modules/string_decoder": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/stream-shift": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/strict-uri-encode": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/string_decoder": {
+            "version": "1.3.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "safe-buffer": "~5.2.0"
+            }
+        },
+        "node_modules/npm/node_modules/string_decoder/node_modules/safe-buffer": {
+            "version": "5.2.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/string-width": {
+            "version": "2.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "is-fullwidth-code-point": "^2.0.0",
+                "strip-ansi": "^4.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/string-width/node_modules/ansi-regex": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/string-width/node_modules/is-fullwidth-code-point": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/string-width/node_modules/strip-ansi": {
+            "version": "4.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "ansi-regex": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/stringify-package": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/strip-ansi": {
+            "version": "3.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "ansi-regex": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/strip-eof": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/strip-json-comments": {
+            "version": "2.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/supports-color": {
+            "version": "5.4.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "has-flag": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/tar": {
+            "version": "4.4.13",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "chownr": "^1.1.1",
+                "fs-minipass": "^1.2.5",
+                "minipass": "^2.8.6",
+                "minizlib": "^1.2.1",
+                "mkdirp": "^0.5.0",
+                "safe-buffer": "^5.1.2",
+                "yallist": "^3.0.3"
+            },
+            "engines": {
+                "node": ">=4.5"
+            }
+        },
+        "node_modules/npm/node_modules/tar/node_modules/minipass": {
+            "version": "2.9.0",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "safe-buffer": "^5.1.2",
+                "yallist": "^3.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/term-size": {
+            "version": "1.2.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "execa": "^0.7.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/text-table": {
+            "version": "0.2.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/through": {
+            "version": "2.3.8",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/through2": {
+            "version": "2.0.3",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "readable-stream": "^2.1.5",
+                "xtend": "~4.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/through2/node_modules/readable-stream": {
+            "version": "2.3.6",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/npm/node_modules/through2/node_modules/string_decoder": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/timed-out": {
+            "version": "4.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/tiny-relative-date": {
+            "version": "1.3.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/tough-cookie": {
+            "version": "2.4.3",
+            "inBundle": true,
+            "license": "BSD-3-Clause",
+            "dependencies": {
+                "psl": "^1.1.24",
+                "punycode": "^1.4.1"
+            },
+            "engines": {
+                "node": ">=0.8"
+            }
+        },
+        "node_modules/npm/node_modules/tunnel-agent": {
+            "version": "0.6.0",
+            "inBundle": true,
+            "license": "Apache-2.0",
+            "dependencies": {
+                "safe-buffer": "^5.0.1"
+            },
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/npm/node_modules/tweetnacl": {
+            "version": "0.14.5",
+            "inBundle": true,
+            "license": "Unlicense",
+            "optional": true
+        },
+        "node_modules/npm/node_modules/typedarray": {
+            "version": "0.0.6",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/uid-number": {
+            "version": "0.0.6",
+            "inBundle": true,
+            "license": "ISC",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/npm/node_modules/umask": {
+            "version": "1.1.0",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/unique-filename": {
+            "version": "1.1.1",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "unique-slug": "^2.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/unique-slug": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "imurmurhash": "^0.1.4"
+            }
+        },
+        "node_modules/npm/node_modules/unique-string": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "crypto-random-string": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/unpipe": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/npm/node_modules/unzip-response": {
+            "version": "2.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/update-notifier": {
+            "version": "2.5.0",
+            "inBundle": true,
+            "license": "BSD-2-Clause",
+            "dependencies": {
+                "boxen": "^1.2.1",
+                "chalk": "^2.0.1",
+                "configstore": "^3.0.0",
+                "import-lazy": "^2.1.0",
+                "is-ci": "^1.0.10",
+                "is-installed-globally": "^0.1.0",
+                "is-npm": "^1.0.0",
+                "latest-version": "^3.0.0",
+                "semver-diff": "^2.0.0",
+                "xdg-basedir": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/url-parse-lax": {
+            "version": "1.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "prepend-http": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/util-deprecate": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/util-extend": {
+            "version": "1.0.3",
+            "inBundle": true,
+            "license": "MIT"
+        },
+        "node_modules/npm/node_modules/util-promisify": {
+            "version": "2.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "object.getownpropertydescriptors": "^2.0.3"
+            }
+        },
+        "node_modules/npm/node_modules/uuid": {
+            "version": "3.3.3",
+            "inBundle": true,
+            "license": "MIT",
+            "bin": {
+                "uuid": "bin/uuid"
+            }
+        },
+        "node_modules/npm/node_modules/validate-npm-package-license": {
+            "version": "3.0.4",
+            "inBundle": true,
+            "license": "Apache-2.0",
+            "dependencies": {
+                "spdx-correct": "^3.0.0",
+                "spdx-expression-parse": "^3.0.0"
+            }
+        },
+        "node_modules/npm/node_modules/validate-npm-package-name": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "builtins": "^1.0.3"
+            }
+        },
+        "node_modules/npm/node_modules/verror": {
+            "version": "1.10.0",
+            "engines": [
+                "node >=0.6.0"
+            ],
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "assert-plus": "^1.0.0",
+                "core-util-is": "1.0.2",
+                "extsprintf": "^1.2.0"
+            }
+        },
+        "node_modules/npm/node_modules/wcwidth": {
+            "version": "1.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "defaults": "^1.0.3"
+            }
+        },
+        "node_modules/npm/node_modules/which": {
+            "version": "1.3.1",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "isexe": "^2.0.0"
+            },
+            "bin": {
+                "which": "bin/which"
+            }
+        },
+        "node_modules/npm/node_modules/which-module": {
+            "version": "2.0.0",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/wide-align": {
+            "version": "1.1.2",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "string-width": "^1.0.2"
+            }
+        },
+        "node_modules/npm/node_modules/wide-align/node_modules/string-width": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "code-point-at": "^1.0.0",
+                "is-fullwidth-code-point": "^1.0.0",
+                "strip-ansi": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/widest-line": {
+            "version": "2.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "string-width": "^2.1.1"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/worker-farm": {
+            "version": "1.7.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "errno": "~0.1.7"
+            }
+        },
+        "node_modules/npm/node_modules/wrap-ansi": {
+            "version": "2.1.0",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "string-width": "^1.0.1",
+                "strip-ansi": "^3.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/wrap-ansi/node_modules/string-width": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "code-point-at": "^1.0.0",
+                "is-fullwidth-code-point": "^1.0.0",
+                "strip-ansi": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/npm/node_modules/wrappy": {
+            "version": "1.0.2",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/write-file-atomic": {
+            "version": "2.4.3",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "graceful-fs": "^4.1.11",
+                "imurmurhash": "^0.1.4",
+                "signal-exit": "^3.0.2"
+            }
+        },
+        "node_modules/npm/node_modules/xdg-basedir": {
+            "version": "3.0.0",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/npm/node_modules/xtend": {
+            "version": "4.0.1",
+            "inBundle": true,
+            "license": "MIT",
+            "engines": {
+                "node": ">=0.4"
+            }
+        },
+        "node_modules/npm/node_modules/y18n": {
+            "version": "4.0.0",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/yallist": {
+            "version": "3.0.3",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npm/node_modules/yargs": {
+            "version": "11.1.1",
+            "inBundle": true,
+            "license": "MIT",
+            "dependencies": {
+                "cliui": "^4.0.0",
+                "decamelize": "^1.1.1",
+                "find-up": "^2.1.0",
+                "get-caller-file": "^1.0.1",
+                "os-locale": "^3.1.0",
+                "require-directory": "^2.1.1",
+                "require-main-filename": "^1.0.1",
+                "set-blocking": "^2.0.0",
+                "string-width": "^2.0.0",
+                "which-module": "^2.0.0",
+                "y18n": "^3.2.1",
+                "yargs-parser": "^9.0.2"
+            }
+        },
+        "node_modules/npm/node_modules/yargs-parser": {
+            "version": "9.0.2",
+            "inBundle": true,
+            "license": "ISC",
+            "dependencies": {
+                "camelcase": "^4.1.0"
+            }
+        },
+        "node_modules/npm/node_modules/yargs/node_modules/y18n": {
+            "version": "3.2.1",
+            "inBundle": true,
+            "license": "ISC"
+        },
+        "node_modules/npmlog": {
+            "version": "4.1.2",
+            "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz",
+            "integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg==",
+            "dependencies": {
+                "are-we-there-yet": "~1.1.2",
+                "console-control-strings": "~1.1.0",
+                "gauge": "~2.7.3",
+                "set-blocking": "~2.0.0"
+            }
+        },
+        "node_modules/nth-check": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.2.tgz",
+            "integrity": "sha512-WeBOdju8SnzPN5vTUJYxYUxLeXpCaVP5i5e0LF8fg7WORF2Wd7wFX/pk0tYZk7s8T+J7VLy0Da6J1+wCT0AtHg==",
+            "dependencies": {
+                "boolbase": "~1.0.0"
+            }
+        },
+        "node_modules/number-is-nan": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
+            "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/nwsapi": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.0.tgz",
+            "integrity": "sha512-h2AatdwYH+JHiZpv7pt/gSX1XoRGb7L/qSIeuqA6GwYoF9w1vP1cw42TO0aI2pNyshRK5893hNSl+1//vHK7hQ==",
+            "dev": true
+        },
+        "node_modules/oauth": {
+            "version": "0.9.15",
+            "resolved": "https://registry.npmjs.org/oauth/-/oauth-0.9.15.tgz",
+            "integrity": "sha1-vR/vr2hslrdUda7VGWQS/2DPucE="
+        },
+        "node_modules/oauth-sign": {
+            "version": "0.9.0",
+            "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.9.0.tgz",
+            "integrity": "sha512-fexhUFFPTGV8ybAtSIGbV6gOkSv8UtRbDBnAyLQw4QPKkgNlsH2ByPGtMUqdWkos6YCRmAqViwgZrJc/mRDzZQ==",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/object-assign": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+            "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/object-component": {
+            "version": "0.0.3",
+            "resolved": "https://registry.npmjs.org/object-component/-/object-component-0.0.3.tgz",
+            "integrity": "sha1-8MaapQ78lbhmwYb0AKM3acsvEpE="
+        },
+        "node_modules/object-copy": {
+            "version": "0.1.0",
+            "resolved": "https://registry.npmjs.org/object-copy/-/object-copy-0.1.0.tgz",
+            "integrity": "sha1-fn2Fi3gb18mRpBupde04EnVOmYw=",
+            "dependencies": {
+                "copy-descriptor": "^0.1.0",
+                "define-property": "^0.2.5",
+                "kind-of": "^3.0.3"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/object-copy/node_modules/define-property": {
+            "version": "0.2.5",
+            "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+            "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
+            "dependencies": {
+                "is-descriptor": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/object-copy/node_modules/is-buffer": {
+            "version": "1.1.6",
+            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
+            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
+        },
+        "node_modules/object-copy/node_modules/kind-of": {
+            "version": "3.2.2",
+            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+            "dependencies": {
+                "is-buffer": "^1.1.5"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/object-inspect": {
+            "version": "1.7.0",
+            "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.7.0.tgz",
+            "integrity": "sha512-a7pEHdh1xKIAgTySUGgLMx/xwDZskN1Ud6egYYN3EdRW4ZMPNEDUTF+hwy2LUC+Bl+SyLXANnwz/jyh/qutKUw=="
+        },
+        "node_modules/object-is": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.2.tgz",
+            "integrity": "sha512-5lHCz+0uufF6wZ7CRFWJN3hp8Jqblpgve06U5CMQ3f//6iDjPr2PEo9MWCjEssDsa+UZEL4PkFpr+BMop6aKzQ==",
+            "dependencies": {
+                "define-properties": "^1.1.3",
+                "es-abstract": "^1.17.5"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/object-keys": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
+            "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==",
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/object-to-arguments": {
+            "version": "0.0.8",
+            "resolved": "https://registry.npmjs.org/object-to-arguments/-/object-to-arguments-0.0.8.tgz",
+            "integrity": "sha512-BfWfuAwuhdH1bhMG5EG90WE/eckkBhBvnke8eSEkCDXoLE9Jk5JwYGTbCx1ehGwV48HvBkn62VukPBdlMUOY9w==",
+            "dependencies": {
+                "inspect-parameters-declaration": "0.0.10",
+                "magicli": "0.0.5",
+                "split-skip": "0.0.2",
+                "stringify-parameters": "0.0.4",
+                "unpack-string": "0.0.2"
+            },
+            "bin": {
+                "object-to-arguments": "bin/cli.js"
+            }
+        },
+        "node_modules/object-to-arguments/node_modules/inspect-parameters-declaration": {
+            "version": "0.0.10",
+            "resolved": "https://registry.npmjs.org/inspect-parameters-declaration/-/inspect-parameters-declaration-0.0.10.tgz",
+            "integrity": "sha512-L8/Bvt9iDXQTZ63xY5/MAyvzz+FagR/qGh1kIXvUpsno3AAE0Z95d6QO51zrcMGaEGpwh/57idfMxTxbvRmytg==",
+            "dependencies": {
+                "magicli": "0.0.5",
+                "split-skip": "0.0.2",
+                "stringify-parameters": "0.0.4",
+                "unpack-string": "0.0.2"
+            },
+            "bin": {
+                "inspect-parameters-declaration": "bin/cli.js"
+            }
+        },
+        "node_modules/object-to-arguments/node_modules/magicli": {
+            "version": "0.0.5",
+            "resolved": "https://registry.npmjs.org/magicli/-/magicli-0.0.5.tgz",
+            "integrity": "sha1-zufQ+7THBRiqyxHsPrfiX/SaSSE=",
+            "dependencies": {
+                "commander": "^2.9.0",
+                "get-stdin": "^5.0.1",
+                "inspect-function": "^0.2.1",
+                "pipe-functions": "^1.2.0"
+            }
+        },
+        "node_modules/object-visit": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/object-visit/-/object-visit-1.0.1.tgz",
+            "integrity": "sha1-95xEk68MU3e1n+OdOV5BBC3QRbs=",
+            "dependencies": {
+                "isobject": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/object.assign": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.0.tgz",
+            "integrity": "sha512-exHJeq6kBKj58mqGyTQ9DFvrZC/eR6OwxzoM9YRoGBqrXYonaFyGiFMuc9VZrXf7DarreEwMpurG3dd+CNyW5w==",
+            "dependencies": {
+                "define-properties": "^1.1.2",
+                "function-bind": "^1.1.1",
+                "has-symbols": "^1.0.0",
+                "object-keys": "^1.0.11"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/object.getownpropertydescriptors": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/object.getownpropertydescriptors/-/object.getownpropertydescriptors-2.1.0.tgz",
+            "integrity": "sha512-Z53Oah9A3TdLoblT7VKJaTDdXdT+lQO+cNpKVnya5JDe9uLvzu1YyY1yFDFrcxrlRgWrEFH0jJtD/IbuwjcEVg==",
+            "dependencies": {
+                "define-properties": "^1.1.3",
+                "es-abstract": "^1.17.0-next.1"
+            },
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/object.pick": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.3.0.tgz",
+            "integrity": "sha1-h6EKxMFpS9Lhy/U1kaZhQftd10c=",
+            "dependencies": {
+                "isobject": "^3.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/obuf": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.2.tgz",
+            "integrity": "sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg==",
+            "dev": true
+        },
+        "node_modules/on-finished": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
+            "integrity": "sha1-IPEzZIGwg811M3mSoWlxqi2QaUc=",
+            "dependencies": {
+                "ee-first": "1.1.1"
+            },
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/on-headers": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.0.2.tgz",
+            "integrity": "sha512-pZAE+FJLoyITytdqK0U5s+FIpjN0JP3OzFi/u8Rx+EV5/W+JTWGXG8xFzevE7AjBfDqHv/8vL8qQsIhHnqRkrA==",
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/once": {
+            "version": "1.4.0",
+            "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
+            "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
+            "dependencies": {
+                "wrappy": "1"
+            }
+        },
+        "node_modules/opentype.js": {
+            "version": "1.3.3",
+            "resolved": "https://registry.npmjs.org/opentype.js/-/opentype.js-1.3.3.tgz",
+            "integrity": "sha512-/qIY/+WnKGlPIIPhbeNjynfD2PO15G9lA/xqlX2bDH+4lc3Xz5GCQ68mqxj3DdUv6AJqCeaPvuAoH8mVL0zcuA==",
+            "dependencies": {
+                "string.prototype.codepointat": "^0.2.1",
+                "tiny-inflate": "^1.0.3"
+            },
+            "bin": {
+                "ot": "bin/ot"
+            },
+            "engines": {
+                "node": ">= 8.0.0"
+            }
+        },
+        "node_modules/opn": {
+            "version": "5.5.0",
+            "resolved": "https://registry.npmjs.org/opn/-/opn-5.5.0.tgz",
+            "integrity": "sha512-PqHpggC9bLV0VeWcdKhkpxY+3JTzetLSqTCWL/z/tFIbI6G8JCjondXklT1JinczLz2Xib62sSp0T/gKT4KksA==",
+            "dev": true,
+            "dependencies": {
+                "is-wsl": "^1.1.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/optionator": {
+            "version": "0.8.3",
+            "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.3.tgz",
+            "integrity": "sha512-+IW9pACdk3XWmmTXG8m3upGUJst5XRGzxMRjXzAuJ1XnIFNvfhjjIuYkDvysnPQ7qzqVzLt78BCruntqRhWQbA==",
+            "dev": true,
+            "dependencies": {
+                "deep-is": "~0.1.3",
+                "fast-levenshtein": "~2.0.6",
+                "levn": "~0.3.0",
+                "prelude-ls": "~1.1.2",
+                "type-check": "~0.3.2",
+                "word-wrap": "~1.2.3"
+            },
+            "engines": {
+                "node": ">= 0.8.0"
+            }
+        },
+        "node_modules/orderedmap": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/orderedmap/-/orderedmap-1.1.1.tgz",
+            "integrity": "sha512-3Ux8um0zXbVacKUkcytc0u3HgC0b0bBLT+I60r2J/En72cI0nZffqrA7Xtf2Hqs27j1g82llR5Mhbd0Z1XW4AQ=="
+        },
+        "node_modules/original": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/original/-/original-1.0.2.tgz",
+            "integrity": "sha512-hyBVl6iqqUOJ8FqRe+l/gS8H+kKYjrEndd5Pm1MfBtsEKA038HkkdbAl/72EAXGyonD/PFsvmVG+EvcIpliMBg==",
+            "dev": true,
+            "dependencies": {
+                "url-parse": "^1.4.3"
+            }
+        },
+        "node_modules/os-browserify": {
+            "version": "0.3.0",
+            "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.3.0.tgz",
+            "integrity": "sha1-hUNzx/XCMVkU/Jv8a9gjj92h7Cc=",
+            "dev": true
+        },
+        "node_modules/os-homedir": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
+            "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/os-tmpdir": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
+            "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/osenv": {
+            "version": "0.1.5",
+            "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.5.tgz",
+            "integrity": "sha512-0CWcCECdMVc2Rw3U5w9ZjqX6ga6ubk1xDVKxtBQPK7wis/0F2r9T6k4ydGYhecl7YUBxBVxhL5oisPsNxAPe2g==",
+            "dependencies": {
+                "os-homedir": "^1.0.0",
+                "os-tmpdir": "^1.0.0"
+            }
+        },
+        "node_modules/p-debounce": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/p-debounce/-/p-debounce-1.0.0.tgz",
+            "integrity": "sha1-y38svu/YegnrqGHhErZ1J+Yh4v0=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/p-finally": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz",
+            "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/p-limit": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
+            "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
+            "dependencies": {
+                "p-try": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/p-locate": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-3.0.0.tgz",
+            "integrity": "sha512-x+12w/To+4GFfgJhBEpiDcLozRJGegY+Ei7/z0tSLkMmxGZNybVMSfWj9aJn8Z5Fc7dBUNJOOVgPv2H7IwulSQ==",
+            "dependencies": {
+                "p-limit": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/p-map": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/p-map/-/p-map-2.1.0.tgz",
+            "integrity": "sha512-y3b8Kpd8OAN444hxfBbFfj1FY/RjtTd8tzYwhUqNYXx0fXx2iX4maP4Qr6qhIKbQXI02wTLAda4fYUbDagTUFw==",
+            "dev": true,
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/p-retry": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/p-retry/-/p-retry-3.0.1.tgz",
+            "integrity": "sha512-XE6G4+YTTkT2a0UWb2kjZe8xNwf8bIbnqpc/IS/idOBVhyves0mK5OJgeocjx7q5pvX/6m23xuzVPYT1uGM73w==",
+            "dev": true,
+            "dependencies": {
+                "retry": "^0.12.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/p-try": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
+            "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/package-json": {
+            "version": "4.0.1",
+            "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz",
+            "integrity": "sha1-iGmgQBJTZhxMTKPabCEh7VVfXu0=",
+            "dependencies": {
+                "got": "^6.7.1",
+                "registry-auth-token": "^3.0.1",
+                "registry-url": "^3.0.3",
+                "semver": "^5.1.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/pako": {
+            "version": "1.0.11",
+            "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.11.tgz",
+            "integrity": "sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw=="
+        },
+        "node_modules/parallel-transform": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/parallel-transform/-/parallel-transform-1.2.0.tgz",
+            "integrity": "sha512-P2vSmIu38uIlvdcU7fDkyrxj33gTUy/ABO5ZUbGowxNCopBq/OoD42bP4UmMrJoPyk4Uqf0mu3mtWBhHCZD8yg==",
+            "dev": true,
+            "dependencies": {
+                "cyclist": "^1.0.1",
+                "inherits": "^2.0.3",
+                "readable-stream": "^2.1.5"
+            }
+        },
+        "node_modules/parallel-transform/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dev": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/parent-module": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
+            "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==",
+            "dependencies": {
+                "callsites": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/parse-asn1": {
+            "version": "5.1.6",
+            "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.6.tgz",
+            "integrity": "sha512-RnZRo1EPU6JBnra2vGHj0yhp6ebyjBZpmUCLHWiFhxlzvBCCpAuZ7elsBp1PVAbQN0/04VD/19rfzlBSwLstMw==",
+            "dev": true,
+            "dependencies": {
+                "asn1.js": "^5.2.0",
+                "browserify-aes": "^1.0.0",
+                "evp_bytestokey": "^1.0.0",
+                "pbkdf2": "^3.0.3",
+                "safe-buffer": "^5.1.1"
+            }
+        },
+        "node_modules/parse-json": {
+            "version": "5.0.0",
+            "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.0.0.tgz",
+            "integrity": "sha512-OOY5b7PAEFV0E2Fir1KOkxchnZNCdowAJgQ5NuxjpBKTRP3pQhwkrkxqQjeoKJ+fO7bCpmIZaogI4eZGDMEGOw==",
+            "dependencies": {
+                "@babel/code-frame": "^7.0.0",
+                "error-ex": "^1.3.1",
+                "json-parse-better-errors": "^1.0.1",
+                "lines-and-columns": "^1.1.6"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/parse-passwd": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
+            "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/parse5": {
+            "version": "3.0.3",
+            "resolved": "https://registry.npmjs.org/parse5/-/parse5-3.0.3.tgz",
+            "integrity": "sha512-rgO9Zg5LLLkfJF9E6CCmXlSE4UVceloys8JrFqCcHloC3usd/kJCyPDwH2SOlzix2j3xaP9sUX3e8+kvkuleAA==",
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
+        "node_modules/parseqs": {
+            "version": "0.0.5",
+            "resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.5.tgz",
+            "integrity": "sha1-1SCKNzjkZ2bikbouoXNoSSGouJ0=",
+            "dependencies": {
+                "better-assert": "~1.0.0"
+            }
+        },
+        "node_modules/parseuri": {
+            "version": "0.0.5",
+            "resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.5.tgz",
+            "integrity": "sha1-gCBKUNTbt3m/3G6+J3jZDkvOMgo=",
+            "dependencies": {
+                "better-assert": "~1.0.0"
+            }
+        },
+        "node_modules/parseurl": {
+            "version": "1.3.3",
+            "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
+            "integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==",
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/pascalcase": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/pascalcase/-/pascalcase-0.1.1.tgz",
+            "integrity": "sha1-s2PlXoAGym/iF4TS2yK9FdeRfxQ=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/passport": {
+            "version": "0.4.1",
+            "resolved": "https://registry.npmjs.org/passport/-/passport-0.4.1.tgz",
+            "integrity": "sha512-IxXgZZs8d7uFSt3eqNjM9NQ3g3uQCW5avD8mRNoXV99Yig50vjuaez6dQK2qC0kVWPRTujxY0dWgGfT09adjYg==",
+            "dependencies": {
+                "passport-strategy": "1.x.x",
+                "pause": "0.0.1"
+            },
+            "engines": {
+                "node": ">= 0.4.0"
+            }
+        },
+        "node_modules/passport-google-oauth20": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/passport-google-oauth20/-/passport-google-oauth20-2.0.0.tgz",
+            "integrity": "sha512-KSk6IJ15RoxuGq7D1UKK/8qKhNfzbLeLrG3gkLZ7p4A6DBCcv7xpyQwuXtWdpyR0+E0mwkpjY1VfPOhxQrKzdQ==",
+            "dependencies": {
+                "passport-oauth2": "1.x.x"
+            },
+            "engines": {
+                "node": ">= 0.4.0"
+            }
+        },
+        "node_modules/passport-local": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/passport-local/-/passport-local-1.0.0.tgz",
+            "integrity": "sha1-H+YyaMkudWBmJkN+O5BmYsFbpu4=",
+            "dependencies": {
+                "passport-strategy": "1.x.x"
+            },
+            "engines": {
+                "node": ">= 0.4.0"
+            }
+        },
+        "node_modules/passport-oauth2": {
+            "version": "1.5.0",
+            "resolved": "https://registry.npmjs.org/passport-oauth2/-/passport-oauth2-1.5.0.tgz",
+            "integrity": "sha512-kqBt6vR/5VlCK8iCx1/KpY42kQ+NEHZwsSyt4Y6STiNjU+wWICG1i8ucc1FapXDGO15C5O5VZz7+7vRzrDPXXQ==",
+            "dependencies": {
+                "base64url": "3.x.x",
+                "oauth": "0.9.x",
+                "passport-strategy": "1.x.x",
+                "uid2": "0.0.x",
+                "utils-merge": "1.x.x"
+            },
+            "engines": {
+                "node": ">= 0.4.0"
+            }
+        },
+        "node_modules/passport-strategy": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/passport-strategy/-/passport-strategy-1.0.0.tgz",
+            "integrity": "sha1-tVOaqPwiWj0a0XlHbd8ja0QPUuQ=",
+            "engines": {
+                "node": ">= 0.4.0"
+            }
+        },
+        "node_modules/path-browserify": {
+            "version": "0.0.1",
+            "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.1.tgz",
+            "integrity": "sha512-BapA40NHICOS+USX9SN4tyhq+A2RrN/Ws5F0Z5aMHDp98Fl86lX8Oti8B7uN93L4Ifv4fHOEA+pQw87gmMO/lQ==",
+            "dev": true
+        },
+        "node_modules/path-dirname": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz",
+            "integrity": "sha1-zDPSTVJeCZpTiMAzbG4yuRYGCeA="
+        },
+        "node_modules/path-exists": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
+            "integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/path-is-absolute": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
+            "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/path-is-inside": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz",
+            "integrity": "sha1-NlQX3t5EQw0cEa9hAn+s8HS9/FM="
+        },
+        "node_modules/path-key": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/path-key/-/path-key-2.0.1.tgz",
+            "integrity": "sha1-QRyttXTFoUDTpLGRDUDYDMn0C0A=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/path-parse": {
+            "version": "1.0.6",
+            "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.6.tgz",
+            "integrity": "sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw=="
+        },
+        "node_modules/path-to-regexp": {
+            "version": "0.1.7",
+            "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
+            "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
+        },
+        "node_modules/path-type": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
+            "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/pathval": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/pathval/-/pathval-1.1.0.tgz",
+            "integrity": "sha1-uULm1L3mUwBe9rcTYd74cn0GReA=",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/pause": {
+            "version": "0.0.1",
+            "resolved": "https://registry.npmjs.org/pause/-/pause-0.0.1.tgz",
+            "integrity": "sha1-HUCLP9t2kjuVQ9lvtMnf1TXZy10="
+        },
+        "node_modules/pbkdf2": {
+            "version": "3.1.2",
+            "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.1.2.tgz",
+            "integrity": "sha512-iuh7L6jA7JEGu2WxDwtQP1ddOpaJNC4KlDEFfdQajSGgGPNi4OyDc2R7QnbY2bR9QjBVGwgvTdNJZoE7RaxUMA==",
+            "dev": true,
+            "dependencies": {
+                "create-hash": "^1.1.2",
+                "create-hmac": "^1.1.4",
+                "ripemd160": "^2.0.1",
+                "safe-buffer": "^5.0.1",
+                "sha.js": "^2.4.8"
+            },
+            "engines": {
+                "node": ">=0.12"
+            }
+        },
+        "node_modules/pdf-parse": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/pdf-parse/-/pdf-parse-1.1.1.tgz",
+            "integrity": "sha512-v6ZJ/efsBpGrGGknjtq9J/oC8tZWq0KWL5vQrk2GlzLEQPUDB1ex+13Rmidl1neNN358Jn9EHZw5y07FFtaC7A==",
+            "dependencies": {
+                "debug": "^3.1.0",
+                "node-ensure": "^0.0.0"
+            },
+            "engines": {
+                "node": ">=6.8.1"
+            }
+        },
+        "node_modules/pdfjs": {
+            "version": "2.3.9",
+            "resolved": "https://registry.npmjs.org/pdfjs/-/pdfjs-2.3.9.tgz",
+            "integrity": "sha512-SK4xI0UbtNo9Ub1BMVgxphdL0Cy1iN9p2SxWG98JLnVe569WF8IO60K03UxlnmSV2s5P0MV1DEuZOlUslRlinA==",
+            "dependencies": {
+                "@rkusa/linebreak": "^1.0.0",
+                "opentype.js": "^1.3.3",
+                "pako": "^1.0.11",
+                "readable-stream": "^3.6.0",
+                "unorm": "^1.6.0",
+                "uuid": "^7.0.3"
+            },
+            "engines": {
+                "node": ">=7"
+            }
+        },
+        "node_modules/pdfjs-dist": {
+            "version": "2.4.456",
+            "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-2.4.456.tgz",
+            "integrity": "sha512-yckJEHq3F48hcp6wStEpbN9McOj328Ib09UrBlGAKxvN2k+qYPN5iq6TH6jD1C0pso7zTep+g/CKsYgdrQd5QA=="
+        },
+        "node_modules/pdfjs/node_modules/uuid": {
+            "version": "7.0.3",
+            "resolved": "https://registry.npmjs.org/uuid/-/uuid-7.0.3.tgz",
+            "integrity": "sha512-DPSke0pXhTZgoF/d+WSt2QaKMCFSfx7QegxEWT+JOuHF5aWrKEn0G+ztjuJg/gG8/ItK+rbPCD/yNv8yyih6Cg==",
+            "bin": {
+                "uuid": "dist/bin/uuid"
+            }
+        },
+        "node_modules/pend": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz",
+            "integrity": "sha1-elfrVQpng/kRUzH89GY9XI4AelA="
+        },
+        "node_modules/performance-now": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
+            "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns="
+        },
+        "node_modules/picomatch": {
+            "version": "2.2.2",
+            "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.2.2.tgz",
+            "integrity": "sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==",
+            "dev": true,
+            "engines": {
+                "node": ">=8.6"
+            }
+        },
+        "node_modules/pify": {
+            "version": "4.0.1",
+            "resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz",
+            "integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==",
+            "dev": true,
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/pinkie": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz",
+            "integrity": "sha1-clVrgM+g1IqXToDnckjoDtT3+HA=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/pinkie-promise": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
+            "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o=",
+            "dependencies": {
+                "pinkie": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/pipe-functions": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/pipe-functions/-/pipe-functions-1.3.0.tgz",
+            "integrity": "sha512-6Rtbp7criZRwedlvWbUYxqlqJoAlMvYHo2UcRWq79xZ54vZcaNHpVBOcWkX3ErT2aUA69tv+uiv4zKJbhD/Wgg=="
+        },
+        "node_modules/pkg-dir": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-2.0.0.tgz",
+            "integrity": "sha1-9tXREJ4Z1j7fQo4L1X4Sd3YVM0s=",
+            "dev": true,
+            "dependencies": {
+                "find-up": "^2.1.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/pkg-dir/node_modules/find-up": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
+            "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c=",
+            "dev": true,
+            "dependencies": {
+                "locate-path": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/pkg-dir/node_modules/locate-path": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",
+            "integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4=",
+            "dev": true,
+            "dependencies": {
+                "p-locate": "^2.0.0",
+                "path-exists": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/pkg-dir/node_modules/p-limit": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.3.0.tgz",
+            "integrity": "sha512-vvcXsLAJ9Dr5rQOPk7toZQZJApBl2K4J6dANSsEuh6QI41JYcsS/qhTGa9ErIUUgK3WNQoJYvylxvjqmiqEA9Q==",
+            "dev": true,
+            "dependencies": {
+                "p-try": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/pkg-dir/node_modules/p-locate": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-2.0.0.tgz",
+            "integrity": "sha1-IKAQOyIqcMj9OcwuWAaA893l7EM=",
+            "dev": true,
+            "dependencies": {
+                "p-limit": "^1.1.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/pkg-dir/node_modules/p-try": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/p-try/-/p-try-1.0.0.tgz",
+            "integrity": "sha1-y8ec26+P1CKOE/Yh8rGiN8GyB7M=",
+            "dev": true,
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/please-upgrade-node": {
+            "version": "3.2.0",
+            "resolved": "https://registry.npmjs.org/please-upgrade-node/-/please-upgrade-node-3.2.0.tgz",
+            "integrity": "sha512-gQR3WpIgNIKwBMVLkpMUeR3e1/E1y42bqDQZfql+kDeXd8COYfM8PQA4X6y7a8u9Ua9FHmsrrmirW2vHs45hWg==",
+            "dependencies": {
+                "semver-compare": "^1.0.0"
+            }
+        },
+        "node_modules/plist": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/plist/-/plist-1.2.0.tgz",
+            "integrity": "sha1-CEtQk93JJQbiWfh0uNmxr7jHlZM=",
+            "dependencies": {
+                "base64-js": "0.0.8",
+                "util-deprecate": "1.0.2",
+                "xmlbuilder": "4.0.0",
+                "xmldom": "0.1.x"
+            }
+        },
+        "node_modules/plist/node_modules/base64-js": {
+            "version": "0.0.8",
+            "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-0.0.8.tgz",
+            "integrity": "sha1-EQHpVE9KdrG8OybUUsqW16NeeXg=",
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/pn": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/pn/-/pn-1.1.0.tgz",
+            "integrity": "sha512-2qHaIQr2VLRFoxe2nASzsV6ef4yOOH+Fi9FBOVH6cqeSgUnoyySPZkxzLuzd+RYOQTRpROA0ztTMqxROKSb/nA==",
+            "dev": true
+        },
+        "node_modules/popper.js": {
+            "version": "1.16.1",
+            "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
+            "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ=="
+        },
+        "node_modules/portfinder": {
+            "version": "1.0.26",
+            "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.26.tgz",
+            "integrity": "sha512-Xi7mKxJHHMI3rIUrnm/jjUgwhbYMkp/XKEcZX3aG4BrumLpq3nmoQMX+ClYnDZnZ/New7IatC1no5RX0zo1vXQ==",
+            "dev": true,
+            "dependencies": {
+                "async": "^2.6.2",
+                "debug": "^3.1.1",
+                "mkdirp": "^0.5.1"
+            },
+            "engines": {
+                "node": ">= 0.12.0"
+            }
+        },
+        "node_modules/posix-character-classes": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
+            "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/postcss": {
+            "version": "7.0.27",
+            "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.27.tgz",
+            "integrity": "sha512-WuQETPMcW9Uf1/22HWUWP9lgsIC+KEHg2kozMflKjbeUtw9ujvFX6QmIfozaErDkmLWS9WEnEdEe6Uo9/BNTdQ==",
+            "dev": true,
+            "dependencies": {
+                "chalk": "^2.4.2",
+                "source-map": "^0.6.1",
+                "supports-color": "^6.1.0"
+            },
+            "engines": {
+                "node": ">=6.0.0"
+            }
+        },
+        "node_modules/postcss-modules-extract-imports": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-2.0.0.tgz",
+            "integrity": "sha512-LaYLDNS4SG8Q5WAWqIJgdHPJrDDr/Lv775rMBFUbgjTz6j34lUznACHcdRWroPvXANP2Vj7yNK57vp9eFqzLWQ==",
+            "dev": true,
+            "dependencies": {
+                "postcss": "^7.0.5"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/postcss-modules-local-by-default": {
+            "version": "2.0.6",
+            "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-2.0.6.tgz",
+            "integrity": "sha512-oLUV5YNkeIBa0yQl7EYnxMgy4N6noxmiwZStaEJUSe2xPMcdNc8WmBQuQCx18H5psYbVxz8zoHk0RAAYZXP9gA==",
+            "dev": true,
+            "dependencies": {
+                "postcss": "^7.0.6",
+                "postcss-selector-parser": "^6.0.0",
+                "postcss-value-parser": "^3.3.1"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/postcss-modules-scope": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-2.2.0.tgz",
+            "integrity": "sha512-YyEgsTMRpNd+HmyC7H/mh3y+MeFWevy7V1evVhJWewmMbjDHIbZbOXICC2y+m1xI1UVfIT1HMW/O04Hxyu9oXQ==",
+            "dev": true,
+            "dependencies": {
+                "postcss": "^7.0.6",
+                "postcss-selector-parser": "^6.0.0"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/postcss-modules-values": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-2.0.0.tgz",
+            "integrity": "sha512-Ki7JZa7ff1N3EIMlPnGTZfUMe69FFwiQPnVSXC9mnn3jozCRBYIxiZd44yJOV2AmabOo4qFf8s0dC/+lweG7+w==",
+            "dev": true,
+            "dependencies": {
+                "icss-replace-symbols": "^1.1.0",
+                "postcss": "^7.0.6"
+            }
+        },
+        "node_modules/postcss-selector-parser": {
+            "version": "6.0.2",
+            "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.2.tgz",
+            "integrity": "sha512-36P2QR59jDTOAiIkqEprfJDsoNrvwFei3eCqKd1Y0tUsBimsq39BLp7RD+JWny3WgB1zGhJX8XVePwm9k4wdBg==",
+            "dev": true,
+            "dependencies": {
+                "cssesc": "^3.0.0",
+                "indexes-of": "^1.0.1",
+                "uniq": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/postcss-value-parser": {
+            "version": "3.3.1",
+            "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz",
+            "integrity": "sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ=="
+        },
+        "node_modules/postcss/node_modules/source-map": {
+            "version": "0.6.1",
+            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/postcss/node_modules/supports-color": {
+            "version": "6.1.0",
+            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz",
+            "integrity": "sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==",
+            "dev": true,
+            "dependencies": {
+                "has-flag": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/prebuild-install": {
+            "version": "5.3.3",
+            "resolved": "https://registry.npmjs.org/prebuild-install/-/prebuild-install-5.3.3.tgz",
+            "integrity": "sha512-GV+nsUXuPW2p8Zy7SarF/2W/oiK8bFQgJcncoJ0d7kRpekEA0ftChjfEaF9/Y+QJEc/wFR7RAEa8lYByuUIe2g==",
+            "dependencies": {
+                "detect-libc": "^1.0.3",
+                "expand-template": "^2.0.3",
+                "github-from-package": "0.0.0",
+                "minimist": "^1.2.0",
+                "mkdirp": "^0.5.1",
+                "napi-build-utils": "^1.0.1",
+                "node-abi": "^2.7.0",
+                "noop-logger": "^0.1.1",
+                "npmlog": "^4.0.1",
+                "pump": "^3.0.0",
+                "rc": "^1.2.7",
+                "simple-get": "^3.0.3",
+                "tar-fs": "^2.0.0",
+                "tunnel-agent": "^0.6.0",
+                "which-pm-runs": "^1.0.0"
+            },
+            "bin": {
+                "prebuild-install": "bin.js"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/prelude-ls": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz",
+            "integrity": "sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ=",
+            "dev": true,
+            "engines": {
+                "node": ">= 0.8.0"
+            }
+        },
+        "node_modules/prepend-http": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz",
+            "integrity": "sha1-1PRWKwzjaW5BrFLQ4ALlemNdxtw=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/probe-image-size": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/probe-image-size/-/probe-image-size-4.1.1.tgz",
+            "integrity": "sha512-42LqKZqTLxH/UvAZ2/cKhAsR4G/Y6B7i7fI2qtQu9hRBK4YjS6gqO+QRtwTjvojUx4+/+JuOMzLoFyRecT9qRw==",
+            "dependencies": {
+                "any-promise": "^1.3.0",
+                "deepmerge": "^4.0.0",
+                "inherits": "^2.0.3",
+                "next-tick": "^1.0.0",
+                "request": "^2.83.0",
+                "stream-parser": "~0.3.1"
+            }
+        },
+        "node_modules/probe-image-size/node_modules/deepmerge": {
+            "version": "4.2.2",
+            "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz",
+            "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/process": {
+            "version": "0.11.10",
+            "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
+            "integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI=",
+            "dev": true,
+            "engines": {
+                "node": ">= 0.6.0"
+            }
+        },
+        "node_modules/process-nextick-args": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
+            "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="
+        },
+        "node_modules/progress": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz",
+            "integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==",
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/promise": {
+            "version": "7.3.1",
+            "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
+            "integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==",
+            "dependencies": {
+                "asap": "~2.0.3"
+            }
+        },
+        "node_modules/promise-inflight": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/promise-inflight/-/promise-inflight-1.0.1.tgz",
+            "integrity": "sha1-mEcocL8igTL8vdhoEputEsPAKeM=",
+            "dev": true
+        },
+        "node_modules/prop-types": {
+            "version": "15.7.2",
+            "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz",
+            "integrity": "sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==",
+            "dependencies": {
+                "loose-envify": "^1.4.0",
+                "object-assign": "^4.1.1",
+                "react-is": "^16.8.1"
+            }
+        },
+        "node_modules/prosemirror-commands": {
+            "version": "1.1.4",
+            "resolved": "https://registry.npmjs.org/prosemirror-commands/-/prosemirror-commands-1.1.4.tgz",
+            "integrity": "sha512-kj4Qi+8h3EpJtZuuEDwZ9h2/QNGWDsIX/CzjmClxi9GhxWyBUMVUvIFk0mgdqHyX20lLeGmOpc0TLA5aPzgpWg==",
+            "dependencies": {
+                "prosemirror-model": "^1.0.0",
+                "prosemirror-state": "^1.0.0",
+                "prosemirror-transform": "^1.0.0"
+            }
+        },
+        "node_modules/prosemirror-dev-tools": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/prosemirror-dev-tools/-/prosemirror-dev-tools-3.0.1.tgz",
+            "integrity": "sha512-ZLMqrdIpDstBG6kP6Pt62FB7sAiLKqtW/oWvoBqlHw1p2ovNErR1/5aR1Uxrs6dgb4nPDxbu2uMKf/yI7ok7zQ==",
+            "dependencies": {
+                "@babel/runtime": "^7.0.0",
+                "@emotion/core": "^10.0.28",
+                "@emotion/styled": "^10.0.27",
+                "emotion": "^10.0.27",
+                "html": "^1.0.0",
+                "jsondiffpatch": "^0.4.1",
+                "nanoid": "^3.1.6",
+                "prop-types": "^15.7.2",
+                "prosemirror-model": ">=1.0.0",
+                "prosemirror-state": ">=1.0.0",
+                "react-dock": "^0.2.4",
+                "react-json-tree": "^0.11.2",
+                "unstated": "^2.1.1"
+            },
+            "engines": {
+                "node": ">=10"
+            }
+        },
+        "node_modules/prosemirror-find-replace": {
+            "version": "0.9.0",
+            "resolved": "https://registry.npmjs.org/prosemirror-find-replace/-/prosemirror-find-replace-0.9.0.tgz",
+            "integrity": "sha1-QgsENNF5xdBJD44hSNhVGpVJY4I="
+        },
+        "node_modules/prosemirror-history": {
+            "version": "1.1.3",
+            "resolved": "https://registry.npmjs.org/prosemirror-history/-/prosemirror-history-1.1.3.tgz",
+            "integrity": "sha512-zGDotijea+vnfnyyUGyiy1wfOQhf0B/b6zYcCouBV8yo6JmrE9X23M5q7Nf/nATywEZbgRLG70R4DmfSTC+gfg==",
+            "dependencies": {
+                "prosemirror-state": "^1.2.2",
+                "prosemirror-transform": "^1.0.0",
+                "rope-sequence": "^1.3.0"
+            }
+        },
+        "node_modules/prosemirror-inputrules": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/prosemirror-inputrules/-/prosemirror-inputrules-1.1.2.tgz",
+            "integrity": "sha512-Ja5Z3BWestlHYGvtSGqyvxMeB8QEuBjlHM8YnKtLGUXMDp965qdDV4goV8lJb17kIWHk7e7JNj6Catuoa3302g==",
+            "dependencies": {
+                "prosemirror-state": "^1.0.0",
+                "prosemirror-transform": "^1.0.0"
+            }
+        },
+        "node_modules/prosemirror-keymap": {
+            "version": "1.1.4",
+            "resolved": "https://registry.npmjs.org/prosemirror-keymap/-/prosemirror-keymap-1.1.4.tgz",
+            "integrity": "sha512-Al8cVUOnDFL4gcI5IDlG6xbZ0aOD/i3B17VT+1JbHWDguCgt/lBHVTHUBcKvvbSg6+q/W4Nj1Fu6bwZSca3xjg==",
+            "dependencies": {
+                "prosemirror-state": "^1.0.0",
+                "w3c-keyname": "^2.2.0"
+            }
+        },
+        "node_modules/prosemirror-model": {
+            "version": "1.10.0",
+            "resolved": "https://registry.npmjs.org/prosemirror-model/-/prosemirror-model-1.10.0.tgz",
+            "integrity": "sha512-xTMbbO2q4abs5lJdeRvk/SrftNfZlMdvChKziTiK+OKtP8LkQI8uw39u4S5zqyflrmW3Or6+qnyFPf1p4v2u1g==",
+            "dependencies": {
+                "orderedmap": "^1.1.0"
+            }
+        },
+        "node_modules/prosemirror-schema-list": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/prosemirror-schema-list/-/prosemirror-schema-list-1.1.2.tgz",
+            "integrity": "sha512-dgM9PwtM4twa5WsgSYMB+J8bwjnR43DAD3L9MsR9rKm/nZR5Y85xcjB7gusVMSsbQ2NomMZF03RE6No6mTnclQ==",
+            "dependencies": {
+                "prosemirror-model": "^1.0.0",
+                "prosemirror-transform": "^1.0.0"
+            }
+        },
+        "node_modules/prosemirror-state": {
+            "version": "1.3.3",
+            "resolved": "https://registry.npmjs.org/prosemirror-state/-/prosemirror-state-1.3.3.tgz",
+            "integrity": "sha512-PLXh2VJsIgvlgSTH6I2Yg6vk1CzPDp21DFreVpQtDMY2S6WaMmrQgDTLRcsrD8X38v8Yc873H7+ogdGzyIPn+w==",
+            "dependencies": {
+                "prosemirror-model": "^1.0.0",
+                "prosemirror-transform": "^1.0.0"
+            }
+        },
+        "node_modules/prosemirror-transform": {
+            "version": "1.2.6",
+            "resolved": "https://registry.npmjs.org/prosemirror-transform/-/prosemirror-transform-1.2.6.tgz",
+            "integrity": "sha512-DyV6cRip8//GIHTrqBe2B7I8VjPFQZYuBuB4clpguq1SrS9lLponoBt/0XRWxETkCVsxYSvwE76X0zo6AZhwaw==",
+            "dependencies": {
+                "prosemirror-model": "^1.0.0"
+            }
+        },
+        "node_modules/prosemirror-view": {
+            "version": "1.15.0",
+            "resolved": "https://registry.npmjs.org/prosemirror-view/-/prosemirror-view-1.15.0.tgz",
+            "integrity": "sha512-a7Q76sO/DCZr2UX2Rv1Rbw52cr9kVIz8iJOf/rq4mPN1NA3lugq2BKJgUMwlB3U4utyw3olLigqouRHM48NJyg==",
+            "dependencies": {
+                "prosemirror-model": "^1.1.0",
+                "prosemirror-state": "^1.0.0",
+                "prosemirror-transform": "^1.1.0"
+            }
+        },
+        "node_modules/proxy-addr": {
+            "version": "2.0.6",
+            "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.6.tgz",
+            "integrity": "sha512-dh/frvCBVmSsDYzw6n926jv974gddhkFPfiN8hPOi30Wax25QZyZEGveluCgliBnqmuM+UJmBErbAUFIoDbjOw==",
+            "dependencies": {
+                "forwarded": "~0.1.2",
+                "ipaddr.js": "1.9.1"
+            },
+            "engines": {
+                "node": ">= 0.10"
+            }
+        },
+        "node_modules/proxy-from-env": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
+            "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
+        },
+        "node_modules/prr": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz",
+            "integrity": "sha1-0/wRS6BplaRexok/SEzrHXj19HY=",
+            "dev": true
+        },
+        "node_modules/pseudomap": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/pseudomap/-/pseudomap-1.0.2.tgz",
+            "integrity": "sha1-8FKijacOYYkX7wqKw0wa5aaChrM="
+        },
+        "node_modules/psl": {
+            "version": "1.8.0",
+            "resolved": "https://registry.npmjs.org/psl/-/psl-1.8.0.tgz",
+            "integrity": "sha512-RIdOzyoavK+hA18OGGWDqUTsCLhtA7IcZ/6NCs4fFJaHBDab+pDDmDIByWFRQJq2Cd7r1OoQxBGKOaztq+hjIQ=="
+        },
+        "node_modules/pstree.remy": {
+            "version": "1.1.7",
+            "resolved": "https://registry.npmjs.org/pstree.remy/-/pstree.remy-1.1.7.tgz",
+            "integrity": "sha512-xsMgrUwRpuGskEzBFkH8NmTimbZ5PcPup0LA8JJkHIm2IMUbQcpo3yeLNWVrufEYjh8YwtSVh0xz6UeWc5Oh5A=="
+        },
+        "node_modules/public-encrypt": {
+            "version": "4.0.3",
+            "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.3.tgz",
+            "integrity": "sha512-zVpa8oKZSz5bTMTFClc1fQOnyyEzpl5ozpi1B5YcvBrdohMjH2rfsBtyXcuNuwjsDIXmBYlF2N5FlJYhR29t8Q==",
+            "dev": true,
+            "dependencies": {
+                "bn.js": "^4.1.0",
+                "browserify-rsa": "^4.0.0",
+                "create-hash": "^1.1.0",
+                "parse-asn1": "^5.0.0",
+                "randombytes": "^2.0.1",
+                "safe-buffer": "^5.1.2"
+            }
+        },
+        "node_modules/public-encrypt/node_modules/bn.js": {
+            "version": "4.12.0",
+            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
+            "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==",
+            "dev": true
+        },
+        "node_modules/pug": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/pug/-/pug-2.0.4.tgz",
+            "integrity": "sha512-XhoaDlvi6NIzL49nu094R2NA6P37ijtgMDuWE+ofekDChvfKnzFal60bhSdiy8y2PBO6fmz3oMEIcfpBVRUdvw==",
+            "dependencies": {
+                "pug-code-gen": "^2.0.2",
+                "pug-filters": "^3.1.1",
+                "pug-lexer": "^4.1.0",
+                "pug-linker": "^3.0.6",
+                "pug-load": "^2.0.12",
+                "pug-parser": "^5.0.1",
+                "pug-runtime": "^2.0.5",
+                "pug-strip-comments": "^1.0.4"
+            }
+        },
+        "node_modules/pug-attrs": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/pug-attrs/-/pug-attrs-2.0.4.tgz",
+            "integrity": "sha512-TaZ4Z2TWUPDJcV3wjU3RtUXMrd3kM4Wzjbe3EWnSsZPsJ3LDI0F3yCnf2/W7PPFF+edUFQ0HgDL1IoxSz5K8EQ==",
+            "dependencies": {
+                "constantinople": "^3.0.1",
+                "js-stringify": "^1.0.1",
+                "pug-runtime": "^2.0.5"
+            }
+        },
+        "node_modules/pug-code-gen": {
+            "version": "2.0.2",
+            "resolved": "https://registry.npmjs.org/pug-code-gen/-/pug-code-gen-2.0.2.tgz",
+            "integrity": "sha512-kROFWv/AHx/9CRgoGJeRSm+4mLWchbgpRzTEn8XCiwwOy6Vh0gAClS8Vh5TEJ9DBjaP8wCjS3J6HKsEsYdvaCw==",
+            "dependencies": {
+                "constantinople": "^3.1.2",
+                "doctypes": "^1.1.0",
+                "js-stringify": "^1.0.1",
+                "pug-attrs": "^2.0.4",
+                "pug-error": "^1.3.3",
+                "pug-runtime": "^2.0.5",
+                "void-elements": "^2.0.1",
+                "with": "^5.0.0"
+            }
+        },
+        "node_modules/pug-error": {
+            "version": "1.3.3",
+            "resolved": "https://registry.npmjs.org/pug-error/-/pug-error-1.3.3.tgz",
+            "integrity": "sha512-qE3YhESP2mRAWMFJgKdtT5D7ckThRScXRwkfo+Erqga7dyJdY3ZquspprMCj/9sJ2ijm5hXFWQE/A3l4poMWiQ=="
+        },
+        "node_modules/pug-filters": {
+            "version": "3.1.1",
+            "resolved": "https://registry.npmjs.org/pug-filters/-/pug-filters-3.1.1.tgz",
+            "integrity": "sha512-lFfjNyGEyVWC4BwX0WyvkoWLapI5xHSM3xZJFUhx4JM4XyyRdO8Aucc6pCygnqV2uSgJFaJWW3Ft1wCWSoQkQg==",
+            "dependencies": {
+                "clean-css": "^4.1.11",
+                "constantinople": "^3.0.1",
+                "jstransformer": "1.0.0",
+                "pug-error": "^1.3.3",
+                "pug-walk": "^1.1.8",
+                "resolve": "^1.1.6",
+                "uglify-js": "^2.6.1"
+            }
+        },
+        "node_modules/pug-lexer": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/pug-lexer/-/pug-lexer-4.1.0.tgz",
+            "integrity": "sha512-i55yzEBtjm0mlplW4LoANq7k3S8gDdfC6+LThGEvsK4FuobcKfDAwt6V4jKPH9RtiE3a2Akfg5UpafZ1OksaPA==",
+            "dependencies": {
+                "character-parser": "^2.1.1",
+                "is-expression": "^3.0.0",
+                "pug-error": "^1.3.3"
+            }
+        },
+        "node_modules/pug-linker": {
+            "version": "3.0.6",
+            "resolved": "https://registry.npmjs.org/pug-linker/-/pug-linker-3.0.6.tgz",
+            "integrity": "sha512-bagfuHttfQOpANGy1Y6NJ+0mNb7dD2MswFG2ZKj22s8g0wVsojpRlqveEQHmgXXcfROB2RT6oqbPYr9EN2ZWzg==",
+            "dependencies": {
+                "pug-error": "^1.3.3",
+                "pug-walk": "^1.1.8"
+            }
+        },
+        "node_modules/pug-load": {
+            "version": "2.0.12",
+            "resolved": "https://registry.npmjs.org/pug-load/-/pug-load-2.0.12.tgz",
+            "integrity": "sha512-UqpgGpyyXRYgJs/X60sE6SIf8UBsmcHYKNaOccyVLEuT6OPBIMo6xMPhoJnqtB3Q3BbO4Z3Bjz5qDsUWh4rXsg==",
+            "dependencies": {
+                "object-assign": "^4.1.0",
+                "pug-walk": "^1.1.8"
+            }
+        },
+        "node_modules/pug-parser": {
+            "version": "5.0.1",
+            "resolved": "https://registry.npmjs.org/pug-parser/-/pug-parser-5.0.1.tgz",
+            "integrity": "sha512-nGHqK+w07p5/PsPIyzkTQfzlYfuqoiGjaoqHv1LjOv2ZLXmGX1O+4Vcvps+P4LhxZ3drYSljjq4b+Naid126wA==",
+            "dependencies": {
+                "pug-error": "^1.3.3",
+                "token-stream": "0.0.1"
+            }
+        },
+        "node_modules/pug-runtime": {
+            "version": "2.0.5",
+            "resolved": "https://registry.npmjs.org/pug-runtime/-/pug-runtime-2.0.5.tgz",
+            "integrity": "sha512-P+rXKn9un4fQY77wtpcuFyvFaBww7/91f3jHa154qU26qFAnOe6SW1CbIDcxiG5lLK9HazYrMCCuDvNgDQNptw=="
+        },
+        "node_modules/pug-strip-comments": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/pug-strip-comments/-/pug-strip-comments-1.0.4.tgz",
+            "integrity": "sha512-i5j/9CS4yFhSxHp5iKPHwigaig/VV9g+FgReLJWWHEHbvKsbqL0oP/K5ubuLco6Wu3Kan5p7u7qk8A4oLLh6vw==",
+            "dependencies": {
+                "pug-error": "^1.3.3"
+            }
+        },
+        "node_modules/pug-walk": {
+            "version": "1.1.8",
+            "resolved": "https://registry.npmjs.org/pug-walk/-/pug-walk-1.1.8.tgz",
+            "integrity": "sha512-GMu3M5nUL3fju4/egXwZO0XLi6fW/K3T3VTgFQ14GxNi8btlxgT5qZL//JwZFm/2Fa64J/PNS8AZeys3wiMkVA=="
+        },
+        "node_modules/pump": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz",
+            "integrity": "sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww==",
+            "dependencies": {
+                "end-of-stream": "^1.1.0",
+                "once": "^1.3.1"
+            }
+        },
+        "node_modules/pumpify": {
+            "version": "1.5.1",
+            "resolved": "https://registry.npmjs.org/pumpify/-/pumpify-1.5.1.tgz",
+            "integrity": "sha512-oClZI37HvuUJJxSKKrC17bZ9Cu0ZYhEAGPsPUy9KlMUmv9dKX2o77RUmq7f3XjIxbwyGwYzbzQ1L2Ks8sIradQ==",
+            "dev": true,
+            "dependencies": {
+                "duplexify": "^3.6.0",
+                "inherits": "^2.0.3",
+                "pump": "^2.0.0"
+            }
+        },
+        "node_modules/pumpify/node_modules/pump": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/pump/-/pump-2.0.1.tgz",
+            "integrity": "sha512-ruPMNRkN3MHP1cWJc9OWr+T/xDP0jhXYCLfJcBuX54hhfIBnaQmAUMfDcG4DM5UMWByBbJY69QSphm3jtDKIkA==",
+            "dev": true,
+            "dependencies": {
+                "end-of-stream": "^1.1.0",
+                "once": "^1.3.1"
+            }
+        },
+        "node_modules/punycode": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.1.1.tgz",
+            "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/puppeteer": {
+            "version": "3.3.0",
+            "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-3.3.0.tgz",
+            "integrity": "sha512-23zNqRltZ1PPoK28uRefWJ/zKb5Jhnzbbwbpcna2o5+QMn17F0khq5s1bdH3vPlyj+J36pubccR8wiNA/VE0Vw==",
+            "hasInstallScript": true,
+            "dependencies": {
+                "debug": "^4.1.0",
+                "extract-zip": "^2.0.0",
+                "https-proxy-agent": "^4.0.0",
+                "mime": "^2.0.3",
+                "progress": "^2.0.1",
+                "proxy-from-env": "^1.0.0",
+                "rimraf": "^3.0.2",
+                "tar-fs": "^2.0.0",
+                "unbzip2-stream": "^1.3.3",
+                "ws": "^7.2.3"
+            },
+            "engines": {
+                "node": ">=10.18.1"
+            }
+        },
+        "node_modules/puppeteer/node_modules/agent-base": {
+            "version": "5.1.1",
+            "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-5.1.1.tgz",
+            "integrity": "sha512-TMeqbNl2fMW0nMjTEPOwe3J/PRFP4vqeoNuQMG0HlMrtm5QxKqdvAkZ1pRBQ/ulIyDD5Yq0nJ7YbdD8ey0TO3g==",
+            "engines": {
+                "node": ">= 6.0.0"
+            }
+        },
+        "node_modules/puppeteer/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/puppeteer/node_modules/https-proxy-agent": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-4.0.0.tgz",
+            "integrity": "sha512-zoDhWrkR3of1l9QAL8/scJZyLu8j/gBkcwcaQOZh7Gyh/+uJQzGVETdgT30akuwkpL8HTRfssqI3BZuV18teDg==",
+            "dependencies": {
+                "agent-base": "5",
+                "debug": "4"
+            },
+            "engines": {
+                "node": ">= 6.0.0"
+            }
+        },
+        "node_modules/puppeteer/node_modules/mime": {
+            "version": "2.4.6",
+            "resolved": "https://registry.npmjs.org/mime/-/mime-2.4.6.tgz",
+            "integrity": "sha512-RZKhC3EmpBchfTGBVb8fb+RL2cWyw/32lshnsETttkBAyAUXSGHxbEJWWRXc751DrIxG1q04b8QwMbAwkRPpUA==",
+            "bin": {
+                "mime": "cli.js"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/pure-color": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/pure-color/-/pure-color-1.3.0.tgz",
+            "integrity": "sha1-H+Bk+wrIUfDeYTIKi/eWg2Qi8z4="
+        },
+        "node_modules/q": {
+            "version": "1.5.1",
+            "resolved": "https://registry.npmjs.org/q/-/q-1.5.1.tgz",
+            "integrity": "sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc=",
+            "engines": {
+                "node": ">=0.6.0",
+                "teleport": ">=0.2.0"
+            }
+        },
+        "node_modules/qs": {
+            "version": "6.5.2",
+            "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.2.tgz",
+            "integrity": "sha512-N5ZAX4/LxJmF+7wN74pUD6qAh9/wnvdQcjq9TZjevvXzSUo7bfmw91saqMjzGS2xq91/odN2dW/WOl7qQHNDGA==",
+            "engines": {
+                "node": ">=0.6"
+            }
+        },
+        "node_modules/query-string": {
+            "version": "6.13.1",
+            "resolved": "https://registry.npmjs.org/query-string/-/query-string-6.13.1.tgz",
+            "integrity": "sha512-RfoButmcK+yCta1+FuU8REvisx1oEzhMKwhLUNcepQTPGcNMp1sIqjnfCtfnvGSQZQEhaBHvccujtWoUV3TTbA==",
+            "dependencies": {
+                "decode-uri-component": "^0.2.0",
+                "split-on-first": "^1.0.0",
+                "strict-uri-encode": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/querystring": {
+            "version": "0.2.0",
+            "resolved": "https://registry.npmjs.org/querystring/-/querystring-0.2.0.tgz",
+            "integrity": "sha1-sgmEkgO7Jd+CDadW50cAWHhSFiA=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.4.x"
+            }
+        },
+        "node_modules/querystring-es3": {
+            "version": "0.2.1",
+            "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz",
+            "integrity": "sha1-nsYfeQSYdXB9aUFFlv2Qek1xHnM=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.4.x"
+            }
+        },
+        "node_modules/querystringify": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.1.1.tgz",
+            "integrity": "sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA==",
+            "dev": true
+        },
+        "node_modules/raf-schd": {
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/raf-schd/-/raf-schd-4.0.2.tgz",
+            "integrity": "sha512-VhlMZmGy6A6hrkJWHLNTGl5gtgMUm+xfGza6wbwnE914yeQ5Ybm18vgM734RZhMgfw4tacUrWseGZlpUrrakEQ=="
+        },
+        "node_modules/random-bytes": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/random-bytes/-/random-bytes-1.0.0.tgz",
+            "integrity": "sha1-T2ih3Arli9P7lYSMMDJNt11kNgs=",
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/randombytes": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
+            "integrity": "sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==",
+            "dev": true,
+            "dependencies": {
+                "safe-buffer": "^5.1.0"
+            }
+        },
+        "node_modules/randomfill": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/randomfill/-/randomfill-1.0.4.tgz",
+            "integrity": "sha512-87lcbR8+MhcWcUiQ+9e+Rwx8MyR2P7qnt15ynUlbm3TU/fjbgz4GsvfSUDTemtCCtVCqb4ZcEFlyPNTh9bBTLw==",
+            "dev": true,
+            "dependencies": {
+                "randombytes": "^2.0.5",
+                "safe-buffer": "^5.1.0"
+            }
+        },
+        "node_modules/range-parser": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz",
+            "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/raw-body": {
+            "version": "2.4.0",
+            "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.4.0.tgz",
+            "integrity": "sha512-4Oz8DUIwdvoa5qMJelxipzi/iJIi40O5cGV1wNYp5hvZP8ZN0T+jiNkL0QepXs+EsQ9XJ8ipEDoiH70ySUJP3Q==",
+            "dependencies": {
+                "bytes": "3.1.0",
+                "http-errors": "1.7.2",
+                "iconv-lite": "0.4.24",
+                "unpipe": "1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/raw-loader": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-1.0.0.tgz",
+            "integrity": "sha512-Uqy5AqELpytJTRxYT4fhltcKPj0TyaEpzJDcGz7DFJi+pQOOi3GjR/DOdxTkTsF+NzhnldIoG6TORaBlInUuqA==",
+            "dependencies": {
+                "loader-utils": "^1.1.0",
+                "schema-utils": "^1.0.0"
+            },
+            "engines": {
+                "node": ">= 6.9.0"
+            }
+        },
+        "node_modules/raw-loader/node_modules/schema-utils": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
+            "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
+            "dependencies": {
+                "ajv": "^6.1.0",
+                "ajv-errors": "^1.0.0",
+                "ajv-keywords": "^3.1.0"
+            },
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/rc": {
+            "version": "1.2.8",
+            "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz",
+            "integrity": "sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==",
+            "dependencies": {
+                "deep-extend": "^0.6.0",
+                "ini": "~1.3.0",
+                "minimist": "^1.2.0",
+                "strip-json-comments": "~2.0.1"
+            },
+            "bin": {
+                "rc": "cli.js"
+            }
+        },
+        "node_modules/rc-switch": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/rc-switch/-/rc-switch-1.9.0.tgz",
+            "integrity": "sha512-Isas+egaK6qSk64jaEw4GgPStY4umYDbT7ZY93bZF1Af+b/JEsKsJdNOU2qG3WI0Z6tXo2DDq0kJCv8Yhu0zww==",
+            "dependencies": {
+                "classnames": "^2.2.1",
+                "prop-types": "^15.5.6",
+                "react-lifecycles-compat": "^3.0.4"
+            }
+        },
+        "node_modules/react": {
+            "version": "16.13.1",
+            "resolved": "https://registry.npmjs.org/react/-/react-16.13.1.tgz",
+            "integrity": "sha512-YMZQQq32xHLX0bz5Mnibv1/LHb3Sqzngu7xstSM+vrkE5Kzr9xE0yMByK5kMoTK30YVJE61WfbxIFFvfeDKT1w==",
+            "dependencies": {
+                "loose-envify": "^1.1.0",
+                "object-assign": "^4.1.1",
+                "prop-types": "^15.6.2"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/react-audio-waveform": {
+            "version": "0.0.5",
+            "resolved": "https://registry.npmjs.org/react-audio-waveform/-/react-audio-waveform-0.0.5.tgz",
+            "integrity": "sha512-4dJwhl+LQRuywzmmjuhWT5GueT3Ai2ZhB+loVxg0sRdhplyDp96xAu10/V/+J25Cl7YqNtl2DWSxvSoI/i6l6w=="
+        },
+        "node_modules/react-autosuggest": {
+            "version": "9.4.3",
+            "resolved": "https://registry.npmjs.org/react-autosuggest/-/react-autosuggest-9.4.3.tgz",
+            "integrity": "sha512-wFbp5QpgFQRfw9cwKvcgLR8theikOUkv8PFsuLYqI2PUgVlx186Cz8MYt5bLxculi+jxGGUUVt+h0esaBZZouw==",
+            "dependencies": {
+                "prop-types": "^15.5.10",
+                "react-autowhatever": "^10.1.2",
+                "shallow-equal": "^1.0.0"
+            }
+        },
+        "node_modules/react-autowhatever": {
+            "version": "10.2.1",
+            "resolved": "https://registry.npmjs.org/react-autowhatever/-/react-autowhatever-10.2.1.tgz",
+            "integrity": "sha512-5gQyoETyBH6GmuW1N1J81CuoAV+Djeg66DEo03xiZOl3WOwJHBP5LisKUvCGOakjrXU4M3hcIvCIqMBYGUmqOA==",
+            "dependencies": {
+                "prop-types": "^15.5.8",
+                "react-themeable": "^1.1.0",
+                "section-iterator": "^2.0.0"
+            }
+        },
+        "node_modules/react-base16-styling": {
+            "version": "0.5.3",
+            "resolved": "https://registry.npmjs.org/react-base16-styling/-/react-base16-styling-0.5.3.tgz",
+            "integrity": "sha1-OFjyTpxN2MvT9wLz901YHKKRcmk=",
+            "dependencies": {
+                "base16": "^1.0.0",
+                "lodash.curry": "^4.0.1",
+                "lodash.flow": "^3.3.0",
+                "pure-color": "^1.2.0"
+            }
+        },
+        "node_modules/react-beautiful-dnd": {
+            "version": "13.0.0",
+            "resolved": "https://registry.npmjs.org/react-beautiful-dnd/-/react-beautiful-dnd-13.0.0.tgz",
+            "integrity": "sha512-87It8sN0ineoC3nBW0SbQuTFXM6bUqM62uJGY4BtTf0yzPl8/3+bHMWkgIe0Z6m8e+gJgjWxefGRVfpE3VcdEg==",
+            "dependencies": {
+                "@babel/runtime": "^7.8.4",
+                "css-box-model": "^1.2.0",
+                "memoize-one": "^5.1.1",
+                "raf-schd": "^4.0.2",
+                "react-redux": "^7.1.1",
+                "redux": "^4.0.4",
+                "use-memo-one": "^1.1.1"
+            }
+        },
+        "node_modules/react-color": {
+            "version": "2.18.1",
+            "resolved": "https://registry.npmjs.org/react-color/-/react-color-2.18.1.tgz",
+            "integrity": "sha512-X5XpyJS6ncplZs74ak0JJoqPi+33Nzpv5RYWWxn17bslih+X7OlgmfpmGC1fNvdkK7/SGWYf1JJdn7D2n5gSuQ==",
+            "dependencies": {
+                "@icons/material": "^0.2.4",
+                "lodash": "^4.17.11",
+                "material-colors": "^1.2.1",
+                "prop-types": "^15.5.10",
+                "reactcss": "^1.2.0",
+                "tinycolor2": "^1.4.1"
+            }
+        },
+        "node_modules/react-compound-slider": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/react-compound-slider/-/react-compound-slider-2.5.0.tgz",
+            "integrity": "sha512-T84FtSI0bkQPmH5GaaHbL+2McOyIR6M5sqS80dqw/bHc5r2UKLYY64BWTbsL+XO0jlx7REuJJnZUBqo4eSRl7g==",
+            "dependencies": {
+                "@babel/runtime": "^7.7.7",
+                "d3-array": "^1.2.4",
+                "prop-types": "^15.7.2",
+                "warning": "^3.0.0"
+            }
+        },
+        "node_modules/react-datepicker": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-3.0.0.tgz",
+            "integrity": "sha512-Yrxan1tERAiWS0EzitpiaiXOIz0APTUtV75uWbaS+jSaKoGCR6wUN2FDwr1ACGlnEoGhR9QQ2Vq3odnWtgJsOA==",
+            "dependencies": {
+                "classnames": "^2.2.6",
+                "date-fns": "^2.0.1",
+                "prop-types": "^15.7.2",
+                "react-onclickoutside": "^6.9.0",
+                "react-popper": "^1.3.4"
+            }
+        },
+        "node_modules/react-dock": {
+            "version": "0.2.4",
+            "resolved": "https://registry.npmjs.org/react-dock/-/react-dock-0.2.4.tgz",
+            "integrity": "sha1-5yfcdVCztzEWY13LnA4E0Lev4Xw=",
+            "dependencies": {
+                "lodash.debounce": "^3.1.1",
+                "prop-types": "^15.5.8"
+            }
+        },
+        "node_modules/react-dom": {
+            "version": "16.13.1",
+            "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.13.1.tgz",
+            "integrity": "sha512-81PIMmVLnCNLO/fFOQxdQkvEq/+Hfpv24XNJfpyZhTRfO0QcmQIF/PgCa1zCOj2w1hrn12MFLyaJ/G0+Mxtfag==",
+            "dependencies": {
+                "loose-envify": "^1.1.0",
+                "object-assign": "^4.1.1",
+                "prop-types": "^15.6.2",
+                "scheduler": "^0.19.1"
+            }
+        },
+        "node_modules/react-draggable": {
+            "version": "4.4.3",
+            "resolved": "https://registry.npmjs.org/react-draggable/-/react-draggable-4.4.3.tgz",
+            "integrity": "sha512-jV4TE59MBuWm7gb6Ns3Q1mxX8Azffb7oTtDtBgFkxRvhDp38YAARmRplrj0+XGkhOJB5XziArX+4HUUABtyZ0w==",
+            "dependencies": {
+                "classnames": "^2.2.5",
+                "prop-types": "^15.6.0"
+            }
+        },
+        "node_modules/react-event-listener": {
+            "version": "0.6.6",
+            "resolved": "https://registry.npmjs.org/react-event-listener/-/react-event-listener-0.6.6.tgz",
+            "integrity": "sha512-+hCNqfy7o9wvO6UgjqFmBzARJS7qrNoda0VqzvOuioEpoEXKutiKuv92dSz6kP7rYLmyHPyYNLesi5t/aH1gfw==",
+            "dependencies": {
+                "@babel/runtime": "^7.2.0",
+                "prop-types": "^15.6.0",
+                "warning": "^4.0.1"
+            }
+        },
+        "node_modules/react-event-listener/node_modules/warning": {
+            "version": "4.0.3",
+            "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
+            "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
+            "dependencies": {
+                "loose-envify": "^1.0.0"
+            }
+        },
+        "node_modules/react-grid-layout": {
+            "version": "0.18.3",
+            "resolved": "https://registry.npmjs.org/react-grid-layout/-/react-grid-layout-0.18.3.tgz",
+            "integrity": "sha512-lHkrk941Tk5nTwZPa9uj6ttHBT0VehSHwEhWbINBJKvM1GRaFNOefvjcuxSyuCI5JWjVUP+Qm3ARt2470AlxMA==",
+            "dependencies": {
+                "classnames": "2.x",
+                "lodash.isequal": "^4.0.0",
+                "prop-types": "^15.0.0",
+                "react-draggable": "^4.0.0",
+                "react-resizable": "^1.9.0"
+            }
+        },
+        "node_modules/react-image-lightbox-with-rotate": {
+            "version": "5.1.1",
+            "resolved": "https://registry.npmjs.org/react-image-lightbox-with-rotate/-/react-image-lightbox-with-rotate-5.1.1.tgz",
+            "integrity": "sha512-5ZubUQefKSDGIiAwK4lkfmGr/bgIfNDHXqC+Fm6nbNwTVYuYOZ1RJjULOniEB4fxb3Vm0z/x0oNhi1lbP1aMtg==",
+            "dependencies": {
+                "blueimp-load-image": "^2.19.0",
+                "prop-types": "^15.6.1",
+                "react-modal": "^3.4.4"
+            }
+        },
+        "node_modules/react-input-autosize": {
+            "version": "2.2.2",
+            "resolved": "https://registry.npmjs.org/react-input-autosize/-/react-input-autosize-2.2.2.tgz",
+            "integrity": "sha512-jQJgYCA3S0j+cuOwzuCd1OjmBmnZLdqQdiLKRYrsMMzbjUrVDS5RvJUDwJqA7sKuksDuzFtm6hZGKFu7Mjk5aw==",
+            "dependencies": {
+                "prop-types": "^15.5.8"
+            }
+        },
+        "node_modules/react-is": {
+            "version": "16.13.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
+            "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
+        },
+        "node_modules/react-json-tree": {
+            "version": "0.11.2",
+            "resolved": "https://registry.npmjs.org/react-json-tree/-/react-json-tree-0.11.2.tgz",
+            "integrity": "sha512-aYhUPj1y5jR3ZQ+G3N7aL8FbTyO03iLwnVvvEikLcNFqNTyabdljo9xDftZndUBFyyyL0aK3qGO9+8EilILHUw==",
+            "dependencies": {
+                "babel-runtime": "^6.6.1",
+                "prop-types": "^15.5.8",
+                "react-base16-styling": "^0.5.1"
+            }
+        },
+        "node_modules/react-jsx-parser": {
+            "version": "1.25.1",
+            "resolved": "https://registry.npmjs.org/react-jsx-parser/-/react-jsx-parser-1.25.1.tgz",
+            "integrity": "sha512-lCHAw7iOocnPSpjfsHXZQGLyPpr9wlk3qtkVN44hZs0PwQuxcH8MWbLY+j6pqB9QSijM7qtulDLgFIYbAcqSmQ==",
+            "dependencies": {
+                "acorn": "^7.2.0",
+                "acorn-jsx": "^5.2.0",
+                "core-js": "^3.6.5"
+            }
+        },
+        "node_modules/react-jsx-parser/node_modules/acorn": {
+            "version": "7.3.1",
+            "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.3.1.tgz",
+            "integrity": "sha512-tLc0wSnatxAQHVHUapaHdz72pi9KUyHjq5KyHjGg9Y8Ifdc79pTh2XvI6I1/chZbnM7QtNKzh66ooDogPZSleA==",
+            "bin": {
+                "acorn": "bin/acorn"
+            },
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/react-jsx-parser/node_modules/core-js": {
+            "version": "3.6.5",
+            "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.6.5.tgz",
+            "integrity": "sha512-vZVEEwZoIsI+vPEuoF9Iqf5H7/M3eeQqWlQnYa8FSKKePuYTf5MWnxb5SDAzCa60b3JBRS5g9b+Dq7b1y/RCrA==",
+            "hasInstallScript": true
+        },
+        "node_modules/react-lifecycles-compat": {
+            "version": "3.0.4",
+            "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
+            "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
+        },
+        "node_modules/react-loading": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/react-loading/-/react-loading-2.0.3.tgz",
+            "integrity": "sha512-Vdqy79zq+bpeWJqC+xjltUjuGApyoItPgL0vgVfcJHhqwU7bAMKzysfGW/ADu6i0z0JiOCRJjo+IkFNkRNbA3A=="
+        },
+        "node_modules/react-measure": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/react-measure/-/react-measure-2.3.0.tgz",
+            "integrity": "sha512-dwAvmiOeblj5Dvpnk8Jm7Q8B4THF/f1l1HtKVi0XDecsG6LXwGvzV5R1H32kq3TW6RW64OAf5aoQxpIgLa4z8A==",
+            "dependencies": {
+                "@babel/runtime": "^7.2.0",
+                "get-node-dimensions": "^1.2.1",
+                "prop-types": "^15.6.2",
+                "resize-observer-polyfill": "^1.5.0"
+            }
+        },
+        "node_modules/react-merge-refs": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/react-merge-refs/-/react-merge-refs-1.1.0.tgz",
+            "integrity": "sha512-alTKsjEL0dKH/ru1Iyn7vliS2QRcBp9zZPGoWxUOvRGWPUYgjo+V01is7p04It6KhgrzhJGnIj9GgX8W4bZoCQ=="
+        },
+        "node_modules/react-modal": {
+            "version": "3.11.2",
+            "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.11.2.tgz",
+            "integrity": "sha512-o8gvvCOFaG1T7W6JUvsYjRjMVToLZgLIsi5kdhFIQCtHxDkA47LznX62j+l6YQkpXDbvQegsDyxe/+JJsFQN7w==",
+            "dependencies": {
+                "exenv": "^1.2.0",
+                "prop-types": "^15.5.10",
+                "react-lifecycles-compat": "^3.0.0",
+                "warning": "^4.0.3"
+            }
+        },
+        "node_modules/react-modal/node_modules/warning": {
+            "version": "4.0.3",
+            "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
+            "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
+            "dependencies": {
+                "loose-envify": "^1.0.0"
+            }
+        },
+        "node_modules/react-onclickoutside": {
+            "version": "6.9.0",
+            "resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.9.0.tgz",
+            "integrity": "sha512-8ltIY3bC7oGhj2nPAvWOGi+xGFybPNhJM0V1H8hY/whNcXgmDeaeoCMPPd8VatrpTsUWjb/vGzrmu6SrXVty3A=="
+        },
+        "node_modules/react-popper": {
+            "version": "1.3.7",
+            "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-1.3.7.tgz",
+            "integrity": "sha512-nmqYTx7QVjCm3WUZLeuOomna138R1luC4EqkW3hxJUrAe+3eNz3oFCLYdnPwILfn0mX1Ew2c3wctrjlUMYYUww==",
+            "dependencies": {
+                "@babel/runtime": "^7.1.2",
+                "create-react-context": "^0.3.0",
+                "deep-equal": "^1.1.1",
+                "popper.js": "^1.14.4",
+                "prop-types": "^15.6.1",
+                "typed-styles": "^0.0.7",
+                "warning": "^4.0.2"
+            }
+        },
+        "node_modules/react-popper/node_modules/create-react-context": {
+            "version": "0.3.0",
+            "resolved": "https://registry.npmjs.org/create-react-context/-/create-react-context-0.3.0.tgz",
+            "integrity": "sha512-dNldIoSuNSvlTJ7slIKC/ZFGKexBMBrrcc+TTe1NdmROnaASuLPvqpwj9v4XS4uXZ8+YPu0sNmShX2rXI5LNsw==",
+            "dependencies": {
+                "gud": "^1.0.0",
+                "warning": "^4.0.3"
+            }
+        },
+        "node_modules/react-popper/node_modules/warning": {
+            "version": "4.0.3",
+            "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
+            "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
+            "dependencies": {
+                "loose-envify": "^1.0.0"
+            }
+        },
+        "node_modules/react-reconciler": {
+            "version": "0.26.2",
+            "resolved": "https://registry.npmjs.org/react-reconciler/-/react-reconciler-0.26.2.tgz",
+            "integrity": "sha512-nK6kgY28HwrMNwDnMui3dvm3rCFjZrcGiuwLc5COUipBK5hWHLOxMJhSnSomirqWwjPBJKV1QcbkI0VJr7Gl1Q==",
+            "dependencies": {
+                "loose-envify": "^1.1.0",
+                "object-assign": "^4.1.1",
+                "scheduler": "^0.20.2"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/react-reconciler/node_modules/scheduler": {
+            "version": "0.20.2",
+            "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
+            "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
+            "dependencies": {
+                "loose-envify": "^1.1.0",
+                "object-assign": "^4.1.1"
+            }
+        },
+        "node_modules/react-redux": {
+            "version": "7.2.0",
+            "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.0.tgz",
+            "integrity": "sha512-EvCAZYGfOLqwV7gh849xy9/pt55rJXPwmYvI4lilPM5rUT/1NxuuN59ipdBksRVSvz0KInbPnp4IfoXJXCqiDA==",
+            "dependencies": {
+                "@babel/runtime": "^7.5.5",
+                "hoist-non-react-statics": "^3.3.0",
+                "loose-envify": "^1.4.0",
+                "prop-types": "^15.7.2",
+                "react-is": "^16.9.0"
+            }
+        },
+        "node_modules/react-resizable": {
+            "version": "1.10.1",
+            "resolved": "https://registry.npmjs.org/react-resizable/-/react-resizable-1.10.1.tgz",
+            "integrity": "sha512-Jd/bKOKx6+19NwC4/aMLRu/J9/krfxlDnElP41Oc+oLiUWs/zwV1S9yBfBZRnqAwQb6vQ/HRSk3bsSWGSgVbpw==",
+            "dependencies": {
+                "prop-types": "15.x",
+                "react-draggable": "^4.0.3"
+            }
+        },
+        "node_modules/react-resizable-rotatable-draggable": {
+            "version": "0.2.0",
+            "resolved": "https://registry.npmjs.org/react-resizable-rotatable-draggable/-/react-resizable-rotatable-draggable-0.2.0.tgz",
+            "integrity": "sha512-F8TPx3z7/AcmRViySbYV3LpUWXFpHlGAmKmNcYMgPlS+h1eYFazRG3xYS8Z6e48hWY1EcCny/YNrwRNUrap8CQ==",
+            "engines": {
+                "node": ">=8",
+                "npm": ">=6"
+            }
+        },
+        "node_modules/react-reveal": {
+            "version": "1.2.2",
+            "resolved": "https://registry.npmjs.org/react-reveal/-/react-reveal-1.2.2.tgz",
+            "integrity": "sha512-JCv3fAoU6Z+Lcd8U48bwzm4pMZ79qsedSXYwpwt6lJNtj/v5nKJYZZbw3yhaQPPgYePo3Y0NOCoYOq/jcsisuw==",
+            "dependencies": {
+                "prop-types": "^15.5.10"
+            }
+        },
+        "node_modules/react-select": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/react-select/-/react-select-3.1.0.tgz",
+            "integrity": "sha512-wBFVblBH1iuCBprtpyGtd1dGMadsG36W5/t2Aj8OE6WbByDg5jIFyT7X5gT+l0qmT5TqWhxX+VsKJvCEl2uL9g==",
+            "dependencies": {
+                "@babel/runtime": "^7.4.4",
+                "@emotion/cache": "^10.0.9",
+                "@emotion/core": "^10.0.9",
+                "@emotion/css": "^10.0.9",
+                "memoize-one": "^5.0.0",
+                "prop-types": "^15.6.0",
+                "react-input-autosize": "^2.2.2",
+                "react-transition-group": "^4.3.0"
+            }
+        },
+        "node_modules/react-select/node_modules/dom-helpers": {
+            "version": "5.1.4",
+            "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.1.4.tgz",
+            "integrity": "sha512-TjMyeVUvNEnOnhzs6uAn9Ya47GmMo3qq7m+Lr/3ON0Rs5kHvb8I+SQYjLUSYn7qhEm0QjW0yrBkvz9yOrwwz1A==",
+            "dependencies": {
+                "@babel/runtime": "^7.8.7",
+                "csstype": "^2.6.7"
+            }
+        },
+        "node_modules/react-select/node_modules/react-transition-group": {
+            "version": "4.4.1",
+            "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.1.tgz",
+            "integrity": "sha512-Djqr7OQ2aPUiYurhPalTrVy9ddmFCCzwhqQmtN+J3+3DzLO209Fdr70QrN8Z3DsglWql6iY1lDWAfpFiBtuKGw==",
+            "dependencies": {
+                "@babel/runtime": "^7.5.5",
+                "dom-helpers": "^5.0.1",
+                "loose-envify": "^1.4.0",
+                "prop-types": "^15.6.2"
+            }
+        },
+        "node_modules/react-table": {
+            "version": "6.11.5",
+            "resolved": "https://registry.npmjs.org/react-table/-/react-table-6.11.5.tgz",
+            "integrity": "sha512-LM+AS9v//7Y7lAlgTWW/cW6Sn5VOb3EsSkKQfQTzOW8FngB1FUskLLNEVkAYsTX9LjOWR3QlGjykJqCE6eXT/g==",
+            "dependencies": {
+                "@types/react-table": "^6.8.5",
+                "classnames": "^2.2.5",
+                "react-is": "^16.8.1"
+            }
+        },
+        "node_modules/react-themeable": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/react-themeable/-/react-themeable-1.1.0.tgz",
+            "integrity": "sha1-fURm3ZsrX6dQWHJ4JenxUro3mg4=",
+            "dependencies": {
+                "object-assign": "^3.0.0"
+            }
+        },
+        "node_modules/react-themeable/node_modules/object-assign": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
+            "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/react-three-fiber": {
+            "version": "0.0.0-deprecated",
+            "resolved": "https://registry.npmjs.org/react-three-fiber/-/react-three-fiber-0.0.0-deprecated.tgz",
+            "integrity": "sha512-EblIqTAsIpkYeM8bZtC4lcpTE0A2zCEGipFB52RgcQq/q+0oryrk7Sxt+sqhIjUu6xMNEVywV8dr74lz5yWO6A=="
+        },
+        "node_modules/react-transition-group": {
+            "version": "2.9.0",
+            "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-2.9.0.tgz",
+            "integrity": "sha512-+HzNTCHpeQyl4MJ/bdE0u6XRMe9+XG/+aL4mCxVN4DnPBQ0/5bfHWPDuOZUzYdMj94daZaZdCCc1Dzt9R/xSSg==",
+            "dependencies": {
+                "dom-helpers": "^3.4.0",
+                "loose-envify": "^1.4.0",
+                "prop-types": "^15.6.2",
+                "react-lifecycles-compat": "^3.0.4"
+            }
+        },
+        "node_modules/react-use-measure": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/react-use-measure/-/react-use-measure-2.0.4.tgz",
+            "integrity": "sha512-7K2HIGaPMl3Q9ZQiEVjen3tRXl4UDda8LiTPy/QxP8dP2rl5gPBhf7mMH6MVjjRNv3loU7sNzey/ycPNnHVTxQ==",
+            "dependencies": {
+                "debounce": "^1.2.0"
+            }
+        },
+        "node_modules/reactcss": {
+            "version": "1.2.3",
+            "resolved": "https://registry.npmjs.org/reactcss/-/reactcss-1.2.3.tgz",
+            "integrity": "sha512-KiwVUcFu1RErkI97ywr8nvx8dNOpT03rbnma0SSalTYjkrPYaEajR4a/MRt6DZ46K6arDRbWMNHF+xH7G7n/8A==",
+            "dependencies": {
+                "lodash": "^4.0.1"
+            }
+        },
+        "node_modules/read-pkg": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
+            "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
+            "dependencies": {
+                "load-json-file": "^1.0.0",
+                "normalize-package-data": "^2.3.2",
+                "path-type": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/read-pkg-up": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
+            "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
+            "dependencies": {
+                "find-up": "^1.0.0",
+                "read-pkg": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/read-pkg-up/node_modules/find-up": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
+            "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
+            "dependencies": {
+                "path-exists": "^2.0.0",
+                "pinkie-promise": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/read-pkg-up/node_modules/path-exists": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
+            "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
+            "dependencies": {
+                "pinkie-promise": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/read-pkg/node_modules/path-type": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
+            "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
+            "dependencies": {
+                "graceful-fs": "^4.1.2",
+                "pify": "^2.0.0",
+                "pinkie-promise": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/read-pkg/node_modules/pify": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+            "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/readable-stream": {
+            "version": "3.6.0",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
+            "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
+            "dependencies": {
+                "inherits": "^2.0.3",
+                "string_decoder": "^1.1.1",
+                "util-deprecate": "^1.0.1"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/readdirp": {
+            "version": "2.2.1",
+            "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.2.1.tgz",
+            "integrity": "sha512-1JU/8q+VgFZyxwrJ+SVIOsh+KywWGpds3NTqikiKpDMZWScmAYyKIgqkO+ARvNWJfXeXR1zxz7aHF4u4CyH6vQ==",
+            "dependencies": {
+                "graceful-fs": "^4.1.11",
+                "micromatch": "^3.1.10",
+                "readable-stream": "^2.0.2"
+            },
+            "engines": {
+                "node": ">=0.10"
+            }
+        },
+        "node_modules/readdirp/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/readline": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/readline/-/readline-1.3.0.tgz",
+            "integrity": "sha1-xYDXfvLPyHUrEySYBg3JeTp6wBw="
+        },
+        "node_modules/rechoir": {
+            "version": "0.6.2",
+            "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
+            "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=",
+            "dependencies": {
+                "resolve": "^1.1.6"
+            },
+            "engines": {
+                "node": ">= 0.10"
+            }
+        },
+        "node_modules/recompose": {
+            "version": "0.26.0",
+            "resolved": "https://registry.npmjs.org/recompose/-/recompose-0.26.0.tgz",
+            "integrity": "sha512-KwOu6ztO0mN5vy3+zDcc45lgnaUoaQse/a5yLVqtzTK13czSWnFGmXbQVmnoMgDkI5POd1EwIKSbjU1V7xdZog==",
+            "dependencies": {
+                "change-emitter": "^0.1.2",
+                "fbjs": "^0.8.1",
+                "hoist-non-react-statics": "^2.3.1",
+                "symbol-observable": "^1.0.4"
+            }
+        },
+        "node_modules/recompose/node_modules/hoist-non-react-statics": {
+            "version": "2.5.5",
+            "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
+            "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
+        },
+        "node_modules/redent": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/redent/-/redent-1.0.0.tgz",
+            "integrity": "sha1-z5Fqsf1fHxbfsggi3W7H9zDCr94=",
+            "dependencies": {
+                "indent-string": "^2.1.0",
+                "strip-indent": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/reduce-flatten": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/reduce-flatten/-/reduce-flatten-1.0.1.tgz",
+            "integrity": "sha1-JYx479FT3fk8tWEjf2EYTzaW4yc=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/redux": {
+            "version": "4.0.5",
+            "resolved": "https://registry.npmjs.org/redux/-/redux-4.0.5.tgz",
+            "integrity": "sha512-VSz1uMAH24DM6MF72vcojpYPtrTUu3ByVWfPL1nPfVRb5mZVTve5GnNCUV53QM/BZ66xfWrm0CTWoM+Xlz8V1w==",
+            "dependencies": {
+                "loose-envify": "^1.4.0",
+                "symbol-observable": "^1.2.0"
+            }
+        },
+        "node_modules/regenerator-runtime": {
+            "version": "0.13.5",
+            "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.5.tgz",
+            "integrity": "sha512-ZS5w8CpKFinUzOwW3c83oPeVXoNsrLsaCoLtJvAClH135j/R77RuymhiSErhm2lKcwSCIpmvIWSbDkIfAqKQlA=="
+        },
+        "node_modules/regex-not": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/regex-not/-/regex-not-1.0.2.tgz",
+            "integrity": "sha512-J6SDjUgDxQj5NusnOtdFxDwN/+HWykR8GELwctJ7mdqhcyy1xEc4SRFHUXvxTp661YaVKAjfRLZ9cCqS6tn32A==",
+            "dependencies": {
+                "extend-shallow": "^3.0.2",
+                "safe-regex": "^1.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/regexp-clone": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/regexp-clone/-/regexp-clone-1.0.0.tgz",
+            "integrity": "sha512-TuAasHQNamyyJ2hb97IuBEif4qBHGjPHBS64sZwytpLEqtBQ1gPJTnOaQ6qmpET16cK14kkjbazl6+p0RRv0yw=="
+        },
+        "node_modules/regexp.prototype.flags": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.3.0.tgz",
+            "integrity": "sha512-2+Q0C5g951OlYlJz6yu5/M33IcsESLlLfsyIaLJaG4FA2r4yP8MvVMJUUP/fVBkSpbbbZlS5gynbEWLipiiXiQ==",
+            "dependencies": {
+                "define-properties": "^1.1.3",
+                "es-abstract": "^1.17.0-next.1"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/registry-auth-token": {
+            "version": "3.4.0",
+            "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.4.0.tgz",
+            "integrity": "sha512-4LM6Fw8eBQdwMYcES4yTnn2TqIasbXuwDx3um+QRs7S55aMKCBKBxvPXl2RiUjHwuJLTyYfxSpmfSAjQpcuP+A==",
+            "dependencies": {
+                "rc": "^1.1.6",
+                "safe-buffer": "^5.0.1"
+            }
+        },
+        "node_modules/registry-url": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz",
+            "integrity": "sha1-PU74cPc93h138M+aOBQyRE4XSUI=",
+            "dependencies": {
+                "rc": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/remove-trailing-separator": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz",
+            "integrity": "sha1-wkvOKig62tW8P1jg1IJJuSN52O8="
+        },
+        "node_modules/repeat-element": {
+            "version": "1.1.3",
+            "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.3.tgz",
+            "integrity": "sha512-ahGq0ZnV5m5XtZLMb+vP76kcAM5nkLqk0lpqAuojSKGgQtn4eRi4ZZGm2olo2zKFH+sMsWaqOCW1dqAnOru72g==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/repeat-string": {
+            "version": "1.6.1",
+            "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz",
+            "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc=",
+            "engines": {
+                "node": ">=0.10"
+            }
+        },
+        "node_modules/repeating": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz",
+            "integrity": "sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo=",
+            "dependencies": {
+                "is-finite": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/request": {
+            "version": "2.88.2",
+            "resolved": "https://registry.npmjs.org/request/-/request-2.88.2.tgz",
+            "integrity": "sha512-MsvtOrfG9ZcrOwAW+Qi+F6HbD0CWXEh9ou77uOb7FM2WPhwT7smM833PzanhJLsgXjN89Ir6V2PczXNnMpwKhw==",
+            "dependencies": {
+                "aws-sign2": "~0.7.0",
+                "aws4": "^1.8.0",
+                "caseless": "~0.12.0",
+                "combined-stream": "~1.0.6",
+                "extend": "~3.0.2",
+                "forever-agent": "~0.6.1",
+                "form-data": "~2.3.2",
+                "har-validator": "~5.1.3",
+                "http-signature": "~1.2.0",
+                "is-typedarray": "~1.0.0",
+                "isstream": "~0.1.2",
+                "json-stringify-safe": "~5.0.1",
+                "mime-types": "~2.1.19",
+                "oauth-sign": "~0.9.0",
+                "performance-now": "^2.1.0",
+                "qs": "~6.5.2",
+                "safe-buffer": "^5.1.2",
+                "tough-cookie": "~2.5.0",
+                "tunnel-agent": "^0.6.0",
+                "uuid": "^3.3.2"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/request-promise": {
+            "version": "4.2.5",
+            "resolved": "https://registry.npmjs.org/request-promise/-/request-promise-4.2.5.tgz",
+            "integrity": "sha512-ZgnepCykFdmpq86fKGwqntyTiUrHycALuGggpyCZwMvGaZWgxW6yagT0FHkgo5LzYvOaCNvxYwWYIjevSH1EDg==",
+            "dependencies": {
+                "bluebird": "^3.5.0",
+                "request-promise-core": "1.1.3",
+                "stealthy-require": "^1.1.1",
+                "tough-cookie": "^2.3.3"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/request-promise-core": {
+            "version": "1.1.3",
+            "resolved": "https://registry.npmjs.org/request-promise-core/-/request-promise-core-1.1.3.tgz",
+            "integrity": "sha512-QIs2+ArIGQVp5ZYbWD5ZLCY29D5CfWizP8eWnm8FoGD1TX61veauETVQbrV60662V0oFBkrDOuaBI8XgtuyYAQ==",
+            "dependencies": {
+                "lodash": "^4.17.15"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/request-promise-native": {
+            "version": "1.0.8",
+            "resolved": "https://registry.npmjs.org/request-promise-native/-/request-promise-native-1.0.8.tgz",
+            "integrity": "sha512-dapwLGqkHtwL5AEbfenuzjTYg35Jd6KPytsC2/TLkVMz8rm+tNt72MGUWT1RP/aYawMpN6HqbNGBQaRcBtjQMQ==",
+            "dev": true,
+            "dependencies": {
+                "request-promise-core": "1.1.3",
+                "stealthy-require": "^1.1.1",
+                "tough-cookie": "^2.3.3"
+            },
+            "engines": {
+                "node": ">=0.12.0"
+            }
+        },
+        "node_modules/request/node_modules/form-data": {
+            "version": "2.3.3",
+            "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.3.tgz",
+            "integrity": "sha512-1lLKB2Mu3aGP1Q/2eCOx0fNbRMe7XdwktwOruhfqqd0rIJWwN4Dh+E3hrPSlDCXnSR7UtZ1N38rVXm+6+MEhJQ==",
+            "dependencies": {
+                "asynckit": "^0.4.0",
+                "combined-stream": "^1.0.6",
+                "mime-types": "^2.1.12"
+            },
+            "engines": {
+                "node": ">= 0.12"
+            }
+        },
+        "node_modules/require_optional": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/require_optional/-/require_optional-1.0.1.tgz",
+            "integrity": "sha512-qhM/y57enGWHAe3v/NcwML6a3/vfESLe/sGM2dII+gEO0BpKRUkWZow/tyloNqJyN6kXSl3RyyM8Ll5D/sJP8g==",
+            "dependencies": {
+                "resolve-from": "^2.0.0",
+                "semver": "^5.1.0"
+            }
+        },
+        "node_modules/require_optional/node_modules/resolve-from": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-2.0.0.tgz",
+            "integrity": "sha1-lICrIOlP+h2egKgEx+oUdhGWa1c=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/require-directory": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+            "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/require-main-filename": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
+            "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg=="
+        },
+        "node_modules/require-package-name": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/require-package-name/-/require-package-name-2.0.1.tgz",
+            "integrity": "sha1-wR6XJ2tluOKSP3Xav1+y7ww4Qbk="
+        },
+        "node_modules/requires-port": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
+            "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=",
+            "dev": true
+        },
+        "node_modules/resize-observer-polyfill": {
+            "version": "1.5.1",
+            "resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
+            "integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
+        },
+        "node_modules/resolve": {
+            "version": "1.17.0",
+            "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.17.0.tgz",
+            "integrity": "sha512-ic+7JYiV8Vi2yzQGFWOkiZD5Z9z7O2Zhm9XMaTxdJExKasieFCr+yXZ/WmXsckHiKl12ar0y6XiXDx3m4RHn1w==",
+            "dependencies": {
+                "path-parse": "^1.0.6"
+            }
+        },
+        "node_modules/resolve-cwd": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/resolve-cwd/-/resolve-cwd-2.0.0.tgz",
+            "integrity": "sha1-AKn3OHVW4nA46uIyyqNypqWbZlo=",
+            "dev": true,
+            "dependencies": {
+                "resolve-from": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/resolve-cwd/node_modules/resolve-from": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-3.0.0.tgz",
+            "integrity": "sha1-six699nWiBvItuZTM17rywoYh0g=",
+            "dev": true,
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/resolve-dir": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-1.0.1.tgz",
+            "integrity": "sha1-eaQGRMNivoLybv/nOcm7U4IEb0M=",
+            "dev": true,
+            "dependencies": {
+                "expand-tilde": "^2.0.0",
+                "global-modules": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/resolve-dir/node_modules/global-modules": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-1.0.0.tgz",
+            "integrity": "sha512-sKzpEkf11GpOFuw0Zzjzmt4B4UZwjOcG757PPvrfhxcLFbq0wpsgpOqxpxtxFiCG4DtG93M6XRVbF2oGdev7bg==",
+            "dev": true,
+            "dependencies": {
+                "global-prefix": "^1.0.1",
+                "is-windows": "^1.0.1",
+                "resolve-dir": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/resolve-from": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
+            "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/resolve-url": {
+            "version": "0.2.1",
+            "resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz",
+            "integrity": "sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo="
+        },
+        "node_modules/ret": {
+            "version": "0.1.15",
+            "resolved": "https://registry.npmjs.org/ret/-/ret-0.1.15.tgz",
+            "integrity": "sha512-TTlYpa+OL+vMMNG24xSlQGEJ3B/RzEfUlLct7b5G/ytav+wPrplCpVMFuwzXbkecJrb6IYo1iFb0S9v37754mg==",
+            "engines": {
+                "node": ">=0.12"
+            }
+        },
+        "node_modules/retry": {
+            "version": "0.12.0",
+            "resolved": "https://registry.npmjs.org/retry/-/retry-0.12.0.tgz",
+            "integrity": "sha1-G0KmJmoh8HQh0bC1S33BZ7AcATs=",
+            "dev": true,
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/reveal.js": {
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/reveal.js/-/reveal.js-4.0.2.tgz",
+            "integrity": "sha512-LWZSUenufF1gpD7npxJ7KfoQQFKgc1D6XrLTFgKlwWNP1BQ74hT48KONFWMAw+8R/QUeaScCLCLrBVHDfFIEiw==",
+            "engines": {
+                "node": ">=10.0.0"
+            }
+        },
+        "node_modules/right-align": {
+            "version": "0.1.3",
+            "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz",
+            "integrity": "sha1-YTObci/mo1FWiSENJOFMlhSGE+8=",
+            "dependencies": {
+                "align-text": "^0.1.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/rimraf": {
+            "version": "3.0.2",
+            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
+            "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/ripemd160": {
+            "version": "2.0.2",
+            "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.2.tgz",
+            "integrity": "sha512-ii4iagi25WusVoiC4B4lq7pbXfAp3D9v5CwfkY33vffw2+pkDjY1D8GaN7spsxvCSx8dkPqOZCEZyfxcmJG2IA==",
+            "dev": true,
+            "dependencies": {
+                "hash-base": "^3.0.0",
+                "inherits": "^2.0.1"
+            }
+        },
+        "node_modules/rope-sequence": {
+            "version": "1.3.2",
+            "resolved": "https://registry.npmjs.org/rope-sequence/-/rope-sequence-1.3.2.tgz",
+            "integrity": "sha512-ku6MFrwEVSVmXLvy3dYph3LAMNS0890K7fabn+0YIRQ2T96T9F4gkFf0vf0WW0JUraNWwGRtInEpH7yO4tbQZg=="
+        },
+        "node_modules/rtcpeerconnection-shim": {
+            "version": "1.2.15",
+            "resolved": "https://registry.npmjs.org/rtcpeerconnection-shim/-/rtcpeerconnection-shim-1.2.15.tgz",
+            "integrity": "sha512-C6DxhXt7bssQ1nHb154lqeL0SXz5Dx4RczXZu2Aa/L1NJFnEVDxFwCBo3fqtuljhHIGceg5JKBV4XJ0gW5JKyw==",
+            "dependencies": {
+                "sdp": "^2.6.0"
+            },
+            "engines": {
+                "node": ">=6.0.0",
+                "npm": ">=3.10.0"
+            }
+        },
+        "node_modules/run-queue": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/run-queue/-/run-queue-1.0.3.tgz",
+            "integrity": "sha1-6Eg5bwV9Ij8kOGkkYY4laUFh7Ec=",
+            "dev": true,
+            "dependencies": {
+                "aproba": "^1.1.1"
+            }
+        },
+        "node_modules/safe-buffer": {
+            "version": "5.1.2",
+            "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
+            "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
+        },
+        "node_modules/safe-regex": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz",
+            "integrity": "sha1-QKNmnzsHfR6UPURinhV91IAjvy4=",
+            "dependencies": {
+                "ret": "~0.1.10"
+            }
+        },
+        "node_modules/safer-buffer": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
+            "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
+        },
+        "node_modules/saslprep": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/saslprep/-/saslprep-1.0.3.tgz",
+            "integrity": "sha512-/MY/PEMbk2SuY5sScONwhUDsV2p77Znkb/q3nSVstq/yQzYJOH/Azh29p9oJLsl3LnQwSvZDKagDGBsBwSooag==",
+            "optional": true,
+            "dependencies": {
+                "sparse-bitfield": "^3.0.3"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/sass-graph": {
+            "version": "2.2.5",
+            "resolved": "https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.5.tgz",
+            "integrity": "sha512-VFWDAHOe6mRuT4mZRd4eKE+d8Uedrk6Xnh7Sh9b4NGufQLQjOrvf/MQoOdx+0s92L89FeyUUNfU597j/3uNpag==",
+            "dependencies": {
+                "glob": "^7.0.0",
+                "lodash": "^4.0.0",
+                "scss-tokenizer": "^0.2.3",
+                "yargs": "^13.3.2"
+            }
+        },
+        "node_modules/sass-loader": {
+            "version": "7.3.1",
+            "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-7.3.1.tgz",
+            "integrity": "sha512-tuU7+zm0pTCynKYHpdqaPpe+MMTQ76I9TPZ7i4/5dZsigE350shQWe5EZNl5dBidM49TPET75tNqRbcsUZWeNA==",
+            "dev": true,
+            "dependencies": {
+                "clone-deep": "^4.0.1",
+                "loader-utils": "^1.0.1",
+                "neo-async": "^2.5.0",
+                "pify": "^4.0.1",
+                "semver": "^6.3.0"
+            },
+            "engines": {
+                "node": ">= 6.9.0"
+            }
+        },
+        "node_modules/sass-loader/node_modules/semver": {
+            "version": "6.3.0",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
+            "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+            "dev": true,
+            "bin": {
+                "semver": "bin/semver.js"
+            }
+        },
+        "node_modules/sax": {
+            "version": "1.2.4",
+            "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
+            "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw=="
+        },
+        "node_modules/saxes": {
+            "version": "3.1.11",
+            "resolved": "https://registry.npmjs.org/saxes/-/saxes-3.1.11.tgz",
+            "integrity": "sha512-Ydydq3zC+WYDJK1+gRxRapLIED9PWeSuuS41wqyoRmzvhhh9nc+QQrVMKJYzJFULazeGhzSV0QleN2wD3boh2g==",
+            "dev": true,
+            "dependencies": {
+                "xmlchars": "^2.1.1"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/scheduler": {
+            "version": "0.19.1",
+            "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.19.1.tgz",
+            "integrity": "sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==",
+            "dependencies": {
+                "loose-envify": "^1.1.0",
+                "object-assign": "^4.1.1"
+            }
+        },
+        "node_modules/schema-utils": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
+            "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
+            "dev": true,
+            "dependencies": {
+                "ajv": "^6.1.0",
+                "ajv-errors": "^1.0.0",
+                "ajv-keywords": "^3.1.0"
+            },
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/scss-loader": {
+            "version": "0.0.1",
+            "resolved": "https://registry.npmjs.org/scss-loader/-/scss-loader-0.0.1.tgz",
+            "integrity": "sha1-6uAXueDzjBKlMtslwiC5Avs05nE=",
+            "dev": true
+        },
+        "node_modules/scss-tokenizer": {
+            "version": "0.2.3",
+            "resolved": "https://registry.npmjs.org/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz",
+            "integrity": "sha1-jrBtualyMzOCTT9VMGQRSYR85dE=",
+            "dependencies": {
+                "js-base64": "^2.1.8",
+                "source-map": "^0.4.2"
+            }
+        },
+        "node_modules/scss-tokenizer/node_modules/source-map": {
+            "version": "0.4.4",
+            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+            "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s=",
+            "dependencies": {
+                "amdefine": ">=0.0.4"
+            },
+            "engines": {
+                "node": ">=0.8.0"
+            }
+        },
+        "node_modules/sdp": {
+            "version": "2.12.0",
+            "resolved": "https://registry.npmjs.org/sdp/-/sdp-2.12.0.tgz",
+            "integrity": "sha512-jhXqQAQVM+8Xj5EjJGVweuEzgtGWb3tmEEpl3CLP3cStInSbVHSg0QWOGQzNq8pSID4JkpeV2mPqlMDLrm0/Vw=="
+        },
+        "node_modules/section-iterator": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/section-iterator/-/section-iterator-2.0.0.tgz",
+            "integrity": "sha1-v0RNev7rlK1Dw5rS+yYVFifMuio="
+        },
+        "node_modules/select-hose": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
+            "integrity": "sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo=",
+            "dev": true
+        },
+        "node_modules/selfsigned": {
+            "version": "1.10.7",
+            "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.7.tgz",
+            "integrity": "sha512-8M3wBCzeWIJnQfl43IKwOmC4H/RAp50S8DF60znzjW5GVqTcSe2vWclt7hmYVPkKPlHWOu5EaWOMZ2Y6W8ZXTA==",
+            "dev": true,
+            "dependencies": {
+                "node-forge": "0.9.0"
+            }
+        },
+        "node_modules/selfsigned/node_modules/node-forge": {
+            "version": "0.9.0",
+            "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.9.0.tgz",
+            "integrity": "sha512-7ASaDa3pD+lJ3WvXFsxekJQelBKRpne+GOVbLbtHYdd7pFspyeuJHnWfLplGf3SwKGbfs/aYl5V/JCIaHVUKKQ==",
+            "dev": true,
+            "engines": {
+                "node": ">= 4.5.0"
+            }
+        },
+        "node_modules/semver": {
+            "version": "5.7.1",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
+            "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
+            "bin": {
+                "semver": "bin/semver"
+            }
+        },
+        "node_modules/semver-compare": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/semver-compare/-/semver-compare-1.0.0.tgz",
+            "integrity": "sha1-De4hahyUGrN+nvsXiPavxf9VN/w="
+        },
+        "node_modules/semver-diff": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/semver-diff/-/semver-diff-2.1.0.tgz",
+            "integrity": "sha1-S7uEN8jTfksM8aaP1ybsbWRdbTY=",
+            "dependencies": {
+                "semver": "^5.0.3"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/send": {
+            "version": "0.17.1",
+            "resolved": "https://registry.npmjs.org/send/-/send-0.17.1.tgz",
+            "integrity": "sha512-BsVKsiGcQMFwT8UxypobUKyv7irCNRHk1T0G680vk88yf6LBByGcZJOTJCrTP2xVN6yI+XjPJcNuE3V4fT9sAg==",
+            "dependencies": {
+                "debug": "2.6.9",
+                "depd": "~1.1.2",
+                "destroy": "~1.0.4",
+                "encodeurl": "~1.0.2",
+                "escape-html": "~1.0.3",
+                "etag": "~1.8.1",
+                "fresh": "0.5.2",
+                "http-errors": "~1.7.2",
+                "mime": "1.6.0",
+                "ms": "2.1.1",
+                "on-finished": "~2.3.0",
+                "range-parser": "~1.2.1",
+                "statuses": "~1.5.0"
+            },
+            "engines": {
+                "node": ">= 0.8.0"
+            }
+        },
+        "node_modules/send/node_modules/debug": {
+            "version": "2.6.9",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/send/node_modules/debug/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        },
+        "node_modules/serialize-javascript": {
+            "version": "1.9.1",
+            "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-1.9.1.tgz",
+            "integrity": "sha512-0Vb/54WJ6k5v8sSWN09S0ora+Hnr+cX40r9F170nT+mSkaxltoE/7R3OrIdBSUv1OoiobH1QoWQbCnAO+e8J1A==",
+            "dev": true
+        },
+        "node_modules/serializr": {
+            "version": "1.5.4",
+            "resolved": "https://registry.npmjs.org/serializr/-/serializr-1.5.4.tgz",
+            "integrity": "sha512-ImLlkNfNSSv9d7Ah1j/yrPk1FHbRC1zkD7URcgx/8M1eYHGUxGf/Ig/d8ML04ifqN7QesyYKsfLYA4xjAVAR/g=="
+        },
+        "node_modules/serve-index": {
+            "version": "1.9.1",
+            "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.1.tgz",
+            "integrity": "sha1-03aNabHn2C5c4FD/9bRTvqEqkjk=",
+            "dev": true,
+            "dependencies": {
+                "accepts": "~1.3.4",
+                "batch": "0.6.1",
+                "debug": "2.6.9",
+                "escape-html": "~1.0.3",
+                "http-errors": "~1.6.2",
+                "mime-types": "~2.1.17",
+                "parseurl": "~1.3.2"
+            },
+            "engines": {
+                "node": ">= 0.8.0"
+            }
+        },
+        "node_modules/serve-index/node_modules/debug": {
+            "version": "2.6.9",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+            "dev": true,
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/serve-index/node_modules/http-errors": {
+            "version": "1.6.3",
+            "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.3.tgz",
+            "integrity": "sha1-i1VoC7S+KDoLW/TqLjhYC+HZMg0=",
+            "dev": true,
+            "dependencies": {
+                "depd": "~1.1.2",
+                "inherits": "2.0.3",
+                "setprototypeof": "1.1.0",
+                "statuses": ">= 1.4.0 < 2"
+            },
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/serve-index/node_modules/inherits": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
+            "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
+            "dev": true
+        },
+        "node_modules/serve-index/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
+            "dev": true
+        },
+        "node_modules/serve-index/node_modules/setprototypeof": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz",
+            "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ==",
+            "dev": true
+        },
+        "node_modules/serve-static": {
+            "version": "1.14.1",
+            "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.14.1.tgz",
+            "integrity": "sha512-JMrvUwE54emCYWlTI+hGrGv5I8dEwmco/00EvkzIIsR7MqrHonbD9pO2MOfFnpFntl7ecpZs+3mW+XbQZu9QCg==",
+            "dependencies": {
+                "encodeurl": "~1.0.2",
+                "escape-html": "~1.0.3",
+                "parseurl": "~1.3.3",
+                "send": "0.17.1"
+            },
+            "engines": {
+                "node": ">= 0.8.0"
+            }
+        },
+        "node_modules/set-blocking": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
+            "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc="
+        },
+        "node_modules/set-immediate-shim": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz",
+            "integrity": "sha1-SysbJ+uAip+NzEgaWOXlb1mfP2E=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/set-value": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/set-value/-/set-value-2.0.1.tgz",
+            "integrity": "sha512-JxHc1weCN68wRY0fhCoXpyK55m/XPHafOmK4UWD7m2CI14GMcFypt4w/0+NV5f/ZMby2F6S2wwA7fgynh9gWSw==",
+            "dependencies": {
+                "extend-shallow": "^2.0.1",
+                "is-extendable": "^0.1.1",
+                "is-plain-object": "^2.0.3",
+                "split-string": "^3.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/set-value/node_modules/extend-shallow": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+            "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+            "dependencies": {
+                "is-extendable": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/set-value/node_modules/is-extendable": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
+            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/setimmediate": {
+            "version": "1.0.5",
+            "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
+            "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU="
+        },
+        "node_modules/setprototypeof": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.1.tgz",
+            "integrity": "sha512-JvdAWfbXeIGaZ9cILp38HntZSFSo3mWg6xGcJJsd+d4aRMOqauag1C63dJfDw7OaMYwEbHMOxEZ1lqVRYP2OAw=="
+        },
+        "node_modules/sha.js": {
+            "version": "2.4.11",
+            "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz",
+            "integrity": "sha512-QMEp5B7cftE7APOjk5Y6xgrbWu+WkLVQwk8JNjZ8nKRciZaByEW6MubieAiToS7+dwvrjGhH8jRXz3MVd0AYqQ==",
+            "dev": true,
+            "dependencies": {
+                "inherits": "^2.0.1",
+                "safe-buffer": "^5.0.1"
+            },
+            "bin": {
+                "sha.js": "bin.js"
+            }
+        },
+        "node_modules/shallow-clone": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-3.0.1.tgz",
+            "integrity": "sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==",
+            "dev": true,
+            "dependencies": {
+                "kind-of": "^6.0.2"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/shallow-equal": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/shallow-equal/-/shallow-equal-1.2.1.tgz",
+            "integrity": "sha512-S4vJDjHHMBaiZuT9NPb616CSmLf618jawtv3sufLl6ivK8WocjAo58cXwbRV1cgqxH0Qbv+iUt6m05eqEa2IRA=="
+        },
+        "node_modules/sharp": {
+            "version": "0.23.4",
+            "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.23.4.tgz",
+            "integrity": "sha512-fJMagt6cT0UDy9XCsgyLi0eiwWWhQRxbwGmqQT6sY8Av4s0SVsT/deg8fobBQCTDU5iXRgz0rAeXoE2LBZ8g+Q==",
+            "hasInstallScript": true,
+            "dependencies": {
+                "color": "^3.1.2",
+                "detect-libc": "^1.0.3",
+                "nan": "^2.14.0",
+                "npmlog": "^4.1.2",
+                "prebuild-install": "^5.3.3",
+                "semver": "^6.3.0",
+                "simple-get": "^3.1.0",
+                "tar": "^5.0.5",
+                "tunnel-agent": "^0.6.0"
+            },
+            "engines": {
+                "node": ">=8.5.0"
+            }
+        },
+        "node_modules/sharp/node_modules/fs-minipass": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-2.1.0.tgz",
+            "integrity": "sha512-V/JgOLFCS+R6Vcq0slCuaeWEdNC3ouDlJMNIsacH2VtALiu9mV4LPrHc5cDl8k5aw6J8jwgWWpiTo5RYhmIzvg==",
+            "dependencies": {
+                "minipass": "^3.0.0"
+            },
+            "engines": {
+                "node": ">= 8"
+            }
+        },
+        "node_modules/sharp/node_modules/minipass": {
+            "version": "3.1.1",
+            "resolved": "https://registry.npmjs.org/minipass/-/minipass-3.1.1.tgz",
+            "integrity": "sha512-UFqVihv6PQgwj8/yTGvl9kPz7xIAY+R5z6XYjRInD3Gk3qx6QGSD6zEcpeG4Dy/lQnv1J6zv8ejV90hyYIKf3w==",
+            "dependencies": {
+                "yallist": "^4.0.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/sharp/node_modules/minizlib": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-2.1.0.tgz",
+            "integrity": "sha512-EzTZN/fjSvifSX0SlqUERCN39o6T40AMarPbv0MrarSFtIITCBh7bi+dU8nxGFHuqs9jdIAeoYoKuQAAASsPPA==",
+            "dependencies": {
+                "minipass": "^3.0.0",
+                "yallist": "^4.0.0"
+            },
+            "engines": {
+                "node": ">= 8"
+            }
+        },
+        "node_modules/sharp/node_modules/semver": {
+            "version": "6.3.0",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
+            "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+            "bin": {
+                "semver": "bin/semver.js"
+            }
+        },
+        "node_modules/sharp/node_modules/tar": {
+            "version": "5.0.5",
+            "resolved": "https://registry.npmjs.org/tar/-/tar-5.0.5.tgz",
+            "integrity": "sha512-MNIgJddrV2TkuwChwcSNds/5E9VijOiw7kAc1y5hTNJoLDSuIyid2QtLYiCYNnICebpuvjhPQZsXwUL0O3l7OQ==",
+            "dependencies": {
+                "chownr": "^1.1.3",
+                "fs-minipass": "^2.0.0",
+                "minipass": "^3.0.0",
+                "minizlib": "^2.1.0",
+                "mkdirp": "^0.5.0",
+                "yallist": "^4.0.0"
+            },
+            "engines": {
+                "node": ">= 8"
+            }
+        },
+        "node_modules/sharp/node_modules/yallist": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+            "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+        },
+        "node_modules/shebang-command": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
+            "integrity": "sha1-RKrGW2lbAzmJaMOfNj/uXer98eo=",
+            "dependencies": {
+                "shebang-regex": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/shebang-regex": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-1.0.0.tgz",
+            "integrity": "sha1-2kL0l0DAtC2yypcoVxyxkMmO/qM=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/shelljs": {
+            "version": "0.8.4",
+            "resolved": "https://registry.npmjs.org/shelljs/-/shelljs-0.8.4.tgz",
+            "integrity": "sha512-7gk3UZ9kOfPLIAbslLzyWeGiEqx9e3rxwZM0KE6EL8GlGwjym9Mrlx5/p33bWTu9YG6vcS4MBxYZDHYr5lr8BQ==",
+            "dependencies": {
+                "glob": "^7.0.0",
+                "interpret": "^1.0.0",
+                "rechoir": "^0.6.2"
+            },
+            "bin": {
+                "shjs": "bin/shjs"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/shellwords": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.1.tgz",
+            "integrity": "sha512-vFwSUfQvqybiICwZY5+DAWIPLKsWO31Q91JSKl3UYv+K5c2QRPzn0qzec6QPu1Qc9eHYItiP3NdJqNVqetYAww==",
+            "dev": true
+        },
+        "node_modules/sift": {
+            "version": "7.0.1",
+            "resolved": "https://registry.npmjs.org/sift/-/sift-7.0.1.tgz",
+            "integrity": "sha512-oqD7PMJ+uO6jV9EQCl0LrRw1OwsiPsiFQR5AR30heR+4Dl7jBBbDLnNvWiak20tzZlSE1H7RB30SX/1j/YYT7g=="
+        },
+        "node_modules/signal-exit": {
+            "version": "3.0.3",
+            "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.3.tgz",
+            "integrity": "sha512-VUJ49FC8U1OxwZLxIbTTrDvLnf/6TDgxZcK8wxR8zs13xpx7xbG60ndBlhNrFi2EMuFRoeDoJO7wthSLq42EjA=="
+        },
+        "node_modules/simple-assign": {
+            "version": "0.1.0",
+            "resolved": "https://registry.npmjs.org/simple-assign/-/simple-assign-0.1.0.tgz",
+            "integrity": "sha1-F/0wZqXz13OPUDIbsPFMooHMS6o="
+        },
+        "node_modules/simple-concat": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/simple-concat/-/simple-concat-1.0.0.tgz",
+            "integrity": "sha1-c0TLuLbib7J9ZrL8hvn21Zl1IcY="
+        },
+        "node_modules/simple-get": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/simple-get/-/simple-get-3.1.0.tgz",
+            "integrity": "sha512-bCR6cP+aTdScaQCnQKbPKtJOKDp/hj9EDLJo3Nw4y1QksqaovlW/bnptB6/c1e+qmNIDHRK+oXFDdEqBT8WzUA==",
+            "dependencies": {
+                "decompress-response": "^4.2.0",
+                "once": "^1.3.1",
+                "simple-concat": "^1.0.0"
+            }
+        },
+        "node_modules/simple-swizzle": {
+            "version": "0.2.2",
+            "resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz",
+            "integrity": "sha1-pNprY1/8zMoz9w0Xy5JZLeleVXo=",
+            "dependencies": {
+                "is-arrayish": "^0.3.1"
+            }
+        },
+        "node_modules/simple-swizzle/node_modules/is-arrayish": {
+            "version": "0.3.2",
+            "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz",
+            "integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ=="
+        },
+        "node_modules/slash": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/slash/-/slash-1.0.0.tgz",
+            "integrity": "sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/sliced": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/sliced/-/sliced-1.0.1.tgz",
+            "integrity": "sha1-CzpmK10Ewxd7GSa+qCsD+Dei70E="
+        },
+        "node_modules/snapdragon": {
+            "version": "0.8.2",
+            "resolved": "https://registry.npmjs.org/snapdragon/-/snapdragon-0.8.2.tgz",
+            "integrity": "sha512-FtyOnWN/wCHTVXOMwvSv26d+ko5vWlIDD6zoUJ7LW8vh+ZBC8QdljveRP+crNrtBwioEUWy/4dMtbBjA4ioNlg==",
+            "dependencies": {
+                "base": "^0.11.1",
+                "debug": "^2.2.0",
+                "define-property": "^0.2.5",
+                "extend-shallow": "^2.0.1",
+                "map-cache": "^0.2.2",
+                "source-map": "^0.5.6",
+                "source-map-resolve": "^0.5.0",
+                "use": "^3.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/snapdragon-node": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/snapdragon-node/-/snapdragon-node-2.1.1.tgz",
+            "integrity": "sha512-O27l4xaMYt/RSQ5TR3vpWCAB5Kb/czIcqUFOM/C4fYcLnbZUc1PkjTAMjof2pBWaSTwOUd6qUHcFGVGj7aIwnw==",
+            "dependencies": {
+                "define-property": "^1.0.0",
+                "isobject": "^3.0.0",
+                "snapdragon-util": "^3.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/snapdragon-node/node_modules/define-property": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
+            "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
+            "dependencies": {
+                "is-descriptor": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/snapdragon-node/node_modules/is-accessor-descriptor": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-1.0.0.tgz",
+            "integrity": "sha512-m5hnHTkcVsPfqx3AKlyttIPb7J+XykHvJP2B9bZDjlhLIoEq4XoK64Vg7boZlVWYK6LUY94dYPEE7Lh0ZkZKcQ==",
+            "dependencies": {
+                "kind-of": "^6.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/snapdragon-node/node_modules/is-data-descriptor": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-1.0.0.tgz",
+            "integrity": "sha512-jbRXy1FmtAoCjQkVmIVYwuuqDFUbaOeDjmed1tOGPrsMhtJA4rD9tkgA0F1qJ3gRFRXcHYVkdeaP50Q5rE/jLQ==",
+            "dependencies": {
+                "kind-of": "^6.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/snapdragon-node/node_modules/is-descriptor": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.2.tgz",
+            "integrity": "sha512-2eis5WqQGV7peooDyLmNEPUrps9+SXX5c9pL3xEB+4e9HnGuDa7mB7kHxHw4CbqS9k1T2hOH3miL8n8WtiYVtg==",
+            "dependencies": {
+                "is-accessor-descriptor": "^1.0.0",
+                "is-data-descriptor": "^1.0.0",
+                "kind-of": "^6.0.2"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/snapdragon-util": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/snapdragon-util/-/snapdragon-util-3.0.1.tgz",
+            "integrity": "sha512-mbKkMdQKsjX4BAL4bRYTj21edOf8cN7XHdYUJEe+Zn99hVEYcMvKPct1IqNe7+AZPirn8BCDOQBHQZknqmKlZQ==",
+            "dependencies": {
+                "kind-of": "^3.2.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/snapdragon-util/node_modules/is-buffer": {
+            "version": "1.1.6",
+            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
+            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
+        },
+        "node_modules/snapdragon-util/node_modules/kind-of": {
+            "version": "3.2.2",
+            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+            "dependencies": {
+                "is-buffer": "^1.1.5"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/snapdragon/node_modules/debug": {
+            "version": "2.6.9",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/snapdragon/node_modules/define-property": {
+            "version": "0.2.5",
+            "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+            "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
+            "dependencies": {
+                "is-descriptor": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/snapdragon/node_modules/extend-shallow": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+            "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+            "dependencies": {
+                "is-extendable": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/snapdragon/node_modules/is-extendable": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
+            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/snapdragon/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        },
+        "node_modules/socket.io": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-2.3.0.tgz",
+            "integrity": "sha512-2A892lrj0GcgR/9Qk81EaY2gYhCBxurV0PfmmESO6p27QPrUK1J3zdns+5QPqvUYK2q657nSj0guoIil9+7eFg==",
+            "dependencies": {
+                "debug": "~4.1.0",
+                "engine.io": "~3.4.0",
+                "has-binary2": "~1.0.2",
+                "socket.io-adapter": "~1.1.0",
+                "socket.io-client": "2.3.0",
+                "socket.io-parser": "~3.4.0"
+            }
+        },
+        "node_modules/socket.io-adapter": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/socket.io-adapter/-/socket.io-adapter-1.1.2.tgz",
+            "integrity": "sha512-WzZRUj1kUjrTIrUKpZLEzFZ1OLj5FwLlAFQs9kuZJzJi5DKdU7FsWc36SNmA8iDOtwBQyT8FkrriRM8vXLYz8g=="
+        },
+        "node_modules/socket.io-client": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-2.3.0.tgz",
+            "integrity": "sha512-cEQQf24gET3rfhxZ2jJ5xzAOo/xhZwK+mOqtGRg5IowZsMgwvHwnf/mCRapAAkadhM26y+iydgwsXGObBB5ZdA==",
+            "dependencies": {
+                "backo2": "1.0.2",
+                "base64-arraybuffer": "0.1.5",
+                "component-bind": "1.0.0",
+                "component-emitter": "1.2.1",
+                "debug": "~4.1.0",
+                "engine.io-client": "~3.4.0",
+                "has-binary2": "~1.0.2",
+                "has-cors": "1.1.0",
+                "indexof": "0.0.1",
+                "object-component": "0.0.3",
+                "parseqs": "0.0.5",
+                "parseuri": "0.0.5",
+                "socket.io-parser": "~3.3.0",
+                "to-array": "0.1.4"
+            }
+        },
+        "node_modules/socket.io-client/node_modules/component-emitter": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
+            "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
+        },
+        "node_modules/socket.io-client/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/socket.io-client/node_modules/isarray": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.1.tgz",
+            "integrity": "sha1-o32U7ZzaLVmGXJ92/llu4fM4dB4="
+        },
+        "node_modules/socket.io-client/node_modules/socket.io-parser": {
+            "version": "3.3.0",
+            "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-3.3.0.tgz",
+            "integrity": "sha512-hczmV6bDgdaEbVqhAeVMM/jfUfzuEZHsQg6eOmLgJht6G3mPKMxYm75w2+qhAQZ+4X+1+ATZ+QFKeOZD5riHng==",
+            "dependencies": {
+                "component-emitter": "1.2.1",
+                "debug": "~3.1.0",
+                "isarray": "2.0.1"
+            }
+        },
+        "node_modules/socket.io-client/node_modules/socket.io-parser/node_modules/debug": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+            "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/socket.io-client/node_modules/socket.io-parser/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        },
+        "node_modules/socket.io-parser": {
+            "version": "3.4.0",
+            "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-3.4.0.tgz",
+            "integrity": "sha512-/G/VOI+3DBp0+DJKW4KesGnQkQPFmUCbA/oO2QGT6CWxU7hLGWqU3tyuzeSK/dqcyeHsQg1vTe9jiZI8GU9SCQ==",
+            "dependencies": {
+                "component-emitter": "1.2.1",
+                "debug": "~4.1.0",
+                "isarray": "2.0.1"
+            }
+        },
+        "node_modules/socket.io-parser/node_modules/component-emitter": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
+            "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
+        },
+        "node_modules/socket.io-parser/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/socket.io-parser/node_modules/isarray": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.1.tgz",
+            "integrity": "sha1-o32U7ZzaLVmGXJ92/llu4fM4dB4="
+        },
+        "node_modules/socket.io/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/sockjs": {
+            "version": "0.3.20",
+            "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.20.tgz",
+            "integrity": "sha512-SpmVOVpdq0DJc0qArhF3E5xsxvaiqGNb73XfgBpK1y3UD5gs8DSo8aCTsuT5pX8rssdc2NDIzANwP9eCAiSdTA==",
+            "dev": true,
+            "dependencies": {
+                "faye-websocket": "^0.10.0",
+                "uuid": "^3.4.0",
+                "websocket-driver": "0.6.5"
+            }
+        },
+        "node_modules/sockjs-client": {
+            "version": "1.4.0",
+            "resolved": "https://registry.npmjs.org/sockjs-client/-/sockjs-client-1.4.0.tgz",
+            "integrity": "sha512-5zaLyO8/nri5cua0VtOrFXBPK1jbL4+1cebT/mmKA1E1ZXOvJrII75bPu0l0k843G/+iAbhEqzyKr0w/eCCj7g==",
+            "dev": true,
+            "dependencies": {
+                "debug": "^3.2.5",
+                "eventsource": "^1.0.7",
+                "faye-websocket": "~0.11.1",
+                "inherits": "^2.0.3",
+                "json3": "^3.3.2",
+                "url-parse": "^1.4.3"
+            }
+        },
+        "node_modules/sockjs-client/node_modules/faye-websocket": {
+            "version": "0.11.3",
+            "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.3.tgz",
+            "integrity": "sha512-D2y4bovYpzziGgbHYtGCMjlJM36vAl/y+xUyn1C+FVx8szd1E+86KwVw6XvYSzOP8iMpm1X0I4xJD+QtUb36OA==",
+            "dev": true,
+            "dependencies": {
+                "websocket-driver": ">=0.5.1"
+            },
+            "engines": {
+                "node": ">=0.8.0"
+            }
+        },
+        "node_modules/solr-node": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/solr-node/-/solr-node-1.2.1.tgz",
+            "integrity": "sha512-DN3+FSBgpJEgGTNddzS8tNb+ILSn5MLcsWf15G9rGxi/sROHbpcevdRSVx6s5/nz56c/5AnBTBZWak7IXWX97A==",
+            "dependencies": {
+                "@log4js-node/log4js-api": "^1.0.2",
+                "node-fetch": "^2.3.0",
+                "underscore": "^1.8.3"
+            },
+            "engines": {
+                "node": ">= 0.12.0"
+            }
+        },
+        "node_modules/solr-node/node_modules/node-fetch": {
+            "version": "2.6.0",
+            "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.0.tgz",
+            "integrity": "sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA==",
+            "engines": {
+                "node": "4.x || >=6.0.0"
+            }
+        },
+        "node_modules/source-list-map": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz",
+            "integrity": "sha512-qnQ7gVMxGNxsiL4lEuJwe/To8UnK7fAnmbGEEH8RpLouuKbeEm0lhbQVFIrNSuB+G7tVrAlVsZgETT5nljf+Iw==",
+            "dev": true
+        },
+        "node_modules/source-map": {
+            "version": "0.5.7",
+            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+            "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/source-map-resolve": {
+            "version": "0.5.3",
+            "resolved": "https://registry.npmjs.org/source-map-resolve/-/source-map-resolve-0.5.3.tgz",
+            "integrity": "sha512-Htz+RnsXWk5+P2slx5Jh3Q66vhQj1Cllm0zvnaY98+NFx+Dv2CF/f5O/t8x+KaNdrdIAsruNzoh/KpialbqAnw==",
+            "dependencies": {
+                "atob": "^2.1.2",
+                "decode-uri-component": "^0.2.0",
+                "resolve-url": "^0.2.1",
+                "source-map-url": "^0.4.0",
+                "urix": "^0.1.0"
+            }
+        },
+        "node_modules/source-map-support": {
+            "version": "0.5.19",
+            "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.19.tgz",
+            "integrity": "sha512-Wonm7zOCIJzBGQdB+thsPar0kYuCIzYvxZwlBa87yi/Mdjv7Tip2cyVbLj5o0cFPN4EVkuTwb3GDDyUx2DGnGw==",
+            "dev": true,
+            "dependencies": {
+                "buffer-from": "^1.0.0",
+                "source-map": "^0.6.0"
+            }
+        },
+        "node_modules/source-map-support/node_modules/source-map": {
+            "version": "0.6.1",
+            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/source-map-url": {
+            "version": "0.4.0",
+            "resolved": "https://registry.npmjs.org/source-map-url/-/source-map-url-0.4.0.tgz",
+            "integrity": "sha1-PpNdfd1zYxuXZZlW1VEo6HtQhKM="
+        },
+        "node_modules/sparse-bitfield": {
+            "version": "3.0.3",
+            "resolved": "https://registry.npmjs.org/sparse-bitfield/-/sparse-bitfield-3.0.3.tgz",
+            "integrity": "sha1-/0rm5oZWBWuks+eSqzM004JzyhE=",
+            "optional": true,
+            "dependencies": {
+                "memory-pager": "^1.0.2"
+            }
+        },
+        "node_modules/spdx-correct": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.1.0.tgz",
+            "integrity": "sha512-lr2EZCctC2BNR7j7WzJ2FpDznxky1sjfxvvYEyzxNyb6lZXHODmEoJeFu4JupYlkfha1KZpJyoqiJ7pgA1qq8Q==",
+            "dependencies": {
+                "spdx-expression-parse": "^3.0.0",
+                "spdx-license-ids": "^3.0.0"
+            }
+        },
+        "node_modules/spdx-exceptions": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.3.0.tgz",
+            "integrity": "sha512-/tTrYOC7PPI1nUAgx34hUpqXuyJG+DTHJTnIULG4rDygi4xu/tfgmq1e1cIRwRzwZgo4NLySi+ricLkZkw4i5A=="
+        },
+        "node_modules/spdx-expression-parse": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-3.0.0.tgz",
+            "integrity": "sha512-Yg6D3XpRD4kkOmTpdgbUiEJFKghJH03fiC1OPll5h/0sO6neh2jqRDVHOQ4o/LMea0tgCkbMgea5ip/e+MkWyg==",
+            "dependencies": {
+                "spdx-exceptions": "^2.1.0",
+                "spdx-license-ids": "^3.0.0"
+            }
+        },
+        "node_modules/spdx-license-ids": {
+            "version": "3.0.5",
+            "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.5.tgz",
+            "integrity": "sha512-J+FWzZoynJEXGphVIS+XEh3kFSjZX/1i9gFBaWQcB+/tmpe2qUsSBABpcxqxnAxFdiUFEgAX1bjYGQvIZmoz9Q=="
+        },
+        "node_modules/spdy": {
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/spdy/-/spdy-4.0.2.tgz",
+            "integrity": "sha512-r46gZQZQV+Kl9oItvl1JZZqJKGr+oEkB08A6BzkiR7593/7IbtuncXHd2YoYeTsG4157ZssMu9KYvUHLcjcDoA==",
+            "dev": true,
+            "dependencies": {
+                "debug": "^4.1.0",
+                "handle-thing": "^2.0.0",
+                "http-deceiver": "^1.2.7",
+                "select-hose": "^2.0.0",
+                "spdy-transport": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6.0.0"
+            }
+        },
+        "node_modules/spdy-transport": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-3.0.0.tgz",
+            "integrity": "sha512-hsLVFE5SjA6TCisWeJXFKniGGOpBgMLmerfO2aCyCU5s7nJ/rpAepqmFifv/GCbSbueEeAJJnmSQ2rKC/g8Fcw==",
+            "dev": true,
+            "dependencies": {
+                "debug": "^4.1.0",
+                "detect-node": "^2.0.4",
+                "hpack.js": "^2.1.6",
+                "obuf": "^1.1.2",
+                "readable-stream": "^3.0.6",
+                "wbuf": "^1.7.3"
+            }
+        },
+        "node_modules/spdy-transport/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dev": true,
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/spdy/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dev": true,
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/split-on-first": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/split-on-first/-/split-on-first-1.1.0.tgz",
+            "integrity": "sha512-43ZssAJaMusuKWL8sKUBQXHWOpq8d6CfN/u1p4gUzfJkM05C8rxTmYrkIPTXapZpORA6LkkzcUulJ8FqA7Uudw==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/split-skip": {
+            "version": "0.0.2",
+            "resolved": "https://registry.npmjs.org/split-skip/-/split-skip-0.0.2.tgz",
+            "integrity": "sha1-2J2Iu9L3Pka1FYqjcKVhIk6A1GE="
+        },
+        "node_modules/split-string": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.1.0.tgz",
+            "integrity": "sha512-NzNVhJDYpwceVVii8/Hu6DKfD2G+NrQHlS/V/qgv763EYudVwEcMQNxd2lh+0VrUByXN/oJkl5grOhYWvQUYiw==",
+            "dependencies": {
+                "extend-shallow": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/sprintf-js": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
+            "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
+        },
+        "node_modules/sshpk": {
+            "version": "1.16.1",
+            "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.16.1.tgz",
+            "integrity": "sha512-HXXqVUq7+pcKeLqqZj6mHFUMvXtOJt1uoUx09pFW6011inTMxqI8BA8PM95myrIyyKwdnzjdFjLiE6KBPVtJIg==",
+            "dependencies": {
+                "asn1": "~0.2.3",
+                "assert-plus": "^1.0.0",
+                "bcrypt-pbkdf": "^1.0.0",
+                "dashdash": "^1.12.0",
+                "ecc-jsbn": "~0.1.1",
+                "getpass": "^0.1.1",
+                "jsbn": "~0.1.0",
+                "safer-buffer": "^2.0.2",
+                "tweetnacl": "~0.14.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/ssri": {
+            "version": "5.3.0",
+            "resolved": "https://registry.npmjs.org/ssri/-/ssri-5.3.0.tgz",
+            "integrity": "sha512-XRSIPqLij52MtgoQavH/x/dU1qVKtWUAAZeOHsR9c2Ddi4XerFy3mc1alf+dLJKl9EUIm/Ht+EowFkTUOA6GAQ==",
+            "dev": true,
+            "dependencies": {
+                "safe-buffer": "^5.1.1"
+            }
+        },
+        "node_modules/standard-error": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/standard-error/-/standard-error-1.1.0.tgz",
+            "integrity": "sha1-I+UWj6HAggGJ5YEnAaeQWFENDTQ="
+        },
+        "node_modules/standard-http-error": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/standard-http-error/-/standard-http-error-2.0.1.tgz",
+            "integrity": "sha1-+K6RcuPO+cs40ucIShkl9Xp8NL0=",
+            "dependencies": {
+                "standard-error": ">= 1.1.0 < 2"
+            }
+        },
+        "node_modules/static-extend": {
+            "version": "0.1.2",
+            "resolved": "https://registry.npmjs.org/static-extend/-/static-extend-0.1.2.tgz",
+            "integrity": "sha1-YICcOcv/VTNyJv1eC1IPNB8ftcY=",
+            "dependencies": {
+                "define-property": "^0.2.5",
+                "object-copy": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/static-extend/node_modules/define-property": {
+            "version": "0.2.5",
+            "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+            "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
+            "dependencies": {
+                "is-descriptor": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/statuses": {
+            "version": "1.5.0",
+            "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
+            "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/stdout-stream": {
+            "version": "1.4.1",
+            "resolved": "https://registry.npmjs.org/stdout-stream/-/stdout-stream-1.4.1.tgz",
+            "integrity": "sha512-j4emi03KXqJWcIeF8eIXkjMFN1Cmb8gUlDYGeBALLPo5qdyTfA9bOtl8m33lRoC+vFMkP3gl0WsDr6+gzxbbTA==",
+            "dependencies": {
+                "readable-stream": "^2.0.1"
+            }
+        },
+        "node_modules/stdout-stream/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/stealthy-require": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/stealthy-require/-/stealthy-require-1.1.1.tgz",
+            "integrity": "sha1-NbCYdbT/SfJqd35QmzCQoyJr8ks=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/stream-browserify": {
+            "version": "2.0.2",
+            "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.2.tgz",
+            "integrity": "sha512-nX6hmklHs/gr2FuxYDltq8fJA1GDlxKQCz8O/IM4atRqBH8OORmBNgfvW5gG10GT/qQ9u0CzIvr2X5Pkt6ntqg==",
+            "dev": true,
+            "dependencies": {
+                "inherits": "~2.0.1",
+                "readable-stream": "^2.0.2"
+            }
+        },
+        "node_modules/stream-browserify/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dev": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/stream-each": {
+            "version": "1.2.3",
+            "resolved": "https://registry.npmjs.org/stream-each/-/stream-each-1.2.3.tgz",
+            "integrity": "sha512-vlMC2f8I2u/bZGqkdfLQW/13Zihpej/7PmSiMQsbYddxuTsJp8vRe2x2FvVExZg7FaOds43ROAuFJwPR4MTZLw==",
+            "dev": true,
+            "dependencies": {
+                "end-of-stream": "^1.1.0",
+                "stream-shift": "^1.0.0"
+            }
+        },
+        "node_modules/stream-http": {
+            "version": "2.8.3",
+            "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.8.3.tgz",
+            "integrity": "sha512-+TSkfINHDo4J+ZobQLWiMouQYB+UVYFttRA94FpEzzJ7ZdqcL4uUUQ7WkdkI4DSozGmgBUE/a47L+38PenXhUw==",
+            "dev": true,
+            "dependencies": {
+                "builtin-status-codes": "^3.0.0",
+                "inherits": "^2.0.1",
+                "readable-stream": "^2.3.6",
+                "to-arraybuffer": "^1.0.0",
+                "xtend": "^4.0.0"
+            }
+        },
+        "node_modules/stream-http/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dev": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/stream-parser": {
+            "version": "0.3.1",
+            "resolved": "https://registry.npmjs.org/stream-parser/-/stream-parser-0.3.1.tgz",
+            "integrity": "sha1-FhhUhpRCACGhGC/wrxkRwSl2F3M=",
+            "dependencies": {
+                "debug": "2"
+            }
+        },
+        "node_modules/stream-parser/node_modules/debug": {
+            "version": "2.6.9",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/stream-parser/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        },
+        "node_modules/stream-shift": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.1.tgz",
+            "integrity": "sha512-AiisoFqQ0vbGcZgQPY1cdP2I76glaVA/RauYR4G4thNFgkTqr90yXTo4LYX60Jl+sIlPNHHdGSwo01AvbKUSVQ==",
+            "dev": true
+        },
+        "node_modules/strict-uri-encode": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-2.0.0.tgz",
+            "integrity": "sha1-ucczDHBChi9rFC3CdLvMWGbONUY=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/string_decoder": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
+            "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
+            "dependencies": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
+        "node_modules/string-width": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
+            "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
+            "dependencies": {
+                "is-fullwidth-code-point": "^2.0.0",
+                "strip-ansi": "^4.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/string.prototype.codepointat": {
+            "version": "0.2.1",
+            "resolved": "https://registry.npmjs.org/string.prototype.codepointat/-/string.prototype.codepointat-0.2.1.tgz",
+            "integrity": "sha512-2cBVCj6I4IOvEnjgO/hWqXjqBGsY+zwPmHl12Srk9IXSZ56Jwwmy+66XO5Iut/oQVR7t5ihYdLB0GMa4alEUcg=="
+        },
+        "node_modules/string.prototype.trimend": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.1.tgz",
+            "integrity": "sha512-LRPxFUaTtpqYsTeNKaFOw3R4bxIzWOnbQ837QfBylo8jIxtcbK/A/sMV7Q+OAV/vWo+7s25pOE10KYSjaSO06g==",
+            "dependencies": {
+                "define-properties": "^1.1.3",
+                "es-abstract": "^1.17.5"
+            }
+        },
+        "node_modules/string.prototype.trimleft": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/string.prototype.trimleft/-/string.prototype.trimleft-2.1.2.tgz",
+            "integrity": "sha512-gCA0tza1JBvqr3bfAIFJGqfdRTyPae82+KTnm3coDXkZN9wnuW3HjGgN386D7hfv5CHQYCI022/rJPVlqXyHSw==",
+            "dependencies": {
+                "define-properties": "^1.1.3",
+                "es-abstract": "^1.17.5",
+                "string.prototype.trimstart": "^1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/string.prototype.trimright": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/string.prototype.trimright/-/string.prototype.trimright-2.1.2.tgz",
+            "integrity": "sha512-ZNRQ7sY3KroTaYjRS6EbNiiHrOkjihL9aQE/8gfQ4DtAC/aEBRHFJa44OmoWxGGqXuJlfKkZW4WcXErGr+9ZFg==",
+            "dependencies": {
+                "define-properties": "^1.1.3",
+                "es-abstract": "^1.17.5",
+                "string.prototype.trimend": "^1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/string.prototype.trimstart": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.1.tgz",
+            "integrity": "sha512-XxZn+QpvrBI1FOcg6dIpxUPgWCPuNXvMD72aaRaUQv1eD4e/Qy8i/hFTe0BUmD60p/QA6bh1avmuPTfNjqVWRw==",
+            "dependencies": {
+                "define-properties": "^1.1.3",
+                "es-abstract": "^1.17.5"
+            }
+        },
+        "node_modules/stringify-parameters": {
+            "version": "0.0.4",
+            "resolved": "https://registry.npmjs.org/stringify-parameters/-/stringify-parameters-0.0.4.tgz",
+            "integrity": "sha512-H3L90ERn5UPtkpO8eugnKcLgpIVlvTyUTrcLGm607AV5JDH6z0GymtNLr3gjGlP6I6NB/mxNX9QpY6jEQGLPdQ==",
+            "dependencies": {
+                "magicli": "0.0.5",
+                "unpack-string": "0.0.2"
+            },
+            "bin": {
+                "stringify-parameters": "bin/cli.js"
+            }
+        },
+        "node_modules/stringify-parameters/node_modules/magicli": {
+            "version": "0.0.5",
+            "resolved": "https://registry.npmjs.org/magicli/-/magicli-0.0.5.tgz",
+            "integrity": "sha1-zufQ+7THBRiqyxHsPrfiX/SaSSE=",
+            "dependencies": {
+                "commander": "^2.9.0",
+                "get-stdin": "^5.0.1",
+                "inspect-function": "^0.2.1",
+                "pipe-functions": "^1.2.0"
+            }
+        },
+        "node_modules/strip-ansi": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+            "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+            "dependencies": {
+                "ansi-regex": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/strip-bom": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+            "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
+            "dependencies": {
+                "is-utf8": "^0.2.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/strip-eof": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
+            "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/strip-indent": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-1.0.1.tgz",
+            "integrity": "sha1-DHlipq3vp7vUrDZkYKY4VSrhoKI=",
+            "dependencies": {
+                "get-stdin": "^4.0.1"
+            },
+            "bin": {
+                "strip-indent": "cli.js"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/strip-indent/node_modules/get-stdin": {
+            "version": "4.0.1",
+            "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
+            "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/strip-json-comments": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
+            "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/style-loader": {
+            "version": "0.23.1",
+            "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.23.1.tgz",
+            "integrity": "sha512-XK+uv9kWwhZMZ1y7mysB+zoihsEj4wneFWAS5qoiLwzW0WzSqMrrsIy+a3zkQJq0ipFtBpX5W3MqyRIBF/WFGg==",
+            "dev": true,
+            "dependencies": {
+                "loader-utils": "^1.1.0",
+                "schema-utils": "^1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.12.0"
+            }
+        },
+        "node_modules/style-loader/node_modules/schema-utils": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
+            "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
+            "dev": true,
+            "dependencies": {
+                "ajv": "^6.1.0",
+                "ajv-errors": "^1.0.0",
+                "ajv-keywords": "^3.1.0"
+            },
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/styled-components": {
+            "version": "4.4.1",
+            "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-4.4.1.tgz",
+            "integrity": "sha512-RNqj14kYzw++6Sr38n7197xG33ipEOktGElty4I70IKzQF1jzaD1U4xQ+Ny/i03UUhHlC5NWEO+d8olRCDji6g==",
+            "hasInstallScript": true,
+            "dependencies": {
+                "@babel/helper-module-imports": "^7.0.0",
+                "@babel/traverse": "^7.0.0",
+                "@emotion/is-prop-valid": "^0.8.1",
+                "@emotion/unitless": "^0.7.0",
+                "babel-plugin-styled-components": ">= 1",
+                "css-to-react-native": "^2.2.2",
+                "memoize-one": "^5.0.0",
+                "merge-anything": "^2.2.4",
+                "prop-types": "^15.5.4",
+                "react-is": "^16.6.0",
+                "stylis": "^3.5.0",
+                "stylis-rule-sheet": "^0.0.10",
+                "supports-color": "^5.5.0"
+            }
+        },
+        "node_modules/stylis": {
+            "version": "3.5.4",
+            "resolved": "https://registry.npmjs.org/stylis/-/stylis-3.5.4.tgz",
+            "integrity": "sha512-8/3pSmthWM7lsPBKv7NXkzn2Uc9W7NotcwGNpJaa3k7WMM1XDCA4MgT5k/8BIexd5ydZdboXtU90XH9Ec4Bv/Q=="
+        },
+        "node_modules/stylis-rule-sheet": {
+            "version": "0.0.10",
+            "resolved": "https://registry.npmjs.org/stylis-rule-sheet/-/stylis-rule-sheet-0.0.10.tgz",
+            "integrity": "sha512-nTbZoaqoBnmK+ptANthb10ZRZOGC+EmTLLUxeYIuHNkEKcmKgXX1XWKkUBT2Ac4es3NybooPe0SmvKdhKJZAuw=="
+        },
+        "node_modules/supports-color": {
+            "version": "5.5.0",
+            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
+            "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
+            "dependencies": {
+                "has-flag": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/symbol-observable": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.2.0.tgz",
+            "integrity": "sha512-e900nM8RRtGhlV36KGEU9k65K3mPb1WV70OdjfxlG2EAuM1noi/E/BaW/uMhL7bPEssK8QV57vN3esixjUvcXQ==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/symbol-tree": {
+            "version": "3.2.4",
+            "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
+            "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
+            "dev": true
+        },
+        "node_modules/table-layout": {
+            "version": "0.4.5",
+            "resolved": "https://registry.npmjs.org/table-layout/-/table-layout-0.4.5.tgz",
+            "integrity": "sha512-zTvf0mcggrGeTe/2jJ6ECkJHAQPIYEwDoqsiqBjI24mvRmQbInK5jq33fyypaCBxX08hMkfmdOqj6haT33EqWw==",
+            "dependencies": {
+                "array-back": "^2.0.0",
+                "deep-extend": "~0.6.0",
+                "lodash.padend": "^4.6.1",
+                "typical": "^2.6.1",
+                "wordwrapjs": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/tapable": {
+            "version": "1.1.3",
+            "resolved": "https://registry.npmjs.org/tapable/-/tapable-1.1.3.tgz",
+            "integrity": "sha512-4WK/bYZmj8xLr+HUCODHGF1ZFzsYffasLUgEiMBY4fgtltdO6B4WJtlSbPaDTLpYTcGVwM2qLnFTICEcNxs3kA==",
+            "dev": true,
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/tar": {
+            "version": "4.4.13",
+            "resolved": "https://registry.npmjs.org/tar/-/tar-4.4.13.tgz",
+            "integrity": "sha512-w2VwSrBoHa5BsSyH+KxEqeQBAllHhccyMFVHtGtdMpF4W7IRWfZjFiQceJPChOeTsSDVUpER2T8FA93pr0L+QA==",
+            "dependencies": {
+                "chownr": "^1.1.1",
+                "fs-minipass": "^1.2.5",
+                "minipass": "^2.8.6",
+                "minizlib": "^1.2.1",
+                "mkdirp": "^0.5.0",
+                "safe-buffer": "^5.1.2",
+                "yallist": "^3.0.3"
+            },
+            "engines": {
+                "node": ">=4.5"
+            }
+        },
+        "node_modules/tar-fs": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.0.1.tgz",
+            "integrity": "sha512-6tzWDMeroL87uF/+lin46k+Q+46rAJ0SyPGz7OW7wTgblI273hsBqk2C1j0/xNadNLKDTUL9BukSjB7cwgmlPA==",
+            "dependencies": {
+                "chownr": "^1.1.1",
+                "mkdirp-classic": "^0.5.2",
+                "pump": "^3.0.0",
+                "tar-stream": "^2.0.0"
+            }
+        },
+        "node_modules/tar-stream": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-2.1.2.tgz",
+            "integrity": "sha512-UaF6FoJ32WqALZGOIAApXx+OdxhekNMChu6axLJR85zMMjXKWFGjbIRe+J6P4UnRGg9rAwWvbTT0oI7hD/Un7Q==",
+            "dependencies": {
+                "bl": "^4.0.1",
+                "end-of-stream": "^1.4.1",
+                "fs-constants": "^1.0.0",
+                "inherits": "^2.0.3",
+                "readable-stream": "^3.1.1"
+            }
+        },
+        "node_modules/temp-dir": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/temp-dir/-/temp-dir-1.0.0.tgz",
+            "integrity": "sha1-CnwOom06Oa+n4OvqnB/AvE2qAR0=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/tempy": {
+            "version": "0.2.1",
+            "resolved": "https://registry.npmjs.org/tempy/-/tempy-0.2.1.tgz",
+            "integrity": "sha512-LB83o9bfZGrntdqPuRdanIVCPReam9SOZKW0fOy5I9X3A854GGWi0tjCqoXEk84XIEYBc/x9Hq3EFop/H5wJaw==",
+            "dependencies": {
+                "temp-dir": "^1.0.0",
+                "unique-string": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/term-size": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/term-size/-/term-size-1.2.0.tgz",
+            "integrity": "sha1-RYuDiH8oj8Vtb/+/rSYuJmOO+mk=",
+            "dependencies": {
+                "execa": "^0.7.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/terser": {
+            "version": "4.8.0",
+            "resolved": "https://registry.npmjs.org/terser/-/terser-4.8.0.tgz",
+            "integrity": "sha512-EAPipTNeWsb/3wLPeup1tVPaXfIaU68xMnVdPafIL1TV05OhASArYyIfFvnvJCNrR2NIOvDVNNTFRa+Re2MWyw==",
+            "dev": true,
+            "dependencies": {
+                "commander": "^2.20.0",
+                "source-map": "~0.6.1",
+                "source-map-support": "~0.5.12"
+            },
+            "bin": {
+                "terser": "bin/terser"
+            },
+            "engines": {
+                "node": ">=6.0.0"
+            }
+        },
+        "node_modules/terser-webpack-plugin": {
+            "version": "1.4.5",
+            "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-1.4.5.tgz",
+            "integrity": "sha512-04Rfe496lN8EYruwi6oPQkG0vo8C+HT49X687FZnpPF0qMAIHONI6HEXYPKDOE8e5HjXTyKfqRd/agHtH0kOtw==",
+            "dev": true,
+            "dependencies": {
+                "cacache": "^12.0.2",
+                "find-cache-dir": "^2.1.0",
+                "is-wsl": "^1.1.0",
+                "schema-utils": "^1.0.0",
+                "serialize-javascript": "^4.0.0",
+                "source-map": "^0.6.1",
+                "terser": "^4.1.2",
+                "webpack-sources": "^1.4.0",
+                "worker-farm": "^1.7.0"
+            },
+            "engines": {
+                "node": ">= 6.9.0"
+            }
+        },
+        "node_modules/terser-webpack-plugin/node_modules/cacache": {
+            "version": "12.0.4",
+            "resolved": "https://registry.npmjs.org/cacache/-/cacache-12.0.4.tgz",
+            "integrity": "sha512-a0tMB40oefvuInr4Cwb3GerbL9xTj1D5yg0T5xrjGCGyfvbxseIXX7BAO/u/hIXdafzOI5JC3wDwHyf24buOAQ==",
+            "dev": true,
+            "dependencies": {
+                "bluebird": "^3.5.5",
+                "chownr": "^1.1.1",
+                "figgy-pudding": "^3.5.1",
+                "glob": "^7.1.4",
+                "graceful-fs": "^4.1.15",
+                "infer-owner": "^1.0.3",
+                "lru-cache": "^5.1.1",
+                "mississippi": "^3.0.0",
+                "mkdirp": "^0.5.1",
+                "move-concurrently": "^1.0.1",
+                "promise-inflight": "^1.0.1",
+                "rimraf": "^2.6.3",
+                "ssri": "^6.0.1",
+                "unique-filename": "^1.1.1",
+                "y18n": "^4.0.0"
+            }
+        },
+        "node_modules/terser-webpack-plugin/node_modules/find-cache-dir": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-2.1.0.tgz",
+            "integrity": "sha512-Tq6PixE0w/VMFfCgbONnkiQIVol/JJL7nRMi20fqzA4NRs9AfeqMGeRdPi3wIhYkxjeBaWh2rxwapn5Tu3IqOQ==",
+            "dev": true,
+            "dependencies": {
+                "commondir": "^1.0.1",
+                "make-dir": "^2.0.0",
+                "pkg-dir": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/terser-webpack-plugin/node_modules/make-dir": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
+            "integrity": "sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==",
+            "dev": true,
+            "dependencies": {
+                "pify": "^4.0.1",
+                "semver": "^5.6.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/terser-webpack-plugin/node_modules/mississippi": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/mississippi/-/mississippi-3.0.0.tgz",
+            "integrity": "sha512-x471SsVjUtBRtcvd4BzKE9kFC+/2TeWgKCgw0bZcw1b9l2X3QX5vCWgF+KaZaYm87Ss//rHnWryupDrgLvmSkA==",
+            "dev": true,
+            "dependencies": {
+                "concat-stream": "^1.5.0",
+                "duplexify": "^3.4.2",
+                "end-of-stream": "^1.1.0",
+                "flush-write-stream": "^1.0.0",
+                "from2": "^2.1.0",
+                "parallel-transform": "^1.1.0",
+                "pump": "^3.0.0",
+                "pumpify": "^1.3.3",
+                "stream-each": "^1.1.0",
+                "through2": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/terser-webpack-plugin/node_modules/pkg-dir": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-3.0.0.tgz",
+            "integrity": "sha512-/E57AYkoeQ25qkxMj5PBOVgF8Kiu/h7cYS30Z5+R7WaiCCBfLq58ZI/dSeaEKb9WVJV5n/03QwrN3IeWIFllvw==",
+            "dev": true,
+            "dependencies": {
+                "find-up": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/terser-webpack-plugin/node_modules/rimraf": {
+            "version": "2.7.1",
+            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+            "dev": true,
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/terser-webpack-plugin/node_modules/serialize-javascript": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-4.0.0.tgz",
+            "integrity": "sha512-GaNA54380uFefWghODBWEGisLZFj00nS5ACs6yHa9nLqlLpVLO8ChDGeKRjZnV4Nh4n0Qi7nhYZD/9fCPzEqkw==",
+            "dev": true,
+            "dependencies": {
+                "randombytes": "^2.1.0"
+            }
+        },
+        "node_modules/terser-webpack-plugin/node_modules/source-map": {
+            "version": "0.6.1",
+            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/terser-webpack-plugin/node_modules/ssri": {
+            "version": "6.0.2",
+            "resolved": "https://registry.npmjs.org/ssri/-/ssri-6.0.2.tgz",
+            "integrity": "sha512-cepbSq/neFK7xB6A50KHN0xHDotYzq58wWCa5LeWqnPrHG8GzfEjO/4O8kpmcGW+oaxkvhEJCWgbgNk4/ZV93Q==",
+            "dev": true,
+            "dependencies": {
+                "figgy-pudding": "^3.5.1"
+            }
+        },
+        "node_modules/terser/node_modules/source-map": {
+            "version": "0.6.1",
+            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/textarea-caret": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/textarea-caret/-/textarea-caret-3.1.0.tgz",
+            "integrity": "sha512-cXAvzO9pP5CGa6NKx0WYHl+8CHKZs8byMkt3PCJBCmq2a34YA9pO1NrQET5pzeqnBjBdToF5No4rrmkDUgQC2Q=="
+        },
+        "node_modules/three": {
+            "version": "0.127.0",
+            "resolved": "https://registry.npmjs.org/three/-/three-0.127.0.tgz",
+            "integrity": "sha512-wtgrn+mhYUbobxT7QN3GPdu3SRpSBQvwY6uOzLChWS7QE//f7paDU/+wlzbg+ngeIvBBqjBHSRuywTh8A99Jng=="
+        },
+        "node_modules/through": {
+            "version": "2.3.8",
+            "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
+            "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU="
+        },
+        "node_modules/through2": {
+            "version": "2.0.5",
+            "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.5.tgz",
+            "integrity": "sha512-/mrRod8xqpA+IHSLyGCQ2s8SPHiCDEeQJSep1jqLYeEUClOFG2Qsh+4FU6G9VeqpZnGW/Su8LQGc4YKni5rYSQ==",
+            "dev": true,
+            "dependencies": {
+                "readable-stream": "~2.3.6",
+                "xtend": "~4.0.1"
+            }
+        },
+        "node_modules/through2/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dev": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/thunky": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/thunky/-/thunky-1.1.0.tgz",
+            "integrity": "sha512-eHY7nBftgThBqOyHGVN+l8gF0BucP09fMo0oO/Lb0w1OF80dJv+lDVpXG60WMQvkcxAkNybKsrEIE3ZtKGmPrA==",
+            "dev": true
+        },
+        "node_modules/timed-out": {
+            "version": "4.0.1",
+            "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz",
+            "integrity": "sha1-8y6srFoXW+ol1/q1Zas+2HQe9W8=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/timers-browserify": {
+            "version": "2.0.12",
+            "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.12.tgz",
+            "integrity": "sha512-9phl76Cqm6FhSX9Xe1ZUAMLtm1BLkKj2Qd5ApyWkXzsMRaA7dgr81kf4wJmQf/hAvg8EEyJxDo3du/0KlhPiKQ==",
+            "dev": true,
+            "dependencies": {
+                "setimmediate": "^1.0.4"
+            },
+            "engines": {
+                "node": ">=0.6.0"
+            }
+        },
+        "node_modules/tiny-inflate": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/tiny-inflate/-/tiny-inflate-1.0.3.tgz",
+            "integrity": "sha512-pkY1fj1cKHb2seWDy0B16HeWyczlJA9/WW3u3c4z/NiWDsO3DOU5D7nhTLE9CF0yXv/QZFY7sEJmj24dK+Rrqw=="
+        },
+        "node_modules/tiny-invariant": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.1.0.tgz",
+            "integrity": "sha512-ytxQvrb1cPc9WBEI/HSeYYoGD0kWnGEOR8RY6KomWLBVhqz0RgTwVO9dLrGz7dC+nN9llyI7OKAgRq8Vq4ZBSw=="
+        },
+        "node_modules/tiny-warning": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz",
+            "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA=="
+        },
+        "node_modules/tinycolor2": {
+            "version": "1.4.1",
+            "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.4.1.tgz",
+            "integrity": "sha1-9PrTM0R7wLB9TcjpIJ2POaisd+g=",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/to-array": {
+            "version": "0.1.4",
+            "resolved": "https://registry.npmjs.org/to-array/-/to-array-0.1.4.tgz",
+            "integrity": "sha1-F+bBH3PdTz10zaek/zI46a2b+JA="
+        },
+        "node_modules/to-arraybuffer": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz",
+            "integrity": "sha1-fSKbH8xjfkZsoIEYCDanqr/4P0M=",
+            "dev": true
+        },
+        "node_modules/to-fast-properties": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
+            "integrity": "sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/to-object-path": {
+            "version": "0.3.0",
+            "resolved": "https://registry.npmjs.org/to-object-path/-/to-object-path-0.3.0.tgz",
+            "integrity": "sha1-KXWIt7Dn4KwI4E5nL4XB9JmeF68=",
+            "dependencies": {
+                "kind-of": "^3.0.2"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/to-object-path/node_modules/is-buffer": {
+            "version": "1.1.6",
+            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
+            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
+        },
+        "node_modules/to-object-path/node_modules/kind-of": {
+            "version": "3.2.2",
+            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+            "dependencies": {
+                "is-buffer": "^1.1.5"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/to-regex": {
+            "version": "3.0.2",
+            "resolved": "https://registry.npmjs.org/to-regex/-/to-regex-3.0.2.tgz",
+            "integrity": "sha512-FWtleNAtZ/Ki2qtqej2CXTOayOH9bHDQF+Q48VpWyDXjbYxA4Yz8iDB31zXOBUlOHHKidDbqGVrTUvQMPmBGBw==",
+            "dependencies": {
+                "define-property": "^2.0.2",
+                "extend-shallow": "^3.0.2",
+                "regex-not": "^1.0.2",
+                "safe-regex": "^1.1.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/to-regex-range": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-2.1.1.tgz",
+            "integrity": "sha1-fIDBe53+vlmeJzZ+DU3VWQFB2zg=",
+            "dependencies": {
+                "is-number": "^3.0.0",
+                "repeat-string": "^1.6.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/toidentifier": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz",
+            "integrity": "sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==",
+            "engines": {
+                "node": ">=0.6"
+            }
+        },
+        "node_modules/token-stream": {
+            "version": "0.0.1",
+            "resolved": "https://registry.npmjs.org/token-stream/-/token-stream-0.0.1.tgz",
+            "integrity": "sha1-zu78cXp2xDFvEm0LnbqlXX598Bo="
+        },
+        "node_modules/touch": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/touch/-/touch-3.1.0.tgz",
+            "integrity": "sha512-WBx8Uy5TLtOSRtIq+M03/sKDrXCLHxwDcquSP2c43Le03/9serjQBIztjRz6FkJez9D/hleyAXTBGLwwZUw9lA==",
+            "dependencies": {
+                "nopt": "~1.0.10"
+            },
+            "bin": {
+                "nodetouch": "bin/nodetouch.js"
+            }
+        },
+        "node_modules/touch/node_modules/nopt": {
+            "version": "1.0.10",
+            "resolved": "https://registry.npmjs.org/nopt/-/nopt-1.0.10.tgz",
+            "integrity": "sha1-bd0hvSoxQXuScn3Vhfim83YI6+4=",
+            "dependencies": {
+                "abbrev": "1"
+            },
+            "bin": {
+                "nopt": "bin/nopt.js"
+            }
+        },
+        "node_modules/tough-cookie": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.5.0.tgz",
+            "integrity": "sha512-nlLsUzgm1kfLXSXfRZMc1KLAugd4hqJHDTvc2hDIwS3mZAfMEuMbc03SujMF+GEcpaX/qboeycw6iO8JwVv2+g==",
+            "dependencies": {
+                "psl": "^1.1.28",
+                "punycode": "^2.1.1"
+            },
+            "engines": {
+                "node": ">=0.8"
+            }
+        },
+        "node_modules/tr46": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/tr46/-/tr46-1.0.1.tgz",
+            "integrity": "sha1-qLE/1r/SSJUZZ0zN5VujaTtwbQk=",
+            "dev": true,
+            "dependencies": {
+                "punycode": "^2.1.0"
+            }
+        },
+        "node_modules/translate-google-api": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/translate-google-api/-/translate-google-api-1.0.4.tgz",
+            "integrity": "sha512-KVXmo4+64/H1vIbnzf2zNiJ2JLeEB3jrEnNRP2EFNAGNqna/5bmw/Cps3pCHu0n3BzTOoWh9u6wFvrRYdzQ6Iw==",
+            "dependencies": {
+                "axios": "^0.20.0"
+            }
+        },
+        "node_modules/translate-google-api/node_modules/axios": {
+            "version": "0.20.0",
+            "resolved": "https://registry.npmjs.org/axios/-/axios-0.20.0.tgz",
+            "integrity": "sha512-ANA4rr2BDcmmAQLOKft2fufrtuvlqR+cXNNinUmvfeSNCOF98PZL+7M/v1zIdGo7OLjEA9J2gXJL+j4zGsl0bA==",
+            "dependencies": {
+                "follow-redirects": "^1.10.0"
+            }
+        },
+        "node_modules/traverse-chain": {
+            "version": "0.1.0",
+            "resolved": "https://registry.npmjs.org/traverse-chain/-/traverse-chain-0.1.0.tgz",
+            "integrity": "sha1-YdvC1Ttp/2CRoSoWj9fUMxB+QPE="
+        },
+        "node_modules/tree-kill": {
+            "version": "1.2.2",
+            "resolved": "https://registry.npmjs.org/tree-kill/-/tree-kill-1.2.2.tgz",
+            "integrity": "sha512-L0Orpi8qGpRG//Nd+H90vFB+3iHnue1zSSGmNOOCh1GLJ7rUKVwV2HvijphGQS2UmhUZewS9VgvxYIdgr+fG1A==",
+            "dev": true,
+            "bin": {
+                "tree-kill": "cli.js"
+            }
+        },
+        "node_modules/trim-newlines": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-1.0.0.tgz",
+            "integrity": "sha1-WIeWa7WCpFA6QetST301ARgVphM=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/true-case-path": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/true-case-path/-/true-case-path-1.0.3.tgz",
+            "integrity": "sha512-m6s2OdQe5wgpFMC+pAJ+q9djG82O2jcHPOI6RNg1yy9rCYR+WD6Nbpl32fDpfC56nirdRy+opFa/Vk7HYhqaew==",
+            "dependencies": {
+                "glob": "^7.1.2"
+            }
+        },
+        "node_modules/tryit": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/tryit/-/tryit-1.0.3.tgz",
+            "integrity": "sha1-OTvnMKlEb9Hq1tpZoBQwjzbCics="
+        },
+        "node_modules/ts-loader": {
+            "version": "5.4.5",
+            "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-5.4.5.tgz",
+            "integrity": "sha512-XYsjfnRQCBum9AMRZpk2rTYSVpdZBpZK+kDh0TeT3kxmQNBDVIeUjdPjY5RZry4eIAb8XHc4gYSUiUWPYvzSRw==",
+            "dev": true,
+            "dependencies": {
+                "chalk": "^2.3.0",
+                "enhanced-resolve": "^4.0.0",
+                "loader-utils": "^1.0.2",
+                "micromatch": "^3.1.4",
+                "semver": "^5.0.1"
+            },
+            "engines": {
+                "node": ">=6.11.5"
+            }
+        },
+        "node_modules/ts-node": {
+            "version": "7.0.1",
+            "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-7.0.1.tgz",
+            "integrity": "sha512-BVwVbPJRspzNh2yfslyT1PSbl5uIk03EZlb493RKHN4qej/D06n1cEhjlOJG69oFsE7OT8XjpTUcYf6pKTLMhw==",
+            "dev": true,
+            "dependencies": {
+                "arrify": "^1.0.0",
+                "buffer-from": "^1.1.0",
+                "diff": "^3.1.0",
+                "make-error": "^1.1.1",
+                "minimist": "^1.2.0",
+                "mkdirp": "^0.5.1",
+                "source-map-support": "^0.5.6",
+                "yn": "^2.0.0"
+            },
+            "bin": {
+                "ts-node": "dist/bin.js"
+            },
+            "engines": {
+                "node": ">=4.2.0"
+            }
+        },
+        "node_modules/ts-node-dev": {
+            "version": "1.0.0-pre.49",
+            "resolved": "https://registry.npmjs.org/ts-node-dev/-/ts-node-dev-1.0.0-pre.49.tgz",
+            "integrity": "sha512-iJd4QPPOaCAByl/WuEdmDX8xDR2GmoWYu6aKvGudGUcfP1sJRjpaHb7oFDuvBspQF1xhxUdbjfHuvEtZPwKZFQ==",
+            "dev": true,
+            "dependencies": {
+                "chokidar": "^3.4.0",
+                "dateformat": "~1.0.4-1.2.3",
+                "dynamic-dedupe": "^0.3.0",
+                "minimist": "^1.2.5",
+                "mkdirp": "^1.0.4",
+                "node-notifier": "^5.4.0",
+                "resolve": "^1.0.0",
+                "rimraf": "^2.6.1",
+                "source-map-support": "^0.5.12",
+                "tree-kill": "^1.2.2",
+                "ts-node": "^8.10.2",
+                "tsconfig": "^7.0.0"
+            },
+            "bin": {
+                "ts-node-dev": "bin/ts-node-dev",
+                "tsnd": "bin/ts-node-dev"
+            },
+            "engines": {
+                "node": ">=0.8.0"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/anymatch": {
+            "version": "3.1.1",
+            "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.1.tgz",
+            "integrity": "sha512-mM8522psRCqzV+6LhomX5wgp25YVibjh8Wj23I5RPkPppSVSjyKD2A2mBJmWGa+KN7f2D6LNh9jkBCeyLktzjg==",
+            "dev": true,
+            "dependencies": {
+                "normalize-path": "^3.0.0",
+                "picomatch": "^2.0.4"
+            },
+            "engines": {
+                "node": ">= 8"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/binary-extensions": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.0.0.tgz",
+            "integrity": "sha512-Phlt0plgpIIBOGTT/ehfFnbNlfsDEiqmzE2KRXoX1bLIlir4X/MR+zSyBEkL05ffWgnRSf/DXv+WrUAVr93/ow==",
+            "dev": true,
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/braces": {
+            "version": "3.0.2",
+            "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
+            "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
+            "dev": true,
+            "dependencies": {
+                "fill-range": "^7.0.1"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/chokidar": {
+            "version": "3.4.0",
+            "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.4.0.tgz",
+            "integrity": "sha512-aXAaho2VJtisB/1fg1+3nlLJqGOuewTzQpd/Tz0yTg2R0e4IGtshYvtjowyEumcBv2z+y4+kc75Mz7j5xJskcQ==",
+            "dev": true,
+            "dependencies": {
+                "anymatch": "~3.1.1",
+                "braces": "~3.0.2",
+                "glob-parent": "~5.1.0",
+                "is-binary-path": "~2.1.0",
+                "is-glob": "~4.0.1",
+                "normalize-path": "~3.0.0",
+                "readdirp": "~3.4.0"
+            },
+            "engines": {
+                "node": ">= 8.10.0"
+            },
+            "optionalDependencies": {
+                "fsevents": "~2.1.2"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/diff": {
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
+            "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.3.1"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/fill-range": {
+            "version": "7.0.1",
+            "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
+            "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
+            "dev": true,
+            "dependencies": {
+                "to-regex-range": "^5.0.1"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/glob-parent": {
+            "version": "5.1.1",
+            "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.1.tgz",
+            "integrity": "sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==",
+            "dev": true,
+            "dependencies": {
+                "is-glob": "^4.0.1"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/is-binary-path": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
+            "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
+            "dev": true,
+            "dependencies": {
+                "binary-extensions": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/is-number": {
+            "version": "7.0.0",
+            "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+            "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.12.0"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/mkdirp": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz",
+            "integrity": "sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==",
+            "dev": true,
+            "bin": {
+                "mkdirp": "bin/cmd.js"
+            },
+            "engines": {
+                "node": ">=10"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/readdirp": {
+            "version": "3.4.0",
+            "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.4.0.tgz",
+            "integrity": "sha512-0xe001vZBnJEK+uKcj8qOhyAKPzIT+gStxWr3LCB0DwcXR5NZJ3IaC+yGnHCYzB/S7ov3m3EEbZI2zeNvX+hGQ==",
+            "dev": true,
+            "dependencies": {
+                "picomatch": "^2.2.1"
+            },
+            "engines": {
+                "node": ">=8.10.0"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/rimraf": {
+            "version": "2.7.1",
+            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+            "dev": true,
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/to-regex-range": {
+            "version": "5.0.1",
+            "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+            "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+            "dev": true,
+            "dependencies": {
+                "is-number": "^7.0.0"
+            },
+            "engines": {
+                "node": ">=8.0"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/ts-node": {
+            "version": "8.10.2",
+            "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-8.10.2.tgz",
+            "integrity": "sha512-ISJJGgkIpDdBhWVu3jufsWpK3Rzo7bdiIXJjQc0ynKxVOVcg2oIrf2H2cejminGrptVc6q6/uynAHNCuWGbpVA==",
+            "dev": true,
+            "dependencies": {
+                "arg": "^4.1.0",
+                "diff": "^4.0.1",
+                "make-error": "^1.1.1",
+                "source-map-support": "^0.5.17",
+                "yn": "3.1.1"
+            },
+            "bin": {
+                "ts-node": "dist/bin.js",
+                "ts-node-script": "dist/bin-script.js",
+                "ts-node-transpile-only": "dist/bin-transpile.js",
+                "ts-script": "dist/bin-script-deprecated.js"
+            },
+            "engines": {
+                "node": ">=6.0.0"
+            }
+        },
+        "node_modules/ts-node-dev/node_modules/yn": {
+            "version": "3.1.1",
+            "resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz",
+            "integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==",
+            "dev": true,
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/ts-node/node_modules/arrify": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
+            "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/tsconfig": {
+            "version": "7.0.0",
+            "resolved": "https://registry.npmjs.org/tsconfig/-/tsconfig-7.0.0.tgz",
+            "integrity": "sha512-vZXmzPrL+EmC4T/4rVlT2jNVMWCi/O4DIiSj3UHg1OE5kCKbk4mfrXc6dZksLgRM/TZlKnousKH9bbTazUWRRw==",
+            "dev": true,
+            "dependencies": {
+                "@types/strip-bom": "^3.0.0",
+                "@types/strip-json-comments": "0.0.30",
+                "strip-bom": "^3.0.0",
+                "strip-json-comments": "^2.0.0"
+            }
+        },
+        "node_modules/tsconfig/node_modules/strip-bom": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
+            "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM=",
+            "dev": true,
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/tslib": {
+            "version": "1.11.1",
+            "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.11.1.tgz",
+            "integrity": "sha512-aZW88SY8kQbU7gpV19lN24LtXh/yD4ZZg6qieAJDDg+YBsJcSmLGK9QpnUjAKVG/xefmvJGd1WUmfpT/g6AJGA==",
+            "dev": true
+        },
+        "node_modules/tslint": {
+            "version": "5.20.1",
+            "resolved": "https://registry.npmjs.org/tslint/-/tslint-5.20.1.tgz",
+            "integrity": "sha512-EcMxhzCFt8k+/UP5r8waCf/lzmeSyVlqxqMEDQE7rWYiQky8KpIBz1JAoYXfROHrPZ1XXd43q8yQnULOLiBRQg==",
+            "dev": true,
+            "dependencies": {
+                "@babel/code-frame": "^7.0.0",
+                "builtin-modules": "^1.1.1",
+                "chalk": "^2.3.0",
+                "commander": "^2.12.1",
+                "diff": "^4.0.1",
+                "glob": "^7.1.1",
+                "js-yaml": "^3.13.1",
+                "minimatch": "^3.0.4",
+                "mkdirp": "^0.5.1",
+                "resolve": "^1.3.2",
+                "semver": "^5.3.0",
+                "tslib": "^1.8.0",
+                "tsutils": "^2.29.0"
+            },
+            "bin": {
+                "tslint": "bin/tslint"
+            },
+            "engines": {
+                "node": ">=4.8.0"
+            }
+        },
+        "node_modules/tslint-loader": {
+            "version": "3.6.0",
+            "resolved": "https://registry.npmjs.org/tslint-loader/-/tslint-loader-3.6.0.tgz",
+            "integrity": "sha512-Me9Qf/87BOfCY8uJJw+J7VMF4U8WiMXKLhKKKugMydF0xMhMOt9wo2mjYTNhwbF9H7SHh8PAIwRG8roisTNekQ==",
+            "dev": true,
+            "dependencies": {
+                "loader-utils": "^1.0.2",
+                "mkdirp": "^0.5.1",
+                "object-assign": "^4.1.1",
+                "rimraf": "^2.4.4",
+                "semver": "^5.3.0"
+            }
+        },
+        "node_modules/tslint-loader/node_modules/rimraf": {
+            "version": "2.7.1",
+            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+            "dev": true,
+            "dependencies": {
+                "glob": "^7.1.3"
+            },
+            "bin": {
+                "rimraf": "bin.js"
+            }
+        },
+        "node_modules/tslint/node_modules/diff": {
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
+            "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.3.1"
+            }
+        },
+        "node_modules/tsscmp": {
+            "version": "1.0.6",
+            "resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.6.tgz",
+            "integrity": "sha512-LxhtAkPDTkVCMQjt2h6eBVY28KCjikZqZfMcC15YBeNjkgUpdCfBu5HoiOTDu86v6smE8yOjyEktJ8hlbANHQA==",
+            "engines": {
+                "node": ">=0.6.x"
+            }
+        },
+        "node_modules/tsutils": {
+            "version": "2.29.0",
+            "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.29.0.tgz",
+            "integrity": "sha512-g5JVHCIJwzfISaXpXE1qvNalca5Jwob6FjI4AoPlqMusJ6ftFE7IkkFoMhVLRgK+4Kx3gkzb8UZK5t5yTTvEmA==",
+            "dev": true,
+            "dependencies": {
+                "tslib": "^1.8.1"
+            }
+        },
+        "node_modules/tty-browserify": {
+            "version": "0.0.0",
+            "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz",
+            "integrity": "sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY=",
+            "dev": true
+        },
+        "node_modules/tunnel-agent": {
+            "version": "0.6.0",
+            "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
+            "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0=",
+            "dependencies": {
+                "safe-buffer": "^5.0.1"
+            },
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/tweetnacl": {
+            "version": "0.14.5",
+            "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
+            "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q="
+        },
+        "node_modules/type": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/type/-/type-1.2.0.tgz",
+            "integrity": "sha512-+5nt5AAniqsCnu2cEQQdpzCAh33kVx8n0VoFidKpB1dVVLAN/F+bgVOqOJqOnEnrhp222clB5p3vUlD+1QAnfg==",
+            "dev": true
+        },
+        "node_modules/type-check": {
+            "version": "0.3.2",
+            "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz",
+            "integrity": "sha1-WITKtRLPHTVeP7eE8wgEsrUg23I=",
+            "dev": true,
+            "dependencies": {
+                "prelude-ls": "~1.1.2"
+            },
+            "engines": {
+                "node": ">= 0.8.0"
+            }
+        },
+        "node_modules/type-detect": {
+            "version": "4.0.8",
+            "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.8.tgz",
+            "integrity": "sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g==",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/type-is": {
+            "version": "1.6.18",
+            "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz",
+            "integrity": "sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==",
+            "dependencies": {
+                "media-typer": "0.3.0",
+                "mime-types": "~2.1.24"
+            },
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/typed-styles": {
+            "version": "0.0.7",
+            "resolved": "https://registry.npmjs.org/typed-styles/-/typed-styles-0.0.7.tgz",
+            "integrity": "sha512-pzP0PWoZUhsECYjABgCGQlRGL1n7tOHsgwYv3oIiEpJwGhFTuty/YNeduxQYzXXa3Ge5BdT6sHYIQYpl4uJ+5Q=="
+        },
+        "node_modules/typedarray": {
+            "version": "0.0.6",
+            "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
+            "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
+        },
+        "node_modules/typescript": {
+            "version": "3.9.9",
+            "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.9.tgz",
+            "integrity": "sha512-kdMjTiekY+z/ubJCATUPlRDl39vXYiMV9iyeMuEuXZh2we6zz80uovNN2WlAxmmdE/Z/YQe+EbOEXB5RHEED3w==",
+            "dev": true,
+            "bin": {
+                "tsc": "bin/tsc",
+                "tsserver": "bin/tsserver"
+            },
+            "engines": {
+                "node": ">=4.2.0"
+            }
+        },
+        "node_modules/typescript-collections": {
+            "version": "1.3.3",
+            "resolved": "https://registry.npmjs.org/typescript-collections/-/typescript-collections-1.3.3.tgz",
+            "integrity": "sha512-7sI4e/bZijOzyURng88oOFZCISQPTHozfE2sUu5AviFYk5QV7fYGb6YiDl+vKjF/pICA354JImBImL9XJWUvdQ=="
+        },
+        "node_modules/typescript-language-server": {
+            "version": "0.4.0",
+            "resolved": "https://registry.npmjs.org/typescript-language-server/-/typescript-language-server-0.4.0.tgz",
+            "integrity": "sha512-K8jNOmDFn+QfrCh8ujby2pGDs5rpjYZQn+zvQnf42rxG4IHbfw5CHoMvbGkWPK/J5Gw8/l5K3i03kVZC2IBElg==",
+            "dependencies": {
+                "command-exists": "1.2.6",
+                "commander": "^2.11.0",
+                "fs-extra": "^7.0.0",
+                "p-debounce": "^1.0.0",
+                "tempy": "^0.2.1",
+                "vscode-languageserver": "^5.3.0-next",
+                "vscode-uri": "^1.0.5"
+            },
+            "bin": {
+                "typescript-language-server": "lib/cli.js"
+            }
+        },
+        "node_modules/typescript-language-server/node_modules/fs-extra": {
+            "version": "7.0.1",
+            "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-7.0.1.tgz",
+            "integrity": "sha512-YJDaCJZEnBmcbw13fvdAM9AwNOJwOzrE4pqMqBq5nFiEqXUqHwlK4B+3pUw6JNvfSPtX05xFHtYy/1ni01eGCw==",
+            "dependencies": {
+                "graceful-fs": "^4.1.2",
+                "jsonfile": "^4.0.0",
+                "universalify": "^0.1.0"
+            },
+            "engines": {
+                "node": ">=6 <7 || >=8"
+            }
+        },
+        "node_modules/typescript-language-server/node_modules/jsonfile": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
+            "integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss=",
+            "dependencies": {
+                "graceful-fs": "^4.1.6"
+            }
+        },
+        "node_modules/typical": {
+            "version": "2.6.1",
+            "resolved": "https://registry.npmjs.org/typical/-/typical-2.6.1.tgz",
+            "integrity": "sha1-XAgOXWYcu+OCWdLnCjxyU+hziB0="
+        },
+        "node_modules/ua-parser-js": {
+            "version": "0.7.21",
+            "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.21.tgz",
+            "integrity": "sha512-+O8/qh/Qj8CgC6eYBVBykMrNtp5Gebn4dlGD/kKXVkJNDwyrAwSIqwz8CDf+tsAIWVycKcku6gIXJ0qwx/ZXaQ==",
+            "engines": {
+                "node": "*"
+            }
+        },
+        "node_modules/uglify-js": {
+            "version": "2.8.29",
+            "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz",
+            "integrity": "sha1-KcVzMUgFe7Th913zW3qcty5qWd0=",
+            "dependencies": {
+                "source-map": "~0.5.1",
+                "yargs": "~3.10.0"
+            },
+            "bin": {
+                "uglifyjs": "bin/uglifyjs"
+            },
+            "engines": {
+                "node": ">=0.8.0"
+            },
+            "optionalDependencies": {
+                "uglify-to-browserify": "~1.0.0"
+            }
+        },
+        "node_modules/uglify-js/node_modules/camelcase": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+            "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/uglify-js/node_modules/cliui": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+            "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE=",
+            "dependencies": {
+                "center-align": "^0.1.1",
+                "right-align": "^0.1.1",
+                "wordwrap": "0.0.2"
+            }
+        },
+        "node_modules/uglify-js/node_modules/yargs": {
+            "version": "3.10.0",
+            "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+            "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E=",
+            "dependencies": {
+                "camelcase": "^1.0.2",
+                "cliui": "^2.1.0",
+                "decamelize": "^1.0.0",
+                "window-size": "0.1.0"
+            }
+        },
+        "node_modules/uglify-to-browserify": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz",
+            "integrity": "sha1-bgkk1r2mta/jSeOabWMoUKD4grc=",
+            "optional": true
+        },
+        "node_modules/uid-safe": {
+            "version": "2.1.5",
+            "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.1.5.tgz",
+            "integrity": "sha512-KPHm4VL5dDXKz01UuEd88Df+KzynaohSL9fBh096KWAxSKZQDI2uBrVqtvRM4rwrIrRRKsdLNML/lnaaVSRioA==",
+            "dependencies": {
+                "random-bytes": "~1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/uid2": {
+            "version": "0.0.3",
+            "resolved": "https://registry.npmjs.org/uid2/-/uid2-0.0.3.tgz",
+            "integrity": "sha1-SDEm4Rd03y9xuLY53NeZw3YWK4I="
+        },
+        "node_modules/unbzip2-stream": {
+            "version": "1.4.3",
+            "resolved": "https://registry.npmjs.org/unbzip2-stream/-/unbzip2-stream-1.4.3.tgz",
+            "integrity": "sha512-mlExGW4w71ebDJviH16lQLtZS32VKqsSfk80GCfUlwT/4/hNRFsoscrF/c++9xinkMzECL1uL9DDwXqFWkruPg==",
+            "dependencies": {
+                "buffer": "^5.2.1",
+                "through": "^2.3.8"
+            }
+        },
+        "node_modules/undefsafe": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/undefsafe/-/undefsafe-2.0.3.tgz",
+            "integrity": "sha512-nrXZwwXrD/T/JXeygJqdCO6NZZ1L66HrxM/Z7mIq2oPanoN0F1nLx3lwJMu6AwJY69hdixaFQOuoYsMjE5/C2A==",
+            "dependencies": {
+                "debug": "^2.2.0"
+            }
+        },
+        "node_modules/undefsafe/node_modules/debug": {
+            "version": "2.6.9",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+            "dependencies": {
+                "ms": "2.0.0"
+            }
+        },
+        "node_modules/undefsafe/node_modules/ms": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        },
+        "node_modules/underscore": {
+            "version": "1.10.2",
+            "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.10.2.tgz",
+            "integrity": "sha512-N4P+Q/BuyuEKFJ43B9gYuOj4TQUHXX+j2FqguVOpjkssLUUrnJofCcBccJSCoeturDoZU6GorDTHSvUDlSQbTg=="
+        },
+        "node_modules/unicode-trie": {
+            "version": "0.3.1",
+            "resolved": "https://registry.npmjs.org/unicode-trie/-/unicode-trie-0.3.1.tgz",
+            "integrity": "sha1-1nHd3YkQGgi6w3tqUWEBBgIFIIU=",
+            "dependencies": {
+                "pako": "^0.2.5",
+                "tiny-inflate": "^1.0.0"
+            }
+        },
+        "node_modules/unicode-trie/node_modules/pako": {
+            "version": "0.2.9",
+            "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz",
+            "integrity": "sha1-8/dSL073gjSNqBYbrZ7P1Rv4OnU="
+        },
+        "node_modules/union-value": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/union-value/-/union-value-1.0.1.tgz",
+            "integrity": "sha512-tJfXmxMeWYnczCVs7XAEvIV7ieppALdyepWMkHkwciRpZraG/xwT+s2JN8+pr1+8jCRf80FFzvr+MpQeeoF4Xg==",
+            "dependencies": {
+                "arr-union": "^3.1.0",
+                "get-value": "^2.0.6",
+                "is-extendable": "^0.1.1",
+                "set-value": "^2.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/union-value/node_modules/is-extendable": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
+            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/uniq": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/uniq/-/uniq-1.0.1.tgz",
+            "integrity": "sha1-sxxa6CVIRKOoKBVBzisEuGWnNP8=",
+            "dev": true
+        },
+        "node_modules/unique-filename": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/unique-filename/-/unique-filename-1.1.1.tgz",
+            "integrity": "sha512-Vmp0jIp2ln35UTXuryvjzkjGdRyf9b2lTXuSYUiPmzRcl3FDtYqAwOnTJkAngD9SWhnoJzDbTKwaOrZ+STtxNQ==",
+            "dev": true,
+            "dependencies": {
+                "unique-slug": "^2.0.0"
+            }
+        },
+        "node_modules/unique-slug": {
+            "version": "2.0.2",
+            "resolved": "https://registry.npmjs.org/unique-slug/-/unique-slug-2.0.2.tgz",
+            "integrity": "sha512-zoWr9ObaxALD3DOPfjPSqxt4fnZiWblxHIgeWqW8x7UqDzEtHEQLzji2cuJYQFCU6KmoJikOYAZlrTHHebjx2w==",
+            "dev": true,
+            "dependencies": {
+                "imurmurhash": "^0.1.4"
+            }
+        },
+        "node_modules/unique-string": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-1.0.0.tgz",
+            "integrity": "sha1-nhBXzKhRq7kzmPizOuGHuZyuwRo=",
+            "dependencies": {
+                "crypto-random-string": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/universalify": {
+            "version": "0.1.2",
+            "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",
+            "integrity": "sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==",
+            "engines": {
+                "node": ">= 4.0.0"
+            }
+        },
+        "node_modules/unorm": {
+            "version": "1.6.0",
+            "resolved": "https://registry.npmjs.org/unorm/-/unorm-1.6.0.tgz",
+            "integrity": "sha512-b2/KCUlYZUeA7JFUuRJZPUtr4gZvBh7tavtv4fvk4+KV9pfGiR6CQAQAWl49ZpR3ts2dk4FYkP7EIgDJoiOLDA==",
+            "engines": {
+                "node": ">= 0.4.0"
+            }
+        },
+        "node_modules/unpack-string": {
+            "version": "0.0.2",
+            "resolved": "https://registry.npmjs.org/unpack-string/-/unpack-string-0.0.2.tgz",
+            "integrity": "sha1-MC7PCCOLATm9Q0pNf9Z83zPKJ10="
+        },
+        "node_modules/unpipe": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
+            "integrity": "sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw=",
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/unset-value": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/unset-value/-/unset-value-1.0.0.tgz",
+            "integrity": "sha1-g3aHP30jNRef+x5vw6jtDfyKtVk=",
+            "dependencies": {
+                "has-value": "^0.3.1",
+                "isobject": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/unset-value/node_modules/has-value": {
+            "version": "0.3.1",
+            "resolved": "https://registry.npmjs.org/has-value/-/has-value-0.3.1.tgz",
+            "integrity": "sha1-ex9YutpiyoJ+wKIHgCVlSEWZXh8=",
+            "dependencies": {
+                "get-value": "^2.0.3",
+                "has-values": "^0.1.4",
+                "isobject": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/unset-value/node_modules/has-value/node_modules/isobject": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+            "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
+            "dependencies": {
+                "isarray": "1.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/unset-value/node_modules/has-values": {
+            "version": "0.1.4",
+            "resolved": "https://registry.npmjs.org/has-values/-/has-values-0.1.4.tgz",
+            "integrity": "sha1-bWHeldkd/Km5oCCJrThL/49it3E=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/unstated": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/unstated/-/unstated-2.1.1.tgz",
+            "integrity": "sha512-fORlTWMZxq7NuMJDxyIrrYIZKN7wEWYQ9SiaJfIRcSpsowr6Ph/JIfK2tgtXLW614JfPG/t5q9eEIhXRCf55xg==",
+            "dependencies": {
+                "create-react-context": "^0.1.5"
+            }
+        },
+        "node_modules/unstated/node_modules/create-react-context": {
+            "version": "0.1.6",
+            "resolved": "https://registry.npmjs.org/create-react-context/-/create-react-context-0.1.6.tgz",
+            "integrity": "sha512-eCnYYEUEc5i32LHwpE/W7NlddOB9oHwsPaWtWzYtflNkkwa3IfindIcoXdVWs12zCbwaMCavKNu84EXogVIWHw=="
+        },
+        "node_modules/unzip-response": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz",
+            "integrity": "sha1-0vD3N9FrBhXnKmk17QQhRXLVb5c=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/upath": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/upath/-/upath-1.2.0.tgz",
+            "integrity": "sha512-aZwGpamFO61g3OlfT7OQCHqhGnW43ieH9WZeP7QxN/G/jS4jfqUkZxoryvJgVPEcrl5NL/ggHsSmLMHuH64Lhg==",
+            "engines": {
+                "node": ">=4",
+                "yarn": "*"
+            }
+        },
+        "node_modules/update-notifier": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.5.0.tgz",
+            "integrity": "sha512-gwMdhgJHGuj/+wHJJs9e6PcCszpxR1b236igrOkUofGhqJuG+amlIKwApH1IW1WWl7ovZxsX49lMBWLxSdm5Dw==",
+            "dependencies": {
+                "boxen": "^1.2.1",
+                "chalk": "^2.0.1",
+                "configstore": "^3.0.0",
+                "import-lazy": "^2.1.0",
+                "is-ci": "^1.0.10",
+                "is-installed-globally": "^0.1.0",
+                "is-npm": "^1.0.0",
+                "latest-version": "^3.0.0",
+                "semver-diff": "^2.0.0",
+                "xdg-basedir": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/uri-js": {
+            "version": "4.2.2",
+            "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.2.2.tgz",
+            "integrity": "sha512-KY9Frmirql91X2Qgjry0Wd4Y+YTdrdZheS8TFwvkbLWf/G5KNJDCh6pKL5OZctEW4+0Baa5idK2ZQuELRwPznQ==",
+            "dependencies": {
+                "punycode": "^2.1.0"
+            }
+        },
+        "node_modules/urix": {
+            "version": "0.1.0",
+            "resolved": "https://registry.npmjs.org/urix/-/urix-0.1.0.tgz",
+            "integrity": "sha1-2pN/emLiH+wf0Y1Js1wpNQZ6bHI="
+        },
+        "node_modules/url": {
+            "version": "0.11.0",
+            "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+            "integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=",
+            "dev": true,
+            "dependencies": {
+                "punycode": "1.3.2",
+                "querystring": "0.2.0"
+            }
+        },
+        "node_modules/url-loader": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/url-loader/-/url-loader-1.1.2.tgz",
+            "integrity": "sha512-dXHkKmw8FhPqu8asTc1puBfe3TehOCo2+RmOOev5suNCIYBcT626kxiWg1NBVkwc4rO8BGa7gP70W7VXuqHrjg==",
+            "dependencies": {
+                "loader-utils": "^1.1.0",
+                "mime": "^2.0.3",
+                "schema-utils": "^1.0.0"
+            },
+            "engines": {
+                "node": ">= 6.9.0"
+            }
+        },
+        "node_modules/url-loader/node_modules/mime": {
+            "version": "2.4.4",
+            "resolved": "https://registry.npmjs.org/mime/-/mime-2.4.4.tgz",
+            "integrity": "sha512-LRxmNwziLPT828z+4YkNzloCFC2YM4wrB99k+AV5ZbEyfGNWfG8SO1FUXLmLDBSo89NrJZ4DIWeLjy1CHGhMGA==",
+            "bin": {
+                "mime": "cli.js"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/url-loader/node_modules/schema-utils": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
+            "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
+            "dependencies": {
+                "ajv": "^6.1.0",
+                "ajv-errors": "^1.0.0",
+                "ajv-keywords": "^3.1.0"
+            },
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/url-parse": {
+            "version": "1.4.7",
+            "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.4.7.tgz",
+            "integrity": "sha512-d3uaVyzDB9tQoSXFvuSUNFibTd9zxd2bkVrDRvF5TmvWWQwqE4lgYJ5m+x1DbecWkw+LK4RNl2CU1hHuOKPVlg==",
+            "dev": true,
+            "dependencies": {
+                "querystringify": "^2.1.1",
+                "requires-port": "^1.0.0"
+            }
+        },
+        "node_modules/url-parse-lax": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-1.0.0.tgz",
+            "integrity": "sha1-evjzA2Rem9eaJy56FKxovAYJ2nM=",
+            "dependencies": {
+                "prepend-http": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/url-template": {
+            "version": "2.0.8",
+            "resolved": "https://registry.npmjs.org/url-template/-/url-template-2.0.8.tgz",
+            "integrity": "sha1-/FZaPMy/93MMd19WQflVV5FDnyE="
+        },
+        "node_modules/url/node_modules/punycode": {
+            "version": "1.3.2",
+            "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
+            "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0=",
+            "dev": true
+        },
+        "node_modules/use": {
+            "version": "3.1.1",
+            "resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz",
+            "integrity": "sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/use-asset": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/use-asset/-/use-asset-1.0.4.tgz",
+            "integrity": "sha512-7/hqDrWa0iMnCoET9W1T07EmD4Eg/Wmoj/X8TGBc++ECRK4m5yTsjP4O6s0yagbxfqIOuUkIxe2/sA+VR2GxZA==",
+            "dependencies": {
+                "fast-deep-equal": "^3.1.3"
+            }
+        },
+        "node_modules/use-asset/node_modules/fast-deep-equal": {
+            "version": "3.1.3",
+            "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
+            "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="
+        },
+        "node_modules/use-memo-one": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/use-memo-one/-/use-memo-one-1.1.1.tgz",
+            "integrity": "sha512-oFfsyun+bP7RX8X2AskHNTxu+R3QdE/RC5IefMbqptmACAA/gfol1KDD5KRzPsGMa62sWxGZw+Ui43u6x4ddoQ=="
+        },
+        "node_modules/util": {
+            "version": "0.11.1",
+            "resolved": "https://registry.npmjs.org/util/-/util-0.11.1.tgz",
+            "integrity": "sha512-HShAsny+zS2TZfaXxD9tYj4HQGlBezXZMZuM/S5PKLLoZkShZiGk9o5CzukI1LVHZvjdvZ2Sj1aW/Ndn2NB/HQ==",
+            "dev": true,
+            "dependencies": {
+                "inherits": "2.0.3"
+            }
+        },
+        "node_modules/util-deprecate": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+            "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
+        },
+        "node_modules/util/node_modules/inherits": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
+            "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
+            "dev": true
+        },
+        "node_modules/utility-types": {
+            "version": "3.10.0",
+            "resolved": "https://registry.npmjs.org/utility-types/-/utility-types-3.10.0.tgz",
+            "integrity": "sha512-O11mqxmi7wMKCo6HKFt5AhO4BwY3VV68YU07tgxfz8zJTIxr4BpsezN49Ffwy9j3ZpwwJp4fkRwjRzq3uWE6Rg==",
+            "engines": {
+                "node": ">= 4"
+            }
+        },
+        "node_modules/utils-merge": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
+            "integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM=",
+            "engines": {
+                "node": ">= 0.4.0"
+            }
+        },
+        "node_modules/uuid": {
+            "version": "3.4.0",
+            "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz",
+            "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==",
+            "bin": {
+                "uuid": "bin/uuid"
+            }
+        },
+        "node_modules/v8-compile-cache": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.1.1.tgz",
+            "integrity": "sha512-8OQ9CL+VWyt3JStj7HX7/ciTL2V3Rl1Wf5OL+SNTm0yK1KvtReVulksyeRnCANHHuUxHlQig+JJDlUhBt1NQDQ==",
+            "dev": true
+        },
+        "node_modules/valid-url": {
+            "version": "1.0.9",
+            "resolved": "https://registry.npmjs.org/valid-url/-/valid-url-1.0.9.tgz",
+            "integrity": "sha1-HBRHm0DxOXp1eC8RXkCGRHQzogA="
+        },
+        "node_modules/validate-npm-package-license": {
+            "version": "3.0.4",
+            "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz",
+            "integrity": "sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==",
+            "dependencies": {
+                "spdx-correct": "^3.0.0",
+                "spdx-expression-parse": "^3.0.0"
+            }
+        },
+        "node_modules/validator": {
+            "version": "10.11.0",
+            "resolved": "https://registry.npmjs.org/validator/-/validator-10.11.0.tgz",
+            "integrity": "sha512-X/p3UZerAIsbBfN/IwahhYaBbY68EN/UQBWHtsbXGT5bfrH/p4NQzUCG1kF/rtKaNpnJ7jAu6NGTdSNtyNIXMw==",
+            "engines": {
+                "node": ">= 0.10"
+            }
+        },
+        "node_modules/vary": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
+            "integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=",
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
+        "node_modules/verror": {
+            "version": "1.10.0",
+            "resolved": "https://registry.npmjs.org/verror/-/verror-1.10.0.tgz",
+            "integrity": "sha1-OhBcoXBTr1XW4nDB+CiGguGNpAA=",
+            "engines": [
+                "node >=0.6.0"
+            ],
+            "dependencies": {
+                "assert-plus": "^1.0.0",
+                "core-util-is": "1.0.2",
+                "extsprintf": "^1.2.0"
+            }
+        },
+        "node_modules/vm-browserify": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-1.1.2.tgz",
+            "integrity": "sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==",
+            "dev": true
+        },
+        "node_modules/void-elements": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-2.0.1.tgz",
+            "integrity": "sha1-wGavtYK7HLQSjWDqkjkulNXp2+w=",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/vscode-jsonrpc": {
+            "version": "5.0.1",
+            "resolved": "https://registry.npmjs.org/vscode-jsonrpc/-/vscode-jsonrpc-5.0.1.tgz",
+            "integrity": "sha512-JvONPptw3GAQGXlVV2utDcHx0BiY34FupW/kI6mZ5x06ER5DdPG/tXWMVHjTNULF5uKPOUUD0SaXg5QaubJL0A==",
+            "engines": {
+                "node": ">=8.0.0 || >=10.0.0"
+            }
+        },
+        "node_modules/vscode-languageserver": {
+            "version": "5.3.0-next.10",
+            "resolved": "https://registry.npmjs.org/vscode-languageserver/-/vscode-languageserver-5.3.0-next.10.tgz",
+            "integrity": "sha512-QL7Fe1FT6PdLtVzwJeZ78pTic4eZbzLRy7yAQgPb9xalqqgZESR0+yDZPwJrM3E7PzOmwHBceYcJR54eQZ7Kng==",
+            "dependencies": {
+                "vscode-languageserver-protocol": "^3.15.0-next.8",
+                "vscode-textbuffer": "^1.0.0"
+            },
+            "bin": {
+                "installServerIntoExtension": "bin/installServerIntoExtension"
+            }
+        },
+        "node_modules/vscode-languageserver-protocol": {
+            "version": "3.15.3",
+            "resolved": "https://registry.npmjs.org/vscode-languageserver-protocol/-/vscode-languageserver-protocol-3.15.3.tgz",
+            "integrity": "sha512-zrMuwHOAQRhjDSnflWdJG+O2ztMWss8GqUUB8dXLR/FPenwkiBNkMIJJYfSN6sgskvsF0rHAoBowNQfbyZnnvw==",
+            "dependencies": {
+                "vscode-jsonrpc": "^5.0.1",
+                "vscode-languageserver-types": "3.15.1"
+            }
+        },
+        "node_modules/vscode-languageserver-types": {
+            "version": "3.15.1",
+            "resolved": "https://registry.npmjs.org/vscode-languageserver-types/-/vscode-languageserver-types-3.15.1.tgz",
+            "integrity": "sha512-+a9MPUQrNGRrGU630OGbYVQ+11iOIovjCkqxajPa9w57Sd5ruK8WQNsslzpa0x/QJqC8kRc2DUxWjIFwoNm4ZQ=="
+        },
+        "node_modules/vscode-textbuffer": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/vscode-textbuffer/-/vscode-textbuffer-1.0.0.tgz",
+            "integrity": "sha512-zPaHo4urgpwsm+PrJWfNakolRpryNja18SUip/qIIsfhuEqEIPEXMxHOlFPjvDC4JgTaimkncNW7UMXRJTY6ow=="
+        },
+        "node_modules/vscode-uri": {
+            "version": "1.0.8",
+            "resolved": "https://registry.npmjs.org/vscode-uri/-/vscode-uri-1.0.8.tgz",
+            "integrity": "sha512-obtSWTlbJ+a+TFRYGaUumtVwb+InIUVI0Lu0VBUAPmj2cU5JutEXg3xUE0c2J5Tcy7h2DEKVJBFi+Y9ZSFzzPQ=="
+        },
+        "node_modules/vue-template-compiler": {
+            "version": "2.6.11",
+            "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.6.11.tgz",
+            "integrity": "sha512-KIq15bvQDrcCjpGjrAhx4mUlyyHfdmTaoNfeoATHLAiWB+MU3cx4lOzMwrnUh9cCxy0Lt1T11hAFY6TQgroUAA==",
+            "dependencies": {
+                "de-indent": "^1.0.2",
+                "he": "^1.1.0"
+            }
+        },
+        "node_modules/w3c-hr-time": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz",
+            "integrity": "sha512-z8P5DvDNjKDoFIHK7q8r8lackT6l+jo/Ye3HOle7l9nICP9lf1Ci25fy9vHd0JOWewkIFzXIEig3TdKT7JQ5fQ==",
+            "dev": true,
+            "dependencies": {
+                "browser-process-hrtime": "^1.0.0"
+            }
+        },
+        "node_modules/w3c-keyname": {
+            "version": "2.2.4",
+            "resolved": "https://registry.npmjs.org/w3c-keyname/-/w3c-keyname-2.2.4.tgz",
+            "integrity": "sha512-tOhfEwEzFLJzf6d1ZPkYfGj+FWhIpBux9ppoP3rlclw3Z0BZv3N7b7030Z1kYth+6rDuAsXUFr+d0VE6Ed1ikw=="
+        },
+        "node_modules/w3c-xmlserializer": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-1.1.2.tgz",
+            "integrity": "sha512-p10l/ayESzrBMYWRID6xbuCKh2Fp77+sA0doRuGn4tTIMrrZVeqfpKjXHY+oDh3K4nLdPgNwMTVP6Vp4pvqbNg==",
+            "dev": true,
+            "dependencies": {
+                "domexception": "^1.0.1",
+                "webidl-conversions": "^4.0.2",
+                "xml-name-validator": "^3.0.0"
+            }
+        },
+        "node_modules/walkdir": {
+            "version": "0.4.1",
+            "resolved": "https://registry.npmjs.org/walkdir/-/walkdir-0.4.1.tgz",
+            "integrity": "sha512-3eBwRyEln6E1MSzcxcVpQIhRG8Q1jLvEqRmCZqS3dsfXEDR/AhOF4d+jHg1qvDCpYaVRZjENPQyrVxAkQqxPgQ==",
+            "engines": {
+                "node": ">=6.0.0"
+            }
+        },
+        "node_modules/warning": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/warning/-/warning-3.0.0.tgz",
+            "integrity": "sha1-MuU3fLVy3kqwR1O9+IIcAe1gW3w=",
+            "dependencies": {
+                "loose-envify": "^1.0.0"
+            }
+        },
+        "node_modules/watchpack": {
+            "version": "1.7.5",
+            "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz",
+            "integrity": "sha512-9P3MWk6SrKjHsGkLT2KHXdQ/9SNkyoJbabxnKOoJepsvJjJG8uYTR3yTPxPQvNDI3w4Nz1xnE0TLHK4RIVe/MQ==",
+            "dev": true,
+            "dependencies": {
+                "graceful-fs": "^4.1.2",
+                "neo-async": "^2.5.0"
+            },
+            "optionalDependencies": {
+                "chokidar": "^3.4.1",
+                "watchpack-chokidar2": "^2.0.1"
+            }
+        },
+        "node_modules/watchpack-chokidar2": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/watchpack-chokidar2/-/watchpack-chokidar2-2.0.1.tgz",
+            "integrity": "sha512-nCFfBIPKr5Sh61s4LPpy1Wtfi0HE8isJ3d2Yb5/Ppw2P2B/3eVSEBjKfN0fmHJSK14+31KwMKmcrzs2GM4P0Ww==",
+            "dev": true,
+            "optional": true,
+            "dependencies": {
+                "chokidar": "^2.1.8"
+            }
+        },
+        "node_modules/watchpack/node_modules/anymatch": {
+            "version": "3.1.2",
+            "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz",
+            "integrity": "sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==",
+            "dev": true,
+            "optional": true,
+            "dependencies": {
+                "normalize-path": "^3.0.0",
+                "picomatch": "^2.0.4"
+            },
+            "engines": {
+                "node": ">= 8"
+            }
+        },
+        "node_modules/watchpack/node_modules/binary-extensions": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
+            "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
+            "dev": true,
+            "optional": true,
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/watchpack/node_modules/braces": {
+            "version": "3.0.2",
+            "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
+            "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
+            "dev": true,
+            "optional": true,
+            "dependencies": {
+                "fill-range": "^7.0.1"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/watchpack/node_modules/chokidar": {
+            "version": "3.5.1",
+            "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.1.tgz",
+            "integrity": "sha512-9+s+Od+W0VJJzawDma/gvBNQqkTiqYTWLuZoyAsivsI4AaWTCzHG06/TMjsf1cYe9Cb97UCEhjz7HvnPk2p/tw==",
+            "dev": true,
+            "optional": true,
+            "dependencies": {
+                "anymatch": "~3.1.1",
+                "braces": "~3.0.2",
+                "fsevents": "~2.3.1",
+                "glob-parent": "~5.1.0",
+                "is-binary-path": "~2.1.0",
+                "is-glob": "~4.0.1",
+                "normalize-path": "~3.0.0",
+                "readdirp": "~3.5.0"
+            },
+            "engines": {
+                "node": ">= 8.10.0"
+            }
+        },
+        "node_modules/watchpack/node_modules/fill-range": {
+            "version": "7.0.1",
+            "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
+            "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
+            "dev": true,
+            "optional": true,
+            "dependencies": {
+                "to-regex-range": "^5.0.1"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/watchpack/node_modules/fsevents": {
+            "version": "2.3.2",
+            "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+            "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+            "dev": true,
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "engines": {
+                "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+            }
+        },
+        "node_modules/watchpack/node_modules/glob-parent": {
+            "version": "5.1.2",
+            "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+            "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+            "dev": true,
+            "optional": true,
+            "dependencies": {
+                "is-glob": "^4.0.1"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/watchpack/node_modules/is-binary-path": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
+            "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
+            "dev": true,
+            "optional": true,
+            "dependencies": {
+                "binary-extensions": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/watchpack/node_modules/is-number": {
+            "version": "7.0.0",
+            "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+            "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+            "dev": true,
+            "optional": true,
+            "engines": {
+                "node": ">=0.12.0"
+            }
+        },
+        "node_modules/watchpack/node_modules/readdirp": {
+            "version": "3.5.0",
+            "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.5.0.tgz",
+            "integrity": "sha512-cMhu7c/8rdhkHXWsY+osBhfSy0JikwpHK/5+imo+LpeasTF8ouErHrlYkwT0++njiyuDvc7OFY5T3ukvZ8qmFQ==",
+            "dev": true,
+            "optional": true,
+            "dependencies": {
+                "picomatch": "^2.2.1"
+            },
+            "engines": {
+                "node": ">=8.10.0"
+            }
+        },
+        "node_modules/watchpack/node_modules/to-regex-range": {
+            "version": "5.0.1",
+            "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+            "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+            "dev": true,
+            "optional": true,
+            "dependencies": {
+                "is-number": "^7.0.0"
+            },
+            "engines": {
+                "node": ">=8.0"
+            }
+        },
+        "node_modules/wbuf": {
+            "version": "1.7.3",
+            "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.3.tgz",
+            "integrity": "sha512-O84QOnr0icsbFGLS0O3bI5FswxzRr8/gHwWkDlQFskhSPryQXvrTMxjxGP4+iWYoauLoBvfDpkrOauZ+0iZpDA==",
+            "dev": true,
+            "dependencies": {
+                "minimalistic-assert": "^1.0.0"
+            }
+        },
+        "node_modules/web-request": {
+            "version": "1.0.7",
+            "resolved": "https://registry.npmjs.org/web-request/-/web-request-1.0.7.tgz",
+            "integrity": "sha1-twxCs81FV3noLbaIYlOySR8r1Wk=",
+            "dependencies": {
+                "request": "^2.69.0"
+            }
+        },
+        "node_modules/webidl-conversions": {
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-4.0.2.tgz",
+            "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg==",
+            "dev": true
+        },
+        "node_modules/webpack": {
+            "version": "4.46.0",
+            "resolved": "https://registry.npmjs.org/webpack/-/webpack-4.46.0.tgz",
+            "integrity": "sha512-6jJuJjg8znb/xRItk7bkT0+Q7AHCYjjFnvKIWQPkNIOyRqoCGvkOs0ipeQzrqz4l5FtN5ZI/ukEHroeX/o1/5Q==",
+            "dev": true,
+            "dependencies": {
+                "@webassemblyjs/ast": "1.9.0",
+                "@webassemblyjs/helper-module-context": "1.9.0",
+                "@webassemblyjs/wasm-edit": "1.9.0",
+                "@webassemblyjs/wasm-parser": "1.9.0",
+                "acorn": "^6.4.1",
+                "ajv": "^6.10.2",
+                "ajv-keywords": "^3.4.1",
+                "chrome-trace-event": "^1.0.2",
+                "enhanced-resolve": "^4.5.0",
+                "eslint-scope": "^4.0.3",
+                "json-parse-better-errors": "^1.0.2",
+                "loader-runner": "^2.4.0",
+                "loader-utils": "^1.2.3",
+                "memory-fs": "^0.4.1",
+                "micromatch": "^3.1.10",
+                "mkdirp": "^0.5.3",
+                "neo-async": "^2.6.1",
+                "node-libs-browser": "^2.2.1",
+                "schema-utils": "^1.0.0",
+                "tapable": "^1.1.3",
+                "terser-webpack-plugin": "^1.4.3",
+                "watchpack": "^1.7.4",
+                "webpack-sources": "^1.4.1"
+            },
+            "bin": {
+                "webpack": "bin/webpack.js"
+            },
+            "engines": {
+                "node": ">=6.11.5"
+            }
+        },
+        "node_modules/webpack-cli": {
+            "version": "3.3.12",
+            "resolved": "https://registry.npmjs.org/webpack-cli/-/webpack-cli-3.3.12.tgz",
+            "integrity": "sha512-NVWBaz9k839ZH/sinurM+HcDvJOTXwSjYp1ku+5XKeOC03z8v5QitnK/x+lAxGXFyhdayoIf/GOpv85z3/xPag==",
+            "dev": true,
+            "dependencies": {
+                "chalk": "^2.4.2",
+                "cross-spawn": "^6.0.5",
+                "enhanced-resolve": "^4.1.1",
+                "findup-sync": "^3.0.0",
+                "global-modules": "^2.0.0",
+                "import-local": "^2.0.0",
+                "interpret": "^1.4.0",
+                "loader-utils": "^1.4.0",
+                "supports-color": "^6.1.0",
+                "v8-compile-cache": "^2.1.1",
+                "yargs": "^13.3.2"
+            },
+            "bin": {
+                "webpack-cli": "bin/cli.js"
+            },
+            "engines": {
+                "node": ">=6.11.5"
+            }
+        },
+        "node_modules/webpack-cli/node_modules/cross-spawn": {
+            "version": "6.0.5",
+            "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
+            "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
+            "dev": true,
+            "dependencies": {
+                "nice-try": "^1.0.4",
+                "path-key": "^2.0.1",
+                "semver": "^5.5.0",
+                "shebang-command": "^1.2.0",
+                "which": "^1.2.9"
+            },
+            "engines": {
+                "node": ">=4.8"
+            }
+        },
+        "node_modules/webpack-cli/node_modules/interpret": {
+            "version": "1.4.0",
+            "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.4.0.tgz",
+            "integrity": "sha512-agE4QfB2Lkp9uICn7BAqoscw4SZP9kTE2hxiFI3jBPmXJfdqiahTbUuKGsMoN2GtqL9AxhYioAcVvgsb1HvRbA==",
+            "dev": true,
+            "engines": {
+                "node": ">= 0.10"
+            }
+        },
+        "node_modules/webpack-cli/node_modules/supports-color": {
+            "version": "6.1.0",
+            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz",
+            "integrity": "sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==",
+            "dev": true,
+            "dependencies": {
+                "has-flag": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/webpack-dev-middleware": {
+            "version": "3.7.3",
+            "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-3.7.3.tgz",
+            "integrity": "sha512-djelc/zGiz9nZj/U7PTBi2ViorGJXEWo/3ltkPbDyxCXhhEXkW0ce99falaok4TPj+AsxLiXJR0EBOb0zh9fKQ==",
+            "dev": true,
+            "dependencies": {
+                "memory-fs": "^0.4.1",
+                "mime": "^2.4.4",
+                "mkdirp": "^0.5.1",
+                "range-parser": "^1.2.1",
+                "webpack-log": "^2.0.0"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/webpack-dev-middleware/node_modules/memory-fs": {
+            "version": "0.4.1",
+            "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
+            "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
+            "dev": true,
+            "dependencies": {
+                "errno": "^0.1.3",
+                "readable-stream": "^2.0.1"
+            }
+        },
+        "node_modules/webpack-dev-middleware/node_modules/mime": {
+            "version": "2.5.2",
+            "resolved": "https://registry.npmjs.org/mime/-/mime-2.5.2.tgz",
+            "integrity": "sha512-tqkh47FzKeCPD2PUiPB6pkbMzsCasjxAfC62/Wap5qrUWcb+sFasXUC5I3gYM5iBM8v/Qpn4UK0x+j0iHyFPDg==",
+            "dev": true,
+            "bin": {
+                "mime": "cli.js"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/webpack-dev-middleware/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dev": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/webpack-dev-middleware/node_modules/webpack-log": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/webpack-log/-/webpack-log-2.0.0.tgz",
+            "integrity": "sha512-cX8G2vR/85UYG59FgkoMamwHUIkSSlV3bBMRsbxVXVUk2j6NleCKjQ/WE9eYg9WY4w25O9w8wKP4rzNZFmUcUg==",
+            "dev": true,
+            "dependencies": {
+                "ansi-colors": "^3.0.0",
+                "uuid": "^3.3.2"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/webpack-dev-server": {
+            "version": "3.11.0",
+            "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.11.0.tgz",
+            "integrity": "sha512-PUxZ+oSTxogFQgkTtFndEtJIPNmml7ExwufBZ9L2/Xyyd5PnOL5UreWe5ZT7IU25DSdykL9p1MLQzmLh2ljSeg==",
+            "dev": true,
+            "dependencies": {
+                "ansi-html": "0.0.7",
+                "bonjour": "^3.5.0",
+                "chokidar": "^2.1.8",
+                "compression": "^1.7.4",
+                "connect-history-api-fallback": "^1.6.0",
+                "debug": "^4.1.1",
+                "del": "^4.1.1",
+                "express": "^4.17.1",
+                "html-entities": "^1.3.1",
+                "http-proxy-middleware": "0.19.1",
+                "import-local": "^2.0.0",
+                "internal-ip": "^4.3.0",
+                "ip": "^1.1.5",
+                "is-absolute-url": "^3.0.3",
+                "killable": "^1.0.1",
+                "loglevel": "^1.6.8",
+                "opn": "^5.5.0",
+                "p-retry": "^3.0.1",
+                "portfinder": "^1.0.26",
+                "schema-utils": "^1.0.0",
+                "selfsigned": "^1.10.7",
+                "semver": "^6.3.0",
+                "serve-index": "^1.9.1",
+                "sockjs": "0.3.20",
+                "sockjs-client": "1.4.0",
+                "spdy": "^4.0.2",
+                "strip-ansi": "^3.0.1",
+                "supports-color": "^6.1.0",
+                "url": "^0.11.0",
+                "webpack-dev-middleware": "^3.7.2",
+                "webpack-log": "^2.0.0",
+                "ws": "^6.2.1",
+                "yargs": "^13.3.2"
+            },
+            "bin": {
+                "webpack-dev-server": "bin/webpack-dev-server.js"
+            },
+            "engines": {
+                "node": ">= 6.11.5"
+            }
+        },
+        "node_modules/webpack-dev-server/node_modules/ansi-regex": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+            "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/webpack-dev-server/node_modules/debug": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+            "dev": true,
+            "dependencies": {
+                "ms": "^2.1.1"
+            }
+        },
+        "node_modules/webpack-dev-server/node_modules/semver": {
+            "version": "6.3.0",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
+            "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+            "dev": true,
+            "bin": {
+                "semver": "bin/semver.js"
+            }
+        },
+        "node_modules/webpack-dev-server/node_modules/strip-ansi": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+            "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
+            "dev": true,
+            "dependencies": {
+                "ansi-regex": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/webpack-dev-server/node_modules/supports-color": {
+            "version": "6.1.0",
+            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz",
+            "integrity": "sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==",
+            "dev": true,
+            "dependencies": {
+                "has-flag": "^3.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/webpack-dev-server/node_modules/webpack-log": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/webpack-log/-/webpack-log-2.0.0.tgz",
+            "integrity": "sha512-cX8G2vR/85UYG59FgkoMamwHUIkSSlV3bBMRsbxVXVUk2j6NleCKjQ/WE9eYg9WY4w25O9w8wKP4rzNZFmUcUg==",
+            "dev": true,
+            "dependencies": {
+                "ansi-colors": "^3.0.0",
+                "uuid": "^3.3.2"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/webpack-dev-server/node_modules/ws": {
+            "version": "6.2.1",
+            "resolved": "https://registry.npmjs.org/ws/-/ws-6.2.1.tgz",
+            "integrity": "sha512-GIyAXC2cB7LjvpgMt9EKS2ldqr0MTrORaleiOno6TweZ6r3TKtoFQWay/2PceJ3RuBasOHzXNn5Lrw1X0bEjqA==",
+            "dev": true,
+            "dependencies": {
+                "async-limiter": "~1.0.0"
+            }
+        },
+        "node_modules/webpack-hot-middleware": {
+            "version": "2.25.0",
+            "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.25.0.tgz",
+            "integrity": "sha512-xs5dPOrGPCzuRXNi8F6rwhawWvQQkeli5Ro48PRuQh8pYPCPmNnltP9itiUPT4xI8oW+y0m59lyyeQk54s5VgA==",
+            "dev": true,
+            "dependencies": {
+                "ansi-html": "0.0.7",
+                "html-entities": "^1.2.0",
+                "querystring": "^0.2.0",
+                "strip-ansi": "^3.0.0"
+            }
+        },
+        "node_modules/webpack-hot-middleware/node_modules/ansi-regex": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+            "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/webpack-hot-middleware/node_modules/strip-ansi": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+            "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
+            "dev": true,
+            "dependencies": {
+                "ansi-regex": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/webpack-log": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/webpack-log/-/webpack-log-1.2.0.tgz",
+            "integrity": "sha512-U9AnICnu50HXtiqiDxuli5gLB5PGBo7VvcHx36jRZHwK4vzOYLbImqT4lwWwoMHdQWwEKw736fCHEekokTEKHA==",
+            "dev": true,
+            "dependencies": {
+                "chalk": "^2.1.0",
+                "log-symbols": "^2.1.0",
+                "loglevelnext": "^1.0.1",
+                "uuid": "^3.1.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/webpack-sources": {
+            "version": "1.4.3",
+            "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.4.3.tgz",
+            "integrity": "sha512-lgTS3Xhv1lCOKo7SA5TjKXMjpSM4sBjNV5+q2bqesbSPs5FjGmU6jjtBSkX9b4qW87vDIsCIlUPOEhbZrMdjeQ==",
+            "dev": true,
+            "dependencies": {
+                "source-list-map": "^2.0.0",
+                "source-map": "~0.6.1"
+            }
+        },
+        "node_modules/webpack-sources/node_modules/source-map": {
+            "version": "0.6.1",
+            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/webpack/node_modules/acorn": {
+            "version": "6.4.2",
+            "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.2.tgz",
+            "integrity": "sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ==",
+            "dev": true,
+            "bin": {
+                "acorn": "bin/acorn"
+            },
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/webpack/node_modules/enhanced-resolve": {
+            "version": "4.5.0",
+            "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-4.5.0.tgz",
+            "integrity": "sha512-Nv9m36S/vxpsI+Hc4/ZGRs0n9mXqSWGGq49zxb/cJfPAQMbUtttJAlNPS4AQzaBdw/pKskw5bMbekT/Y7W/Wlg==",
+            "dev": true,
+            "dependencies": {
+                "graceful-fs": "^4.1.2",
+                "memory-fs": "^0.5.0",
+                "tapable": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=6.9.0"
+            }
+        },
+        "node_modules/webpack/node_modules/enhanced-resolve/node_modules/memory-fs": {
+            "version": "0.5.0",
+            "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.5.0.tgz",
+            "integrity": "sha512-jA0rdU5KoQMC0e6ppoNRtpp6vjFq6+NY7r8hywnC7V+1Xj/MtHwGIbB1QaK/dunyjWteJzmkpd7ooeWg10T7GA==",
+            "dev": true,
+            "dependencies": {
+                "errno": "^0.1.3",
+                "readable-stream": "^2.0.1"
+            },
+            "engines": {
+                "node": ">=4.3.0 <5.0.0 || >=5.10"
+            }
+        },
+        "node_modules/webpack/node_modules/memory-fs": {
+            "version": "0.4.1",
+            "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
+            "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
+            "dev": true,
+            "dependencies": {
+                "errno": "^0.1.3",
+                "readable-stream": "^2.0.1"
+            }
+        },
+        "node_modules/webpack/node_modules/readable-stream": {
+            "version": "2.3.7",
+            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+            "dev": true,
+            "dependencies": {
+                "core-util-is": "~1.0.0",
+                "inherits": "~2.0.3",
+                "isarray": "~1.0.0",
+                "process-nextick-args": "~2.0.0",
+                "safe-buffer": "~5.1.1",
+                "string_decoder": "~1.1.1",
+                "util-deprecate": "~1.0.1"
+            }
+        },
+        "node_modules/webrtc-adapter": {
+            "version": "7.6.3",
+            "resolved": "https://registry.npmjs.org/webrtc-adapter/-/webrtc-adapter-7.6.3.tgz",
+            "integrity": "sha512-DCMiS6cy29PknSuBz779twM6/VsPdoQNAU/I/q4VCEVSlCQ88xiwqGD5/osVO6UMyXCnTBiOl8kd+1cJi6Pkig==",
+            "dependencies": {
+                "rtcpeerconnection-shim": "^1.2.15",
+                "sdp": "^2.12.0"
+            },
+            "engines": {
+                "node": ">=6.0.0",
+                "npm": ">=3.10.0"
+            }
+        },
+        "node_modules/websocket-driver": {
+            "version": "0.6.5",
+            "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.6.5.tgz",
+            "integrity": "sha1-XLJVbOuF9Dc8bYI4qmkchFThOjY=",
+            "dev": true,
+            "dependencies": {
+                "websocket-extensions": ">=0.1.1"
+            },
+            "engines": {
+                "node": ">=0.6.0"
+            }
+        },
+        "node_modules/websocket-extensions": {
+            "version": "0.1.4",
+            "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.4.tgz",
+            "integrity": "sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.8.0"
+            }
+        },
+        "node_modules/whatwg-encoding": {
+            "version": "1.0.5",
+            "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-1.0.5.tgz",
+            "integrity": "sha512-b5lim54JOPN9HtzvK9HFXvBma/rnfFeqsic0hSpjtDbVxR3dJKLc+KB4V6GgiGOvl7CY/KNh8rxSo9DKQrnUEw==",
+            "dev": true,
+            "dependencies": {
+                "iconv-lite": "0.4.24"
+            }
+        },
+        "node_modules/whatwg-fetch": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.0.0.tgz",
+            "integrity": "sha512-9GSJUgz1D4MfyKU7KRqwOjXCXTqWdFNvEr7eUBYchQiVc744mqK/MzXPNR2WsPkmkOa4ywfg8C2n8h+13Bey1Q=="
+        },
+        "node_modules/whatwg-mimetype": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz",
+            "integrity": "sha512-M4yMwr6mAnQz76TbJm914+gPpB/nCwvZbJU28cUD6dR004SAxDLOOSUaB1JDRqLtaOV/vi0IC5lEAGFgrjGv/g==",
+            "dev": true
+        },
+        "node_modules/whatwg-url": {
+            "version": "7.1.0",
+            "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-7.1.0.tgz",
+            "integrity": "sha512-WUu7Rg1DroM7oQvGWfOiAK21n74Gg+T4elXEQYkOhtyLeWiJFoOGLXPKI/9gzIie9CtwVLm8wtw6YJdKyxSjeg==",
+            "dev": true,
+            "dependencies": {
+                "lodash.sortby": "^4.7.0",
+                "tr46": "^1.0.1",
+                "webidl-conversions": "^4.0.2"
+            }
+        },
+        "node_modules/which": {
+            "version": "1.3.1",
+            "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
+            "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
+            "dependencies": {
+                "isexe": "^2.0.0"
+            },
+            "bin": {
+                "which": "bin/which"
+            }
+        },
+        "node_modules/which-module": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz",
+            "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho="
+        },
+        "node_modules/which-pm-runs": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/which-pm-runs/-/which-pm-runs-1.0.0.tgz",
+            "integrity": "sha1-Zws6+8VS4LVd9rd4DKdGFfI60cs="
+        },
+        "node_modules/wide-align": {
+            "version": "1.1.3",
+            "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.3.tgz",
+            "integrity": "sha512-QGkOQc8XL6Bt5PwnsExKBPuMKBxnGxWWW3fU55Xt4feHozMUhdUMaBCk290qpm/wG5u/RSKzwdAC4i51YigihA==",
+            "dependencies": {
+                "string-width": "^1.0.2 || 2"
+            }
+        },
+        "node_modules/widest-line": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-2.0.1.tgz",
+            "integrity": "sha512-Ba5m9/Fa4Xt9eb2ELXt77JxVDV8w7qQrH0zS/TWSJdLyAwQjWoOzpzj5lwVftDz6n/EOu3tNACS84v509qwnJA==",
+            "dependencies": {
+                "string-width": "^2.1.1"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/wikijs": {
+            "version": "6.0.1",
+            "resolved": "https://registry.npmjs.org/wikijs/-/wikijs-6.0.1.tgz",
+            "integrity": "sha512-67ZtXyVPspYM5/B5ci0NIwvPJyG23HPk33QQLgLbCcORQ6N0I3Mhxd/KsPRh3xyly87KDs/bh1xuIG6PVTCKGw==",
+            "dependencies": {
+                "cheerio": "^1.0.0-rc.3",
+                "cross-fetch": "^3.0.2",
+                "infobox-parser": "3.3.1"
+            },
+            "engines": {
+                "node": ">=0.10.4"
+            }
+        },
+        "node_modules/window-size": {
+            "version": "0.1.0",
+            "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+            "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0=",
+            "engines": {
+                "node": ">= 0.8.0"
+            }
+        },
+        "node_modules/with": {
+            "version": "5.1.1",
+            "resolved": "https://registry.npmjs.org/with/-/with-5.1.1.tgz",
+            "integrity": "sha1-+k2qktrzLE6pTtRTyB8EaGtXXf4=",
+            "dependencies": {
+                "acorn": "^3.1.0",
+                "acorn-globals": "^3.0.0"
+            }
+        },
+        "node_modules/word-wrap": {
+            "version": "1.2.3",
+            "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz",
+            "integrity": "sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
+        "node_modules/words-to-numbers": {
+            "version": "1.5.1",
+            "resolved": "https://registry.npmjs.org/words-to-numbers/-/words-to-numbers-1.5.1.tgz",
+            "integrity": "sha512-uvz7zSCKmmA7o5f5zp4Z5l24RQhy6HSNu10URhNxQWv1I82RsFaZX3qD07RLFUMJsCV38oAuaca13AvhO+9yGw==",
+            "dependencies": {
+                "babel-runtime": "6.x.x",
+                "clj-fuzzy": "^0.3.2",
+                "its-set": "^1.1.5"
+            }
+        },
+        "node_modules/wordwrap": {
+            "version": "0.0.2",
+            "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+            "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8=",
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/wordwrapjs": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/wordwrapjs/-/wordwrapjs-3.0.0.tgz",
+            "integrity": "sha512-mO8XtqyPvykVCsrwj5MlOVWvSnCdT+C+QVbm6blradR7JExAhbkZ7hZ9A+9NUtwzSqrlUo9a67ws0EiILrvRpw==",
+            "dependencies": {
+                "reduce-flatten": "^1.0.1",
+                "typical": "^2.6.1"
+            },
+            "engines": {
+                "node": ">=4.0.0"
+            }
+        },
+        "node_modules/worker-farm": {
+            "version": "1.7.0",
+            "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.7.0.tgz",
+            "integrity": "sha512-rvw3QTZc8lAxyVrqcSGVm5yP/IJ2UcB3U0graE3LCFoZ0Yn2x4EoVSqJKdB/T5M+FLcRPjz4TDacRf3OCfNUzw==",
+            "dev": true,
+            "dependencies": {
+                "errno": "~0.1.7"
+            }
+        },
+        "node_modules/worker-rpc": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/worker-rpc/-/worker-rpc-0.1.1.tgz",
+            "integrity": "sha512-P1WjMrUB3qgJNI9jfmpZ/htmBEjFh//6l/5y8SD9hg1Ef5zTTVVoRjTrTEzPrNBQvmhMxkoTsjOXN10GWU7aCg==",
+            "dev": true,
+            "dependencies": {
+                "microevent.ts": "~0.1.1"
+            }
+        },
+        "node_modules/wrap-ansi": {
+            "version": "5.1.0",
+            "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-5.1.0.tgz",
+            "integrity": "sha512-QC1/iN/2/RPVJ5jYK8BGttj5z83LmSKmvbvrXPNCLZSEb32KKVDJDl/MOt2N01qU2H/FkzEa9PKto1BqDjtd7Q==",
+            "dependencies": {
+                "ansi-styles": "^3.2.0",
+                "string-width": "^3.0.0",
+                "strip-ansi": "^5.0.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/wrap-ansi/node_modules/ansi-regex": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
+            "integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/wrap-ansi/node_modules/string-width": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
+            "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
+            "dependencies": {
+                "emoji-regex": "^7.0.1",
+                "is-fullwidth-code-point": "^2.0.0",
+                "strip-ansi": "^5.1.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/wrap-ansi/node_modules/strip-ansi": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
+            "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
+            "dependencies": {
+                "ansi-regex": "^4.1.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/wrappy": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
+            "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
+        },
+        "node_modules/write-file-atomic": {
+            "version": "2.4.3",
+            "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.4.3.tgz",
+            "integrity": "sha512-GaETH5wwsX+GcnzhPgKcKjJ6M2Cq3/iZp1WyY/X1CSqrW+jVNM9Y7D8EC2sM4ZG/V8wZlSniJnCKWPmBYAucRQ==",
+            "dependencies": {
+                "graceful-fs": "^4.1.11",
+                "imurmurhash": "^0.1.4",
+                "signal-exit": "^3.0.2"
+            }
+        },
+        "node_modules/ws": {
+            "version": "7.2.5",
+            "resolved": "https://registry.npmjs.org/ws/-/ws-7.2.5.tgz",
+            "integrity": "sha512-C34cIU4+DB2vMyAbmEKossWq2ZQDr6QEyuuCzWrM9zfw1sGc0mYiJ0UnG9zzNykt49C2Fi34hvr2vssFQRS6EA==",
+            "engines": {
+                "node": ">=8.3.0"
+            }
+        },
+        "node_modules/xdg-basedir": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz",
+            "integrity": "sha1-SWsswQnsqNus/i3HK2A8F8WHCtQ=",
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/xml-name-validator": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-3.0.0.tgz",
+            "integrity": "sha512-A5CUptxDsvxKJEU3yO6DuWBSJz/qizqzJKOMIfUJHETbBw/sFaDxgd6fxm1ewUaM0jZ444Fc5vC5ROYurg/4Pw==",
+            "dev": true
+        },
+        "node_modules/xmlbuilder": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-4.0.0.tgz",
+            "integrity": "sha1-mLj2UcowqmJANvEn0RzGbce5B6M=",
+            "dependencies": {
+                "lodash": "^3.5.0"
+            },
+            "engines": {
+                "node": ">=0.8.0"
+            }
+        },
+        "node_modules/xmlbuilder/node_modules/lodash": {
+            "version": "3.10.1",
+            "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+            "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
+        },
+        "node_modules/xmlchars": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz",
+            "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
+            "dev": true
+        },
+        "node_modules/xmldom": {
+            "version": "0.1.31",
+            "resolved": "https://registry.npmjs.org/xmldom/-/xmldom-0.1.31.tgz",
+            "integrity": "sha512-yS2uJflVQs6n+CyjHoaBmVSqIDevTAWrzMmjG1Gc7h1qQ7uVozNhEPJAwZXWyGQ/Gafo3fCwrcaokezLPupVyQ==",
+            "engines": {
+                "node": ">=0.1"
+            }
+        },
+        "node_modules/xmlhttprequest-ssl": {
+            "version": "1.5.5",
+            "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.5.tgz",
+            "integrity": "sha1-wodrBhaKrcQOV9l+gRkayPQ5iz4=",
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
+        "node_modules/xoauth2": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/xoauth2/-/xoauth2-1.2.0.tgz",
+            "integrity": "sha1-8u76wRRyyXHqO8RuVU60sSMhRuU="
+        },
+        "node_modules/xregexp": {
+            "version": "4.3.0",
+            "resolved": "https://registry.npmjs.org/xregexp/-/xregexp-4.3.0.tgz",
+            "integrity": "sha512-7jXDIFXh5yJ/orPn4SXjuVrWWoi4Cr8jfV1eHv9CixKSbU+jY4mxfrBwAuDvupPNKpMUY+FeIqsVw/JLT9+B8g==",
+            "dependencies": {
+                "@babel/runtime-corejs3": "^7.8.3"
+            }
+        },
+        "node_modules/xtend": {
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
+            "integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==",
+            "dev": true,
+            "engines": {
+                "node": ">=0.4"
+            }
+        },
+        "node_modules/y18n": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.0.tgz",
+            "integrity": "sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w=="
+        },
+        "node_modules/yallist": {
+            "version": "3.1.1",
+            "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
+            "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g=="
+        },
+        "node_modules/yaml": {
+            "version": "1.10.0",
+            "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.0.tgz",
+            "integrity": "sha512-yr2icI4glYaNG+KWONODapy2/jDdMSDnrONSjblABjD9B4Z5LgiircSt8m8sRZFNi08kG9Sm0uSHtEmP3zaEGg==",
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/yargs": {
+            "version": "13.3.2",
+            "resolved": "https://registry.npmjs.org/yargs/-/yargs-13.3.2.tgz",
+            "integrity": "sha512-AX3Zw5iPruN5ie6xGRIDgqkT+ZhnRlZMLMHAs8tg7nRruy2Nb+i5o9bwghAogtM08q1dpr2LVoS8KSTMYpWXUw==",
+            "dependencies": {
+                "cliui": "^5.0.0",
+                "find-up": "^3.0.0",
+                "get-caller-file": "^2.0.1",
+                "require-directory": "^2.1.1",
+                "require-main-filename": "^2.0.0",
+                "set-blocking": "^2.0.0",
+                "string-width": "^3.0.0",
+                "which-module": "^2.0.0",
+                "y18n": "^4.0.0",
+                "yargs-parser": "^13.1.2"
+            }
+        },
+        "node_modules/yargs-parser": {
+            "version": "13.1.2",
+            "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-13.1.2.tgz",
+            "integrity": "sha512-3lbsNRf/j+A4QuSZfDRA7HRSfWrzO0YjqTJd5kjAq37Zep1CEgaYmrH9Q3GwPiB9cHyd1Y1UwggGhJGoxipbzg==",
+            "dependencies": {
+                "camelcase": "^5.0.0",
+                "decamelize": "^1.2.0"
+            }
+        },
+        "node_modules/yargs-unparser": {
+            "version": "1.6.0",
+            "resolved": "https://registry.npmjs.org/yargs-unparser/-/yargs-unparser-1.6.0.tgz",
+            "integrity": "sha512-W9tKgmSn0DpSatfri0nx52Joq5hVXgeLiqR/5G0sZNDoLZFOr/xjBUDcShCOGNsBnEMNo1KAMBkTej1Hm62HTw==",
+            "dependencies": {
+                "flat": "^4.1.0",
+                "lodash": "^4.17.15",
+                "yargs": "^13.3.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/yargs/node_modules/ansi-regex": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
+            "integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==",
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/yargs/node_modules/string-width": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
+            "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
+            "dependencies": {
+                "emoji-regex": "^7.0.1",
+                "is-fullwidth-code-point": "^2.0.0",
+                "strip-ansi": "^5.1.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/yargs/node_modules/strip-ansi": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
+            "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
+            "dependencies": {
+                "ansi-regex": "^4.1.0"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/yauzl": {
+            "version": "2.10.0",
+            "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-2.10.0.tgz",
+            "integrity": "sha1-x+sXyT4RLLEIb6bY5R+wZnt5pfk=",
+            "dependencies": {
+                "buffer-crc32": "~0.2.3",
+                "fd-slicer": "~1.1.0"
+            }
+        },
+        "node_modules/yeast": {
+            "version": "0.1.2",
+            "resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz",
+            "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
+        },
+        "node_modules/yn": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/yn/-/yn-2.0.0.tgz",
+            "integrity": "sha1-5a2ryKz0CPY4X8dklWhMiOavaJo=",
+            "dev": true,
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/zip-stream": {
+            "version": "2.1.3",
+            "resolved": "https://registry.npmjs.org/zip-stream/-/zip-stream-2.1.3.tgz",
+            "integrity": "sha512-EkXc2JGcKhO5N5aZ7TmuNo45budRaFGHOmz24wtJR7znbNqDPmdZtUauKX6et8KAVseAMBOyWJqEpXcHTBsh7Q==",
+            "dependencies": {
+                "archiver-utils": "^2.1.0",
+                "compress-commons": "^2.1.1",
+                "readable-stream": "^3.4.0"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
+        "node_modules/zustand": {
+            "version": "3.4.1",
+            "resolved": "https://registry.npmjs.org/zustand/-/zustand-3.4.1.tgz",
+            "integrity": "sha512-Kb91vSjy5vwBQ/PQ1a5GE6naS3gCxCgpkujT9zqZSO85+gnvmzgqraMW3ao1I0jR4PwHBXtLTf26r9j7EXoUiQ=="
+        }
+    },
     "dependencies": {
         "@babel/code-frame": {
             "version": "7.8.3",
@@ -3688,22 +26608,22 @@
                             "bundled": true,
                             "optional": true
                         },
-                        "string-width": {
-                            "version": "1.0.2",
+                        "string_decoder": {
+                            "version": "1.1.1",
                             "bundled": true,
                             "optional": true,
                             "requires": {
-                                "code-point-at": "^1.0.0",
-                                "is-fullwidth-code-point": "^1.0.0",
-                                "strip-ansi": "^3.0.0"
+                                "safe-buffer": "~5.1.0"
                             }
                         },
-                        "string_decoder": {
-                            "version": "1.1.1",
+                        "string-width": {
+                            "version": "1.0.2",
                             "bundled": true,
                             "optional": true,
                             "requires": {
-                                "safe-buffer": "~5.1.0"
+                                "code-point-at": "^1.0.0",
+                                "is-fullwidth-code-point": "^1.0.0",
+                                "strip-ansi": "^3.0.0"
                             }
                         },
                         "strip-ansi": {
@@ -5800,8 +28720,8 @@
             "integrity": "sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w=="
         },
         "equation-editor-react": {
-            "version": "github:bobzel/equation-editor-react#75915e852b4b36a6a4cd3e1cbc80598da6b65227",
-            "from": "github:bobzel/equation-editor-react#useLocally",
+            "version": "git+ssh://git@github.com/bobzel/equation-editor-react.git#75915e852b4b36a6a4cd3e1cbc80598da6b65227",
+            "from": "equation-editor-react@github:bobzel/equation-editor-react#useLocally",
             "requires": {
                 "jquery": "^3.4.1",
                 "mathquill": "^0.10.1-a"
@@ -7700,8 +30620,8 @@
             },
             "dependencies": {
                 "image-size": {
-                    "version": "github:netroy/image-size#da2c863807a3e9602617bdd357b0de3ab4a064c1",
-                    "from": "github:netroy/image-size#da2c863807a3e9602617bdd357b0de3ab4a064c1"
+                    "version": "git+ssh://git@github.com/netroy/image-size.git#da2c863807a3e9602617bdd357b0de3ab4a064c1",
+                    "from": "image-size@github:netroy/image-size#da2c863807a3e9602617bdd357b0de3ab4a064c1"
                 },
                 "isarray": {
                     "version": "0.0.1",
@@ -10125,7 +33045,6 @@
             "resolved": "https://registry.npmjs.org/npm/-/npm-6.14.5.tgz",
             "integrity": "sha512-CDwa3FJd0XJpKDbWCST484H+mCNjF26dPrU+xnREW+upR0UODjMEfXPl3bxWuAwZIX6c2ASg1plLO7jP8ehWeA==",
             "requires": {
-                "JSONStream": "^1.3.5",
                 "abbrev": "~1.1.1",
                 "ansicolors": "~0.3.2",
                 "ansistyles": "~0.1.3",
@@ -10166,6 +33085,7 @@
                 "init-package-json": "^1.10.3",
                 "is-cidr": "^3.0.0",
                 "json-parse-better-errors": "^1.0.2",
+                "JSONStream": "^1.3.5",
                 "lazy-property": "~1.0.0",
                 "libcipm": "^4.0.7",
                 "libnpm": "^3.0.1",
@@ -10250,14 +33170,6 @@
                 "write-file-atomic": "^2.4.3"
             },
             "dependencies": {
-                "JSONStream": {
-                    "version": "1.3.5",
-                    "bundled": true,
-                    "requires": {
-                        "jsonparse": "^1.2.0",
-                        "through": ">=2.2.7 <3"
-                    }
-                },
                 "abbrev": {
                     "version": "1.1.1",
                     "bundled": true
@@ -11504,6 +34416,14 @@
                     "version": "1.3.1",
                     "bundled": true
                 },
+                "JSONStream": {
+                    "version": "1.3.5",
+                    "bundled": true,
+                    "requires": {
+                        "jsonparse": "^1.2.0",
+                        "through": ">=2.2.7 <3"
+                    }
+                },
                 "jsprim": {
                     "version": "1.4.1",
                     "bundled": true,
@@ -12080,9 +35000,9 @@
                     "version": "4.0.4",
                     "bundled": true,
                     "requires": {
-                        "JSONStream": "^1.3.4",
                         "bluebird": "^3.5.1",
                         "figgy-pudding": "^3.4.1",
+                        "JSONStream": "^1.3.4",
                         "lru-cache": "^5.1.1",
                         "make-fetch-happen": "^5.0.0",
                         "npm-package-arg": "^6.1.0",
@@ -12828,6 +35748,19 @@
                     "version": "2.0.0",
                     "bundled": true
                 },
+                "string_decoder": {
+                    "version": "1.3.0",
+                    "bundled": true,
+                    "requires": {
+                        "safe-buffer": "~5.2.0"
+                    },
+                    "dependencies": {
+                        "safe-buffer": {
+                            "version": "5.2.0",
+                            "bundled": true
+                        }
+                    }
+                },
                 "string-width": {
                     "version": "2.1.1",
                     "bundled": true,
@@ -12853,19 +35786,6 @@
                         }
                     }
                 },
-                "string_decoder": {
-                    "version": "1.3.0",
-                    "bundled": true,
-                    "requires": {
-                        "safe-buffer": "~5.2.0"
-                    },
-                    "dependencies": {
-                        "safe-buffer": {
-                            "version": "5.2.0",
-                            "bundled": true
-                        }
-                    }
-                },
                 "stringify-package": {
                     "version": "1.0.1",
                     "bundled": true
@@ -15379,21 +38299,6 @@
                 "tough-cookie": "^2.3.3"
             }
         },
-        "require-directory": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
-            "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I="
-        },
-        "require-main-filename": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
-            "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg=="
-        },
-        "require-package-name": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/require-package-name/-/require-package-name-2.0.1.tgz",
-            "integrity": "sha1-wR6XJ2tluOKSP3Xav1+y7ww4Qbk="
-        },
         "require_optional": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/require_optional/-/require_optional-1.0.1.tgz",
@@ -15410,6 +38315,21 @@
                 }
             }
         },
+        "require-directory": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+            "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I="
+        },
+        "require-main-filename": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
+            "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg=="
+        },
+        "require-package-name": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/require-package-name/-/require-package-name-2.0.1.tgz",
+            "integrity": "sha1-wR6XJ2tluOKSP3Xav1+y7ww4Qbk="
+        },
         "requires-port": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
@@ -16692,6 +39612,14 @@
             "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-2.0.0.tgz",
             "integrity": "sha1-ucczDHBChi9rFC3CdLvMWGbONUY="
         },
+        "string_decoder": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
+            "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
+            "requires": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
         "string-width": {
             "version": "2.1.1",
             "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
@@ -16744,14 +39672,6 @@
                 "es-abstract": "^1.17.5"
             }
         },
-        "string_decoder": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-            "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
-            "requires": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
         "stringify-parameters": {
             "version": "0.0.4",
             "resolved": "https://registry.npmjs.org/stringify-parameters/-/stringify-parameters-0.0.4.tgz",
diff --git a/src/client/ClientRecommender.scss b/src/client/ClientRecommender.scss
index 3f9102f15..178c7fdab 100644
--- a/src/client/ClientRecommender.scss
+++ b/src/client/ClientRecommender.scss
@@ -1,4 +1,4 @@
-// @import "/views/globalCssVariables.scss";
+// @import "/views/global/globalCssVariables.scss";
 
 .space{
     border: 1px dashed blue;
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 24682cbd0..0c4d266d4 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -30,7 +30,7 @@ import { CollectionDockingView } from "../views/collections/CollectionDockingVie
 import { CollectionView, CollectionViewType } from "../views/collections/CollectionView";
 import { ContextMenu } from "../views/ContextMenu";
 import { ContextMenuProps } from "../views/ContextMenuItem";
-import { DFLT_IMAGE_NATIVE_DIM } from "../views/globalCssVariables.scss";
+import { DFLT_IMAGE_NATIVE_DIM } from "../views/global/globalCssVariables.scss";
 import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth, InkingStroke } from "../views/InkingStroke";
 import { AudioBox } from "../views/nodes/AudioBox";
 import { ColorBox } from "../views/nodes/ColorBox";
diff --git a/src/client/util/CaptureManager.scss b/src/client/util/CaptureManager.scss
index 71539ee1e..a5024247e 100644
--- a/src/client/util/CaptureManager.scss
+++ b/src/client/util/CaptureManager.scss
@@ -1,4 +1,4 @@
-@import "../views/globalCssVariables";
+@import "../views/global/globalCssVariables";
 
 .capture-interface {
     //background-color: whitesmoke !important;
diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index d8c2f913e..e0e6024d2 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -9,7 +9,7 @@ import { ScriptField } from "../../fields/ScriptField";
 import { Cast, NumCast, ScriptCast, StrCast } from "../../fields/Types";
 import { emptyFunction, returnTrue } from "../../Utils";
 import { Docs, DocUtils } from "../documents/Documents";
-import * as globalCssVariables from "../views/globalCssVariables.scss";
+import * as globalCssVariables from "../views/global/globalCssVariables.scss";
 import { UndoManager } from "./UndoManager";
 import { SnappingManager } from "./SnappingManager";
 import { DocumentView } from "../views/nodes/DocumentView";
diff --git a/src/client/util/SettingsManager.scss b/src/client/util/SettingsManager.scss
index d8342ea56..c9db94419 100644
--- a/src/client/util/SettingsManager.scss
+++ b/src/client/util/SettingsManager.scss
@@ -1,4 +1,4 @@
-@import "../views/globalCssVariables";
+@import "../views/global/globalCssVariables";
 
 .settings-interface {
     //background-color: whitesmoke !important;
@@ -264,7 +264,7 @@
         //margin-top: 4px;
 
         &:hover {
-            background: $main-accent;
+            background: $medium-gray;
         }
     }
 
diff --git a/src/client/views/AntimodeMenu.scss b/src/client/views/AntimodeMenu.scss
index a275901be..8670b1747 100644
--- a/src/client/views/AntimodeMenu.scss
+++ b/src/client/views/AntimodeMenu.scss
@@ -1,4 +1,4 @@
-@import "./globalCssVariables";
+@import "./global/globalCssVariables";
 
 
 .antimodeMenu-cont {
diff --git a/src/client/views/ContextMenu.scss b/src/client/views/ContextMenu.scss
index b514de5f2..2590e34c6 100644
--- a/src/client/views/ContextMenu.scss
+++ b/src/client/views/ContextMenu.scss
@@ -1,10 +1,10 @@
-@import "globalCssVariables";
+@import "global/globalCssVariables";
 
 .contextMenu-cont {
     position: absolute;
     display: flex;
     z-index: $contextMenu-zindex;
-    box-shadow: $intermediate-color 0.2vw 0.2vw 0.4vw;
+    box-shadow: $medium-gray 0.2vw 0.2vw 0.4vw;
     flex-direction: column;
     background: whitesmoke;
     padding-top: 10px;
@@ -14,17 +14,17 @@
 }
 
 // .contextMenu-item:first-child {
-//     background: $intermediate-color;
-//     color: $light-color;
+//     background: $medium-gray;
+//     color: $white;
 // }
 
 // .contextMenu-item:first-child::placeholder {
-//     color: $light-color;
+//     color: $white;
 // }
 
 // .contextMenu-item:first-child:hover {
-//     background: $intermediate-color;
-//     color: $light-color;
+//     background: $medium-gray;
+//     color: $white;
 // }
 
 .contextMenu-subMenu-cont {
@@ -94,7 +94,7 @@
 .contextMenu-item:hover {
     border-width: .11px;
     border-style: none;
-    border-color: $intermediate-color; //  rgb(187, 186, 186);
+    border-color: $medium-gray; //  rgb(187, 186, 186);
     border-bottom-style: solid;
     border-top-style: solid;
 
@@ -122,7 +122,7 @@
     transition: all .1s;
     border-width: .11px;
     border-style: none;
-    border-color: $intermediate-color; //  rgb(187, 186, 186);
+    border-color: $medium-gray; //  rgb(187, 186, 186);
     // padding: 10px 0px 10px 0px;
     white-space: nowrap;
     font-size: 13px;
diff --git a/src/client/views/DocumentButtonBar.scss b/src/client/views/DocumentButtonBar.scss
index 09ae14016..e816c52a3 100644
--- a/src/client/views/DocumentButtonBar.scss
+++ b/src/client/views/DocumentButtonBar.scss
@@ -1,4 +1,4 @@
-@import "globalCssVariables";
+@import "global/globalCssVariables";
 
 $linkGap : 3px;
 
@@ -7,13 +7,13 @@ $linkGap : 3px;
 }
 
 .documentButtonBar-linkButton-empty:hover {
-    background: $main-accent;
+    background: $medium-gray;
     transform: scale(1.05);
     cursor: pointer;
 }
 
 .documentButtonBar-linkButton-nonempty:hover {
-    background: $main-accent;
+    background: $medium-gray;
     transform: scale(1.05);
     cursor: pointer;
 }
@@ -26,7 +26,7 @@ $linkGap : 3px;
     opacity: 0.9;
     pointer-events: auto;
     background-color: $dark-color;
-    color: $light-color;
+    color: $white;
     text-transform: uppercase;
     letter-spacing: 2px;
     font-size: 75%;
@@ -37,7 +37,7 @@ $linkGap : 3px;
     align-items: center;
 
     &:hover {
-        background: $main-accent;
+        background: $medium-gray;
         transform: scale(1.05);
         cursor: pointer;
     }
@@ -69,7 +69,7 @@ $linkGap : 3px;
     transition: 0.2s ease all;
 
     &:hover {
-        background-color: $main-accent;
+        background-color: $medium-gray;
     }
 }
 
diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss
index db2d56aa8..47a8326bb 100644
--- a/src/client/views/DocumentDecorations.scss
+++ b/src/client/views/DocumentDecorations.scss
@@ -1,4 +1,4 @@
-@import "globalCssVariables";
+@import "global/globalCssVariables";
 
 $linkGap : 3px;
 
@@ -49,7 +49,7 @@ $linkGap : 3px;
     .documentDecorations-bottomResizer,
     .documentDecorations-rightResizer {
         pointer-events: auto;
-        background: $alt-accent;
+        background: $medium-gray;
         opacity: 0.1;
         &:hover {
             opacity: 1;
@@ -251,13 +251,13 @@ $linkGap : 3px;
 }
 
 .linkButton-empty:hover {
-    background: $main-accent;
+    background: $medium-gray;
     transform: scale(1.05);
     cursor: pointer;
 }
 
 .linkButton-nonempty:hover {
-    background: $main-accent;
+    background: $medium-gray;
     transform: scale(1.05);
     cursor: pointer;
 }
@@ -271,7 +271,7 @@ $linkGap : 3px;
     flex-direction: row;
     z-index: 998;
     position: absolute;
-    background: $alt-accent;
+    background: $medium-gray;
 }
 
 .linkButtonWrapper {
@@ -303,7 +303,7 @@ $linkGap : 3px;
     opacity: 0.9;
     pointer-events: auto;
     background-color: $dark-color;
-    color: $light-color;
+    color: $white;
     text-transform: uppercase;
     letter-spacing: 2px;
     font-size: 75%;
@@ -314,7 +314,7 @@ $linkGap : 3px;
     align-items: center;
 
     &:hover {
-        background: $main-accent;
+        background: $medium-gray;
         transform: scale(1.05);
         cursor: pointer;
     }
@@ -344,12 +344,12 @@ $linkGap : 3px;
     opacity: 0.9;
     font-size: 14;
     background-color: $dark-color;
-    color: $light-color;
+    color: $white;
     text-align: center;
     cursor: pointer;
 
     &:hover {
-        background: $main-accent;
+        background: $medium-gray;
         transform: scale(1.05);
     }
 }
@@ -365,7 +365,7 @@ $linkGap : 3px;
     width: max-content;
     font-family: $sans-serif;
     font-size: 12px;
-    background-color: $light-color-secondary;
+    background-color: $light-gray;
     padding: 2px 12px;
     list-style: none;
 
diff --git a/src/client/views/Main.scss b/src/client/views/Main.scss
index b1ad4868c..c8e64b5c4 100644
--- a/src/client/views/Main.scss
+++ b/src/client/views/Main.scss
@@ -1,4 +1,4 @@
-@import "globalCssVariables";
+@import "global/globalCssVariables";
 @import "nodeModuleOverrides";
 
 :root {
@@ -54,7 +54,7 @@ button {
     background: black;
     outline: none;
     border: 0px;
-    color: $light-color;
+    color: $white;
     text-transform: uppercase;
     letter-spacing: 2px;
     font-size: 75%;
@@ -63,7 +63,7 @@ button {
 }
 
 button:hover {
-    background: $main-accent;
+    background: $medium-gray;
     transform: scale(1.05);
     cursor: pointer;
 }
diff --git a/src/client/views/MainView.scss b/src/client/views/MainView.scss
index 3f04a0f3a..d76458460 100644
--- a/src/client/views/MainView.scss
+++ b/src/client/views/MainView.scss
@@ -1,4 +1,4 @@
-@import "globalCssVariables";
+@import "global/globalCssVariables";
 @import "nodeModuleOverrides";
 
 
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index 4eeb1fc95..f34851b00 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -40,7 +40,7 @@ import { ContextMenu } from './ContextMenu';
 import { DictationOverlay } from './DictationOverlay';
 import { DocumentDecorations } from './DocumentDecorations';
 import { GestureOverlay } from './GestureOverlay';
-import { MENU_PANEL_WIDTH, SEARCH_PANEL_HEIGHT } from './globalCssVariables.scss';
+import { MENU_PANEL_WIDTH, SEARCH_PANEL_HEIGHT } from './global/globalCssVariables.scss';
 import { KeyManager } from './GlobalKeyHandler';
 import { InkStrokeProperties } from './InkStrokeProperties';
 import { LightboxView } from './LightboxView';
@@ -180,8 +180,8 @@ export class MainView extends React.Component {
             const targClass = targets[0].className.toString();
             if (SearchBox.Instance._searchbarOpen || SearchBox.Instance.open) {
                 const check = targets.some((thing) =>
-                    (thing.className === "collectionSchemaView-searchContainer" || (thing as any)?.dataset.icon === "filter" ||
-                        thing.className === "collectionSchema-header-menuOptions"));
+                (thing.className === "collectionSchemaView-searchContainer" || (thing as any)?.dataset.icon === "filter" ||
+                    thing.className === "collectionSchema-header-menuOptions"));
                 !check && SearchBox.Instance.resetSearch(true);
             }
             !targClass.includes("contextMenu") && ContextMenu.Instance.closeMenu();
diff --git a/src/client/views/PropertiesButtons.scss b/src/client/views/PropertiesButtons.scss
index 29d2bfcb7..4ef7763be 100644
--- a/src/client/views/PropertiesButtons.scss
+++ b/src/client/views/PropertiesButtons.scss
@@ -1,4 +1,4 @@
-@import "globalCssVariables";
+@import "global/globalCssVariables";
 
 $linkGap : 3px;
 
@@ -7,13 +7,13 @@ $linkGap : 3px;
 }
 
 .propertiesButtons-linkButton-empty:hover {
-    background: $main-accent;
+    background: $medium-gray;
     transform: scale(1.05);
     cursor: pointer;
 }
 
 .propertiesButtons-linkButton-nonempty:hover {
-    background: $main-accent;
+    background: $medium-gray;
     transform: scale(1.05);
     cursor: pointer;
 }
@@ -24,7 +24,7 @@ $linkGap : 3px;
     width: 29px;
     border-radius: 6px;
     pointer-events: auto;
-    background-color: #121721;
+    background-color: $dark-color;
     color: #fcfbf7;
     text-transform: uppercase;
     letter-spacing: 2px;
@@ -38,18 +38,18 @@ $linkGap : 3px;
     margin-left: 4px;
 
     &:hover {
-        background: $main-accent;
+        background: $medium-gray;
         transform: scale(1.05);
         cursor: pointer;
     }
 }
 .propertiesButtons-linkButton-empty.toggle-on {
     background-color: white;
-    color: black;
+    color: $dark-color;
 }
 .propertiesButtons-linkButton-empty.toggle-hover {
     background-color: gray;
-    color: black;
+    color: $dark-color;
 }
 .propertiesButtons-linkButton-empty.toggle-off {
     color: white;
@@ -111,7 +111,7 @@ $linkGap : 3px;
     margin-left: 4px;
 
     &:hover {
-        background: $main-accent;
+        background: $medium-gray;
         transform: scale(1.05);
         cursor: pointer;
     }
diff --git a/src/client/views/TemplateMenu.scss b/src/client/views/TemplateMenu.scss
index bbed8cd96..f81cbdaab 100644
--- a/src/client/views/TemplateMenu.scss
+++ b/src/client/views/TemplateMenu.scss
@@ -1,4 +1,4 @@
-@import "globalCssVariables";
+@import "global/globalCssVariables";
 .templating-menu {
     position: absolute;
     pointer-events: auto;
@@ -24,7 +24,7 @@
     cursor: pointer;
 
     &:hover {
-        background: $main-accent;
+        background: $medium-gray;
         transform: scale(1.05);
     }
 }
@@ -32,7 +32,7 @@
 .template-list {
     font-family: $sans-serif;
     font-size: 12px;
-    background-color: $light-color-secondary;
+    background-color: $light-gray;
     padding: 2px 12px;
     list-style: none;
     position: relative;
diff --git a/src/client/views/animationtimeline/Keyframe.scss b/src/client/views/animationtimeline/Keyframe.scss
index 84c8de287..38eb103c6 100644
--- a/src/client/views/animationtimeline/Keyframe.scss
+++ b/src/client/views/animationtimeline/Keyframe.scss
@@ -1,4 +1,4 @@
-@import "./../globalCssVariables.scss";
+@import "./../global/globalCssVariables.scss";
 
 
 $timelineColor: #9acedf;
@@ -15,11 +15,11 @@ $timelineDark: #77a1aa;
         height: 200px;
         top: 50%;
         position: relative;
-        background-color: $light-color;
+        background-color: $white;
 
         .menutable {
             tr:nth-child(odd) {
-                background-color: $light-color-secondary;
+                background-color: $light-gray;
             }
         }
     }
@@ -67,7 +67,7 @@ $timelineDark: #77a1aa;
         height: 100%;
         position: absolute;
         pointer-events: none;
-        background: linear-gradient(to left, $timelineColor 10%, $light-color);
+        background: linear-gradient(to left, $timelineColor 10%, $white);
     }
 
     .fadeRight {
@@ -75,7 +75,7 @@ $timelineDark: #77a1aa;
         height: 100%;
         position: absolute;
         pointer-events: none;
-        background: linear-gradient(to right, $timelineColor 10%, $light-color);
+        background: linear-gradient(to right, $timelineColor 10%, $white);
     }
 
     .divider {
diff --git a/src/client/views/animationtimeline/Keyframe.tsx b/src/client/views/animationtimeline/Keyframe.tsx
index e84022366..82b0218bf 100644
--- a/src/client/views/animationtimeline/Keyframe.tsx
+++ b/src/client/views/animationtimeline/Keyframe.tsx
@@ -1,7 +1,7 @@
 import * as React from "react";
 import "./Keyframe.scss";
 import "./Timeline.scss";
-import "../globalCssVariables.scss";
+import "../global/globalCssVariables.scss";
 import { observer } from "mobx-react";
 import { observable, reaction, action, IReactionDisposer, observe, computed, runInAction, trace } from "mobx";
 import { Doc, DocListCast, DocListCastAsync, Opt } from "../../../fields/Doc";
diff --git a/src/client/views/animationtimeline/Timeline.scss b/src/client/views/animationtimeline/Timeline.scss
index f90249771..d82eb85bf 100644
--- a/src/client/views/animationtimeline/Timeline.scss
+++ b/src/client/views/animationtimeline/Timeline.scss
@@ -1,4 +1,4 @@
-@import "./../globalCssVariables.scss";
+@import "./../global/globalCssVariables.scss";
 
 $timelineColor: #9acedf;
 $timelineDark: #77a1aa;
@@ -161,7 +161,7 @@ $timelineDark: #77a1aa;
     width: 100%;
     height: 300px;
     position: absolute;
-    background-color: $light-color-secondary;
+    background-color: $light-gray;
     border-bottom: 2px solid $timelineDark;
     transition: transform 500ms ease;
 
diff --git a/src/client/views/animationtimeline/TimelineMenu.scss b/src/client/views/animationtimeline/TimelineMenu.scss
index 7ee0a43d5..935f04aba 100644
--- a/src/client/views/animationtimeline/TimelineMenu.scss
+++ b/src/client/views/animationtimeline/TimelineMenu.scss
@@ -1,10 +1,10 @@
-@import "./../globalCssVariables.scss"; 
+@import "./../global/globalCssVariables.scss"; 
 
 
 .timeline-menu-container{
     position: absolute;
     display: flex;
-    box-shadow: $intermediate-color 0.2vw 0.2vw 0.4vw;
+    box-shadow: $medium-gray 0.2vw 0.2vw 0.4vw;
     flex-direction: column;
     background: whitesmoke;
     z-index: 10000;
@@ -79,7 +79,7 @@
     .timeline-menu-item:hover {
         border-width: .11px;
         border-style: none;
-        border-color: $intermediate-color;
+        border-color: $medium-gray;
         border-bottom-style: solid;
         border-top-style: solid;
         background: $darker-alt-accent; 
diff --git a/src/client/views/animationtimeline/TimelineOverview.scss b/src/client/views/animationtimeline/TimelineOverview.scss
index 283163ea7..c8d96c399 100644
--- a/src/client/views/animationtimeline/TimelineOverview.scss
+++ b/src/client/views/animationtimeline/TimelineOverview.scss
@@ -1,4 +1,4 @@
-@import "./../globalCssVariables.scss";
+@import "./../global/globalCssVariables.scss";
 
 $timelineColor: #9acedf;
 $timelineDark: #77a1aa;
diff --git a/src/client/views/animationtimeline/Track.scss b/src/client/views/animationtimeline/Track.scss
index aec587a79..6d6d1620f 100644
--- a/src/client/views/animationtimeline/Track.scss
+++ b/src/client/views/animationtimeline/Track.scss
@@ -1,4 +1,4 @@
-@import "./../globalCssVariables.scss";
+@import "./../global/globalCssVariables.scss";
 
 .track-container {
 
@@ -6,7 +6,7 @@
         .inner {
             top: 0px;
             width: calc(100%);
-            background-color: $light-color;
+            background-color: $white;
             border: 1px solid $dark-color;
             position: relative;
             z-index: 100;
diff --git a/src/client/views/collections/CollectionDockingView.scss b/src/client/views/collections/CollectionDockingView.scss
index f4736eb29..6d5dc9b18 100644
--- a/src/client/views/collections/CollectionDockingView.scss
+++ b/src/client/views/collections/CollectionDockingView.scss
@@ -1,4 +1,4 @@
-@import "../../views/globalCssVariables.scss";
+@import "../../views/global/globalCssVariables.scss";
 
 
 .lm_title {
@@ -110,7 +110,7 @@
     }
 
     .flexlayout__splitter {
-        background-color: black;
+        background-color: $dark-color;
     }
 
     .flexlayout__splitter:hover {
@@ -179,7 +179,7 @@
         position: absolute;
         box-sizing: border-box;
         background-color: #222;
-        color: black;
+        color: $dark-color;
     }
 
     .flexlayout__tab_button {
@@ -268,7 +268,7 @@
     }
 
     .flexlayout__tab_header_outer {
-        background-color: black;
+        background-color: $dark-color;
         position: absolute;
         left: 0;
         right: 0;
@@ -332,28 +332,28 @@
     }
 
     .flexlayout__border_top {
-        background-color: black;
+        background-color: $dark-color;
         border-bottom: 1px solid #ddd;
         box-sizing: border-box;
         overflow: hidden;
     }
 
     .flexlayout__border_bottom {
-        background-color: black;
+        background-color: $dark-color;
         border-top: 1px solid #333;
         box-sizing: border-box;
         overflow: hidden;
     }
 
     .flexlayout__border_left {
-        background-color: black;
+        background-color: $dark-color;
         border-right: 1px solid #333;
         box-sizing: border-box;
         overflow: hidden;
     }
 
     .flexlayout__border_right {
-        background-color: black;
+        background-color: $dark-color;
         border-left: 1px solid #333;
         box-sizing: border-box;
         overflow: hidden;
diff --git a/src/client/views/collections/CollectionLinearView.scss b/src/client/views/collections/CollectionLinearView.scss
index ca72b98a5..632ce4417 100644
--- a/src/client/views/collections/CollectionLinearView.scss
+++ b/src/client/views/collections/CollectionLinearView.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 @import "../_nodeModuleOverrides";
 
 .collectionLinearView-outer {
@@ -13,7 +13,7 @@
 
         >span {
             background: $dark-color;
-            color: $light-color;
+            color: $white;
             border-radius: 18px;
             margin-right: 6px;
             cursor: pointer;
@@ -64,7 +64,7 @@
             margin-top: "auto";
             margin-bottom: "auto";
             background: $dark-color;
-            color: $light-color;
+            color: $white;
             display: inline-block;
             border-radius: 18px;
             font-size: 12.5px;
@@ -82,7 +82,7 @@
         }
 
         label:hover {
-            background: $main-accent;
+            background: $medium-gray;
             transform: scale(1.15);
         }
 
diff --git a/src/client/views/collections/CollectionMenu.scss b/src/client/views/collections/CollectionMenu.scss
index dc5231a3a..328d7c081 100644
--- a/src/client/views/collections/CollectionMenu.scss
+++ b/src/client/views/collections/CollectionMenu.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 
 .collectionMenu-cont {
@@ -407,7 +407,7 @@
             }
 
             .switchToText {
-                color: $main-accent;
+                color: $medium-gray;
             }
 
             .switchToText:hover {
@@ -534,7 +534,7 @@
     .collectionSchemaViewChrome-togglerButton {
         width: 47px;
         height: 30px;
-        background-color: $light-color-secondary;
+        background-color: $light-gray;
         // position: absolute;
         transition: all 0.5s ease;
         // top: 3px;
diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
index 2e6186680..ee6d446f8 100644
--- a/src/client/views/collections/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/CollectionSchemaCells.tsx
@@ -26,7 +26,7 @@ import { SnappingManager } from "../../util/SnappingManager";
 import { undoBatch } from "../../util/UndoManager";
 import '../DocumentDecorations.scss';
 import { EditableView } from "../EditableView";
-import { MAX_ROW_HEIGHT } from '../globalCssVariables.scss';
+import { MAX_ROW_HEIGHT } from '../global/globalCssVariables.scss';
 import { DocumentIconContainer } from "../nodes/DocumentIcon";
 import { OverlayView } from "../OverlayView";
 import "./CollectionSchemaView.scss";
diff --git a/src/client/views/collections/CollectionSchemaView.scss b/src/client/views/collections/CollectionSchemaView.scss
index 2bdd280ec..d529f097e 100644
--- a/src/client/views/collections/CollectionSchemaView.scss
+++ b/src/client/views/collections/CollectionSchemaView.scss
@@ -1,8 +1,8 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .collectionSchemaView-container {
     border-width: $COLLECTION_BORDER_WIDTH;
-    border-color: $intermediate-color;
+    border-color: $medium-gray;
     border-style: solid;
     border-radius: $border-radius;
     box-sizing: border-box;
@@ -39,13 +39,13 @@
     }
 
     // .documentView-node:first-child {
-    //     background: $light-color;
+    //     background: $white;
     // }
 }
 
 .collectionSchemaView-searchContainer {
     border-width: $COLLECTION_BORDER_WIDTH;
-    border-color: $intermediate-color;
+    border-color: $medium-gray;
     border-style: solid;
     border-radius: $border-radius;
     box-sizing: border-box;
@@ -83,7 +83,7 @@
     }
 
     // .documentView-node:first-child {
-    //     background: $light-color;
+    //     background: $white;
     // }
 }
 
@@ -282,7 +282,7 @@ button.add-column {
     }
 
     label {
-        color: $main-accent;
+        color: $medium-gray;
         font-weight: normal;
         letter-spacing: 2px;
         text-transform: uppercase;
@@ -300,12 +300,12 @@ button.add-column {
         transition: background-color 0.2s;
 
         &:hover {
-            background-color: $light-color-secondary;
+            background-color: $light-gray;
         }
 
         &.active {
             font-weight: bold;
-            border: 2px solid $light-color-secondary;
+            border: 2px solid $light-gray;
         }
 
         svg {
@@ -321,7 +321,7 @@ button.add-column {
         background-color: white;
 
         input {
-            border: 2px solid $light-color-secondary;
+            border: 2px solid $light-gray;
             padding: 3px;
             height: 28px;
             font-weight: bold;
@@ -352,7 +352,7 @@ button.add-column {
                 }
 
                 &:hover {
-                    background-color: $light-color-secondary;
+                    background-color: $light-gray;
                 }
             }
         }
@@ -382,7 +382,7 @@ button.add-column {
     background-color: white;
 
     &.row-focused .rt-td {
-        background-color: #bfffc0; //$light-color-secondary;
+        background-color: #bfffc0; //$light-gray;
     }
 
     &.row-wrapped {
diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx
index b33c437a9..18926264d 100644
--- a/src/client/views/collections/CollectionSchemaView.tsx
+++ b/src/client/views/collections/CollectionSchemaView.tsx
@@ -16,7 +16,7 @@ import { SelectionManager } from "../../util/SelectionManager";
 import { SnappingManager } from "../../util/SnappingManager";
 import { Transform } from "../../util/Transform";
 import { undoBatch } from "../../util/UndoManager";
-import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../views/globalCssVariables.scss';
+import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../views/global/globalCssVariables.scss';
 import { ContextMenu } from "../ContextMenu";
 import { ContextMenuProps } from "../ContextMenuItem";
 import '../DocumentDecorations.scss';
@@ -147,43 +147,43 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) {
 
         const anyType = <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Any)}>
             <FontAwesomeIcon icon={"align-justify"} size="sm" />
-                Any
-            </div>;
+            Any
+        </div>;
 
         const numType = <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Number)}>
             <FontAwesomeIcon icon={"hashtag"} size="sm" />
-                Number
-            </div>;
+            Number
+        </div>;
 
         const textType = <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.String)}>
             <FontAwesomeIcon icon={"font"} size="sm" />
             Text
-            </div>;
+        </div>;
 
         const boolType = <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Boolean)}>
             <FontAwesomeIcon icon={"check-square"} size="sm" />
             Checkbox
-            </div>;
+        </div>;
 
         const listType = <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.List)}>
             <FontAwesomeIcon icon={"list-ul"} size="sm" />
             List
-            </div>;
+        </div>;
 
         const docType = <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Doc)}>
             <FontAwesomeIcon icon={"file"} size="sm" />
             Document
-            </div>;
+        </div>;
 
         const imageType = <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Image)}>
             <FontAwesomeIcon icon={"image"} size="sm" />
             Image
-            </div>;
+        </div>;
 
         const dateType = <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Date)}>
             <FontAwesomeIcon icon={"calendar"} size="sm" />
-                Date
-                </div>;
+            Date
+        </div>;
 
 
         const allColumnTypes = <div className="columnMenu-types">
diff --git a/src/client/views/collections/CollectionStackingView.scss b/src/client/views/collections/CollectionStackingView.scss
index 9f56a0c0e..f103d9581 100644
--- a/src/client/views/collections/CollectionStackingView.scss
+++ b/src/client/views/collections/CollectionStackingView.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .collectionMasonryView {
     display: inline;
@@ -97,7 +97,7 @@
         width: 100%;
         font-family: $sans-serif;
         background: $dark-color;
-        color: $light-color;
+        color: $white;
     }
 
     .collectionStackingView-columnDragger {
@@ -128,7 +128,7 @@
         margin-left: 2px;
         margin-right: 2px;
         margin-top: 2px;
-        background: $main-accent;
+        background: $medium-gray;
         height: 5px;
 
         &.active {
@@ -180,11 +180,11 @@
     .collectionStackingView-sectionHeader {
         text-align: center;
         margin: auto;
-        background: $main-accent;
+        background: $medium-gray;
         // overflow: hidden; overflow is visible so the color menu isn't hidden -ftong
 
         .editableView-input {
-            color: black;
+            color: $dark-color;
         }
 
         .editableView-input:hover,
@@ -205,7 +205,7 @@
             display: flex;
             align-items: center;
             justify-content: center;
-            color: black;
+            color: $dark-color;
 
             .editableView-container-editing-oneLine,
             .editableView-container-editing {
diff --git a/src/client/views/collections/CollectionTreeView.scss b/src/client/views/collections/CollectionTreeView.scss
index 72ab51784..ec461ab94 100644
--- a/src/client/views/collections/CollectionTreeView.scss
+++ b/src/client/views/collections/CollectionTreeView.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .collectionTreeView-dropTarget {
     border-width: $COLLECTION_BORDER_WIDTH;
@@ -12,7 +12,7 @@
     top: 0;
     padding-left: 10px;
     padding-right: 10px;
-    background: $light-color-secondary;
+    background: $light-gray;
     font-size: 13px;
     overflow: auto;
     user-select: none;
@@ -40,7 +40,7 @@
     }
 
     .delete-button {
-        color: $intermediate-color;
+        color: $medium-gray;
         // float: right;
         margin-left: 15px;
         // margin-top: 3px;
@@ -71,7 +71,7 @@
 .collectionTreeView-subtitle {
     font-style: italic;
     font-size: 8pt;
-    color: $intermediate-color;
+    color: $medium-gray;
 }
 
 .docContainer {
diff --git a/src/client/views/collections/CollectionView.scss b/src/client/views/collections/CollectionView.scss
index a5aef86de..5db489c0a 100644
--- a/src/client/views/collections/CollectionView.scss
+++ b/src/client/views/collections/CollectionView.scss
@@ -1,8 +1,8 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .collectionView {
     border-width: 0;
-    border-color: $light-color-secondary;
+    border-color: $light-gray;
     border-style: solid;
     border-radius: 0 0 $border-radius $border-radius;
     box-sizing: border-box;
diff --git a/src/client/views/collections/SchemaTable.tsx b/src/client/views/collections/SchemaTable.tsx
index 0c69ee030..84560cf26 100644
--- a/src/client/views/collections/SchemaTable.tsx
+++ b/src/client/views/collections/SchemaTable.tsx
@@ -21,7 +21,7 @@ import { DocumentType } from "../../documents/DocumentTypes";
 import { CompileScript, Transformer, ts } from "../../util/Scripting";
 import { Transform } from "../../util/Transform";
 import { undoBatch } from "../../util/UndoManager";
-import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../views/globalCssVariables.scss';
+import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../views/global/globalCssVariables.scss';
 import { ContextMenu } from "../ContextMenu";
 import '../DocumentDecorations.scss';
 import { DocumentView } from "../nodes/DocumentView";
diff --git a/src/client/views/collections/TreeView.scss b/src/client/views/collections/TreeView.scss
index 3f6fc8b0c..1ebc5873e 100644
--- a/src/client/views/collections/TreeView.scss
+++ b/src/client/views/collections/TreeView.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .treeView-label {
     max-height: 1.5em;
@@ -14,7 +14,7 @@
     .bullet-outline {
         position: relative;
         width: $TREE_BULLET_WIDTH;
-        color: $intermediate-color;
+        color: $medium-gray;
         transform: scale(0.5);
         display: inline-flex;
         align-items: center;
@@ -45,7 +45,7 @@
     .bullet {
         position: relative;
         width: $TREE_BULLET_WIDTH;
-        color: $intermediate-color;
+        color: $medium-gray;
         margin-top: 3px;
         transform: scale(1.3, 1.3);
         border: #80808030 1px solid;
diff --git a/src/client/views/collections/TreeView.tsx b/src/client/views/collections/TreeView.tsx
index 2e98fb508..4f9a966f2 100644
--- a/src/client/views/collections/TreeView.tsx
+++ b/src/client/views/collections/TreeView.tsx
@@ -20,7 +20,7 @@ import { SnappingManager } from '../../util/SnappingManager';
 import { Transform } from '../../util/Transform';
 import { undoBatch, UndoManager } from '../../util/UndoManager';
 import { EditableView } from "../EditableView";
-import { TREE_BULLET_WIDTH } from '../globalCssVariables.scss';
+import { TREE_BULLET_WIDTH } from '../global/globalCssVariables.scss';
 import { DocumentView, DocumentViewProps, StyleProviderFunc, DocumentViewInternal } from '../nodes/DocumentView';
 import { FormattedTextBox } from '../nodes/formattedText/FormattedTextBox';
 import { RichTextMenu } from '../nodes/formattedText/RichTextMenu';
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormRemoteCursors.scss b/src/client/views/collections/collectionFreeForm/CollectionFreeFormRemoteCursors.scss
index c5b8fc5e8..5fa01b102 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormRemoteCursors.scss
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormRemoteCursors.scss
@@ -1,4 +1,4 @@
-@import "globalCssVariables";
+@import "global/globalCssVariables";
 
 .collectionFreeFormRemoteCursors-cont {
     
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss
index eb0538c41..79e063f7f 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss
@@ -1,4 +1,4 @@
-@import "../../globalCssVariables";
+@import "../../global/globalCssVariables";
 
 .collectionfreeformview-none {
     position: inherit;
@@ -226,7 +226,7 @@
     //   linear-gradient(to bottom, $light-color-secondary 1px, transparent 1px);
     // background-size: 30px 30px;
     // }
-    border: 0px solid $light-color-secondary;
+    border: 0px solid $light-gray;
     border-radius: inherit;
     box-sizing: border-box;
     position: absolute;
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index accb80c5a..a4e310e6c 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -28,7 +28,7 @@ import { SelectionManager } from "../../../util/SelectionManager";
 import { SnappingManager } from "../../../util/SnappingManager";
 import { Transform } from "../../../util/Transform";
 import { undoBatch } from "../../../util/UndoManager";
-import { COLLECTION_BORDER_WIDTH } from "../../../views/globalCssVariables.scss";
+import { COLLECTION_BORDER_WIDTH } from "../../../views/global/globalCssVariables.scss";
 import { Timeline } from "../../animationtimeline/Timeline";
 import { ContextMenu } from "../../ContextMenu";
 import { DocumentDecorations } from "../../DocumentDecorations";
@@ -834,10 +834,10 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
                 map(doc => ({ ...this.childDataProvider(doc, ""), ...this.childSizeProvider(doc, "") }));
             if (measuredDocs.length) {
                 const ranges = measuredDocs.reduce(({ xrange, yrange }, { x, y, width, height }) =>  // computes range of content
-                    ({
-                        xrange: { min: Math.min(xrange.min, x), max: Math.max(xrange.max, x + width) },
-                        yrange: { min: Math.min(yrange.min, y), max: Math.max(yrange.max, y + height) }
-                    })
+                ({
+                    xrange: { min: Math.min(xrange.min, x), max: Math.max(xrange.max, x + width) },
+                    yrange: { min: Math.min(yrange.min, y), max: Math.max(yrange.max, y + height) }
+                })
                     , {
                         xrange: { min: Number.MAX_VALUE, max: -Number.MAX_VALUE },
                         yrange: { min: Number.MAX_VALUE, max: -Number.MAX_VALUE }
diff --git a/src/client/views/global/globalCssVariables.scss b/src/client/views/global/globalCssVariables.scss
new file mode 100644
index 000000000..218bdbf3c
--- /dev/null
+++ b/src/client/views/global/globalCssVariables.scss
@@ -0,0 +1,52 @@
+@import url("https://fonts.googleapis.com/css?family=Noto+Sans:400,700|Crimson+Text:400,400i,700");
+// colors
+$white: #ffffff;
+$light-gray:#dfdfdf;
+$medium-gray: #9F9F9F;
+
+$lighter-alt-accent: rgb(207, 220, 240);
+$darker-alt-accent: #b2cef8;
+
+$dark-color: #111111;
+$link-color: #add8e6;
+$antimodemenu-height: 35px;
+// fonts
+$sans-serif: "Noto Sans",
+sans-serif;
+// $sans-serif: "Roboto Slab", sans-serif;
+$serif: "Crimson Text",
+serif;
+// misc values
+$border-radius: 0.3em;
+//
+$search-thumnail-size: 130;
+
+// dragged items
+$contextMenu-zindex: 100000; // context menu shows up over everything
+$radialMenu-zindex: 100000; // context menu shows up over everything
+
+$searchpanel-height: 32px;
+$mainTextInput-zindex: 999; // then text input overlay so that it's context menu will appear over decorations, etc
+$docDecorations-zindex: 998; // then doc decorations appear over everything else
+$remoteCursors-zindex: 997; // ... not sure what level the remote cursors should go -- is this right?
+$COLLECTION_BORDER_WIDTH: 0;
+$SCHEMA_DIVIDER_WIDTH: 4;
+$MINIMIZED_ICON_SIZE:25;
+$MAX_ROW_HEIGHT: 44px;
+$DFLT_IMAGE_NATIVE_DIM: 900px;
+$MENU_PANEL_WIDTH: 60px;
+$TREE_BULLET_WIDTH: 20px;
+
+:export {
+    contextMenuZindex: $contextMenu-zindex;
+    SCHEMA_DIVIDER_WIDTH: $SCHEMA_DIVIDER_WIDTH;
+    COLLECTION_BORDER_WIDTH: $COLLECTION_BORDER_WIDTH;
+    MINIMIZED_ICON_SIZE: $MINIMIZED_ICON_SIZE;
+    MAX_ROW_HEIGHT: $MAX_ROW_HEIGHT;
+    SEARCH_THUMBNAIL_SIZE: $search-thumnail-size;
+    ANTIMODEMENU_HEIGHT: $antimodemenu-height;
+    SEARCH_PANEL_HEIGHT: $searchpanel-height;
+    DFLT_IMAGE_NATIVE_DIM: $DFLT_IMAGE_NATIVE_DIM;
+    MENU_PANEL_WIDTH: $MENU_PANEL_WIDTH;
+    TREE_BULLET_WIDTH: $TREE_BULLET_WIDTH;
+}
\ No newline at end of file
diff --git a/src/client/views/global/globalCssVariables.scss.d.ts b/src/client/views/global/globalCssVariables.scss.d.ts
new file mode 100644
index 000000000..11e62e1eb
--- /dev/null
+++ b/src/client/views/global/globalCssVariables.scss.d.ts
@@ -0,0 +1,17 @@
+
+interface IGlobalScss {
+    contextMenuZindex: string;  // context menu shows up over everything
+    SCHEMA_DIVIDER_WIDTH: string;
+    COLLECTION_BORDER_WIDTH: string;
+    MINIMIZED_ICON_SIZE: string;
+    MAX_ROW_HEIGHT: string;
+    SEARCH_THUMBNAIL_SIZE: string;
+    ANTIMODEMENU_HEIGHT: string;
+    SEARCH_PANEL_HEIGHT: string;
+    DFLT_IMAGE_NATIVE_DIM: string;
+    MENU_PANEL_WIDTH: string;
+    TREE_BULLET_WIDTH: string;
+}
+declare const globalCssVariables: IGlobalScss;
+
+export = globalCssVariables;
\ No newline at end of file
diff --git a/src/client/views/global/globalEnums.tsx b/src/client/views/global/globalEnums.tsx
new file mode 100644
index 000000000..9d182ee0f
--- /dev/null
+++ b/src/client/views/global/globalEnums.tsx
@@ -0,0 +1,19 @@
+export enum Colors {
+    DarkGray = "#111111",
+    MediumGray = "#9F9F9F",
+    LightGray = "#DFDFDF",
+    White = "#FFFFFF",
+    MediumBlue = "#4476F7",
+    LightBlue = "#BDDDF5",
+    Pink = "#E0217D",
+    Yellow = "#F5D747"
+}
+
+export enum FontSizes {
+    LargeHeader = "16px"
+
+}
+
+export enum Padding {
+
+}
\ No newline at end of file
diff --git a/src/client/views/globalCssVariables.scss b/src/client/views/globalCssVariables.scss
deleted file mode 100644
index ccc9306c4..000000000
--- a/src/client/views/globalCssVariables.scss
+++ /dev/null
@@ -1,56 +0,0 @@
-@import url("https://fonts.googleapis.com/css?family=Noto+Sans:400,700|Crimson+Text:400,400i,700");
-// colors
-$light-color: #fcfbf7;
-$light-color-secondary:#f1efeb;
-//$main-accent: #61aaa3;
-$main-accent: #aaaaa3;
-// $alt-accent: #cdd5ec;
-// $alt-accent: #cdeceb;
-//$alt-accent: #59dff7;
-$alt-accent: #c2c2c5;
-$lighter-alt-accent: rgb(207, 220, 240);
-$darker-alt-accent: #b2cef8;
-$intermediate-color: #9c9396;
-$dark-color: #121721;
-$link-color: #add8e6;
-$antimodemenu-height: 35px;
-// fonts
-$sans-serif: "Noto Sans",
-sans-serif;
-// $sans-serif: "Roboto Slab", sans-serif;
-$serif: "Crimson Text",
-serif;
-// misc values
-$border-radius: 0.3em;
-//
-$search-thumnail-size: 130;
-
-// dragged items
-$contextMenu-zindex: 100000; // context menu shows up over everything
-$radialMenu-zindex: 100000; // context menu shows up over everything
-
-$searchpanel-height: 32px;
-$mainTextInput-zindex: 999; // then text input overlay so that it's context menu will appear over decorations, etc
-$docDecorations-zindex: 998; // then doc decorations appear over everything else
-$remoteCursors-zindex: 997; // ... not sure what level the remote cursors should go -- is this right?
-$COLLECTION_BORDER_WIDTH: 0;
-$SCHEMA_DIVIDER_WIDTH: 4;
-$MINIMIZED_ICON_SIZE:25;
-$MAX_ROW_HEIGHT: 44px;
-$DFLT_IMAGE_NATIVE_DIM: 900px;
-$MENU_PANEL_WIDTH: 60px;
-$TREE_BULLET_WIDTH: 20px;
-
-:export {
-    contextMenuZindex: $contextMenu-zindex;
-    SCHEMA_DIVIDER_WIDTH: $SCHEMA_DIVIDER_WIDTH;
-    COLLECTION_BORDER_WIDTH: $COLLECTION_BORDER_WIDTH;
-    MINIMIZED_ICON_SIZE: $MINIMIZED_ICON_SIZE;
-    MAX_ROW_HEIGHT: $MAX_ROW_HEIGHT;
-    SEARCH_THUMBNAIL_SIZE: $search-thumnail-size;
-    ANTIMODEMENU_HEIGHT: $antimodemenu-height;
-    SEARCH_PANEL_HEIGHT: $searchpanel-height;
-    DFLT_IMAGE_NATIVE_DIM: $DFLT_IMAGE_NATIVE_DIM;
-    MENU_PANEL_WIDTH: $MENU_PANEL_WIDTH;
-    TREE_BULLET_WIDTH: $TREE_BULLET_WIDTH;
-}
\ No newline at end of file
diff --git a/src/client/views/globalCssVariables.scss.d.ts b/src/client/views/globalCssVariables.scss.d.ts
deleted file mode 100644
index 11e62e1eb..000000000
--- a/src/client/views/globalCssVariables.scss.d.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-
-interface IGlobalScss {
-    contextMenuZindex: string;  // context menu shows up over everything
-    SCHEMA_DIVIDER_WIDTH: string;
-    COLLECTION_BORDER_WIDTH: string;
-    MINIMIZED_ICON_SIZE: string;
-    MAX_ROW_HEIGHT: string;
-    SEARCH_THUMBNAIL_SIZE: string;
-    ANTIMODEMENU_HEIGHT: string;
-    SEARCH_PANEL_HEIGHT: string;
-    DFLT_IMAGE_NATIVE_DIM: string;
-    MENU_PANEL_WIDTH: string;
-    TREE_BULLET_WIDTH: string;
-}
-declare const globalCssVariables: IGlobalScss;
-
-export = globalCssVariables;
\ No newline at end of file
diff --git a/src/client/views/linking/LinkEditor.scss b/src/client/views/linking/LinkEditor.scss
index 7e6999cdc..eee072ed5 100644
--- a/src/client/views/linking/LinkEditor.scss
+++ b/src/client/views/linking/LinkEditor.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .linkEditor {
     width: 100%;
@@ -20,7 +20,7 @@
 }
 
 .linkEditor-info {
-    //border-bottom: 0.5px solid $light-color-secondary;
+    //border-bottom: 0.5px solid $light-gray;
     //padding-bottom: 1px;
     padding-top: 5px;
     padding-left: 5px;
@@ -195,7 +195,7 @@
 }
 
 .linkEditor-group {
-    background-color: $light-color-secondary;
+    background-color: $light-gray;
     padding: 6px;
     margin: 3px 0;
     border-radius: 3px;
@@ -254,8 +254,8 @@
     }
 
     .linkEditor-option {
-        background-color: $light-color-secondary;
-        border: 1px solid $intermediate-color;
+        background-color: $light-gray;
+        border: 1px solid $medium-gray;
         border-top: 0;
         padding: 3px;
         cursor: pointer;
@@ -285,7 +285,7 @@
     width: calc(100% - 40px);
 
     &:hover {
-        background-color: $light-color;
+        background-color: $white;
     }
 }
 
diff --git a/src/client/views/linking/LinkMenu.scss b/src/client/views/linking/LinkMenu.scss
index a90bf8b0a..a2ea42999 100644
--- a/src/client/views/linking/LinkMenu.scss
+++ b/src/client/views/linking/LinkMenu.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .linkMenu {
     width: auto;
diff --git a/src/client/views/linking/LinkMenuItem.scss b/src/client/views/linking/LinkMenuItem.scss
index 4e13ef8c8..a07e540ae 100644
--- a/src/client/views/linking/LinkMenuItem.scss
+++ b/src/client/views/linking/LinkMenuItem.scss
@@ -1,7 +1,7 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .linkMenu-item {
-    // border-top: 0.5px solid $main-accent; 
+    // border-top: 0.5px solid $medium-gray; 
     position: relative;
     display: flex;
     border-bottom: 0.5px solid black;
@@ -102,7 +102,7 @@
     .link-metadata {
         padding: 0 10px 0 16px;
         margin-bottom: 4px;
-        color: $main-accent;
+        color: $medium-gray;
         font-style: italic;
         font-size: 10.5px;
     }
@@ -144,7 +144,7 @@
         border-radius: 50%;
         pointer-events: auto;
         background-color: $dark-color;
-        color: $light-color;
+        color: $white;
         font-size: 65%;
         transition: transform 0.2s;
         text-align: center;
@@ -162,7 +162,7 @@
         }
 
         &:hover {
-            background: $main-accent;
+            background: $medium-gray;
             cursor: pointer;
         }
     }
diff --git a/src/client/views/nodes/DocumentLinksButton.scss b/src/client/views/nodes/DocumentLinksButton.scss
index 735aa669f..daffaf9e7 100644
--- a/src/client/views/nodes/DocumentLinksButton.scss
+++ b/src/client/views/nodes/DocumentLinksButton.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables.scss";
+@import "../global/globalCssVariables.scss";
 
 
 .documentLinksButton-cont {
@@ -37,7 +37,7 @@
     font-weight: bold;
 
     &:hover {
-        background: $main-accent;
+        background: $medium-gray;
         transform: scale(1.05);
         cursor: pointer;
     }
diff --git a/src/client/views/nodes/DocumentView.scss b/src/client/views/nodes/DocumentView.scss
index bdbece621..8f86417d6 100644
--- a/src/client/views/nodes/DocumentView.scss
+++ b/src/client/views/nodes/DocumentView.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .documentView-effectsWrapper {
     border-radius: inherit;
@@ -22,7 +22,7 @@
     transition: outline .3s linear;
     cursor: grab;
 
-    // background: $light-color; //overflow: hidden;
+    // background: $white; //overflow: hidden;
     transform-origin: left top;
 
     &.minimized {
@@ -218,6 +218,6 @@
 
     .documentView-node:first-child {
         position: relative;
-        background: "#B59B66"; //$light-color;
+        background: "#B59B66"; //$white;
     }
 }
\ No newline at end of file
diff --git a/src/client/views/nodes/KeyValueBox.scss b/src/client/views/nodes/KeyValueBox.scss
index eb7c2f32b..ffcba4981 100644
--- a/src/client/views/nodes/KeyValueBox.scss
+++ b/src/client/views/nodes/KeyValueBox.scss
@@ -1,10 +1,10 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 .keyValueBox-cont {
     overflow-y: scroll;
     width:100%;
     height: 100%;
-    background-color: $light-color;
-    border: 1px solid $intermediate-color;
+    background-color: $white;
+    border: 1px solid $medium-gray;
     border-radius: $border-radius;
     box-sizing: border-box;
     display: inline-block;
@@ -56,8 +56,8 @@ $header-height: 30px;
     width:100%;
     position: relative;
     display: inline-block;
-    background: $intermediate-color;
-    color: $light-color;
+    background: $medium-gray;
+    color: $white;
     text-transform: uppercase;
     letter-spacing: 2px;
     font-size: 12px;
@@ -66,7 +66,7 @@ $header-height: 30px;
     th {
         font-weight: normal;
         &:first-child {
-            border-right: 1px solid $light-color;
+            border-right: 1px solid $white;
         }
     }
 }
@@ -76,9 +76,9 @@ $header-height: 30px;
     display: flex;
     width:100%;
     height:$header-height;
-    background: $light-color;
+    background: $white;
     .formattedTextBox-cont {
-        background: $light-color;
+        background: $white;
     }
 }
 .keyValueBox-cont {
@@ -116,8 +116,8 @@ $header-height: 30px;
     display: flex;
     width:100%;
     height:30px;
-    background: $light-color-secondary;
+    background: $light-gray;
     .formattedTextBox-cont {
-        background: $light-color-secondary;
+        background: $light-gray;
     }
 }
\ No newline at end of file
diff --git a/src/client/views/nodes/KeyValuePair.scss b/src/client/views/nodes/KeyValuePair.scss
index f78767234..5b660e582 100644
--- a/src/client/views/nodes/KeyValuePair.scss
+++ b/src/client/views/nodes/KeyValuePair.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 
 .keyValuePair-td-key {
diff --git a/src/client/views/nodes/RadialMenu.scss b/src/client/views/nodes/RadialMenu.scss
index daa620d12..312b51013 100644
--- a/src/client/views/nodes/RadialMenu.scss
+++ b/src/client/views/nodes/RadialMenu.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .radialMenu-cont {
     position: absolute;
@@ -53,7 +53,7 @@ s
     transition: all .1s;
     border-width: .11px;
     border-style: none;
-    border-color: $intermediate-color; //  rgb(187, 186, 186);
+    border-color: $medium-gray; //  rgb(187, 186, 186);
     // padding: 10px 0px 10px 0px;
     white-space: nowrap;
     font-size: 13px;
diff --git a/src/client/views/nodes/WebBox.scss b/src/client/views/nodes/WebBox.scss
index ca82c049c..e206508d3 100644
--- a/src/client/views/nodes/WebBox.scss
+++ b/src/client/views/nodes/WebBox.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables.scss";
+@import "../global/globalCssVariables.scss";
 
 
 .webBox {
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.scss b/src/client/views/nodes/formattedText/FormattedTextBox.scss
index 53aceb533..3cedab1a4 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.scss
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.scss
@@ -1,4 +1,4 @@
-@import "../../globalCssVariables";
+@import "../../global/globalCssVariables";
 
 .ProseMirror {
     width: 100%;
@@ -31,7 +31,7 @@ audiotag:hover {
     padding: 0;
     border-width: 0px;
     border-radius: inherit;
-    border-color: $intermediate-color;
+    border-color: $medium-gray;
     box-sizing: border-box;
     background-color: inherit;
     border-style: solid;
@@ -363,7 +363,7 @@ footnote::after {
 
 
 @media only screen and (max-width: 1000px) {
-    @import "../../globalCssVariables";
+    @import "../../global/globalCssVariables";
 
     .ProseMirror {
         width: 100%;
@@ -381,7 +381,7 @@ footnote::after {
         padding: 0;
         border-width: 0px;
         border-radius: inherit;
-        border-color: $intermediate-color;
+        border-color: $medium-gray;
         box-sizing: border-box;
         background-color: inherit;
         border-style: solid;
diff --git a/src/client/views/nodes/formattedText/RichTextMenu.scss b/src/client/views/nodes/formattedText/RichTextMenu.scss
index 1d24d6833..c94e93541 100644
--- a/src/client/views/nodes/formattedText/RichTextMenu.scss
+++ b/src/client/views/nodes/formattedText/RichTextMenu.scss
@@ -1,4 +1,4 @@
-@import "../../globalCssVariables";
+@import "../../global/globalCssVariables";
 
 .button-dropdown-wrapper {
     position: relative;
@@ -24,7 +24,7 @@
         top: 35px;
         left: 0;
         background-color: #323232;
-        color: $light-color-secondary;
+        color: $light-gray;
         border: 1px solid #4d4d4d;
         border-radius: 0 6px 6px 6px;
         box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.25);
diff --git a/src/client/views/nodes/formattedText/TooltipTextMenu.scss b/src/client/views/nodes/formattedText/TooltipTextMenu.scss
index 0e4b752ac..8c4d77da9 100644
--- a/src/client/views/nodes/formattedText/TooltipTextMenu.scss
+++ b/src/client/views/nodes/formattedText/TooltipTextMenu.scss
@@ -1,4 +1,4 @@
-@import "../views/globalCssVariables";
+@import "../views/global/globalCssVariables";
 .ProseMirror-menu-dropdown-wrap {
     display: inline-block;
     position: relative;
@@ -50,7 +50,7 @@
         padding: 3px;
 
         &:hover {
-            background-color: $light-color-secondary;
+            background-color: $light-gray;
         }
     }
 }
@@ -294,9 +294,9 @@
         top: 31px;
         background-color: #323232;
         border: 1px solid #4d4d4d;
-        color: $light-color-secondary;
+        color: $light-gray;
         // border: none;
-        // border: 1px solid $light-color-secondary;
+        // border: 1px solid $light-gray;
         border-radius: 0 6px 6px 6px;
         padding: 3px;
         box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.25);
@@ -323,7 +323,7 @@
             }
 
             .separated-button {
-                border-top: 1px solid $light-color-secondary;
+                border-top: 1px solid $light-gray;
                 padding-top: 6px;
             }
 
diff --git a/src/client/views/search/CheckBox.scss b/src/client/views/search/CheckBox.scss
index cc858bec6..c46b3eb20 100644
--- a/src/client/views/search/CheckBox.scss
+++ b/src/client/views/search/CheckBox.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .checkboxfilter {
     display: flex;
@@ -40,7 +40,7 @@
             overflow: visible;
             background-color: transparent;
             border-style: solid;
-            border-color: $alt-accent;
+            border-color: $medium-gray;
             border-width: 2px;
             -webkit-transition: all 0.2s ease-in-out;
             -moz-transition: all 0.2s ease-in-out;
diff --git a/src/client/views/search/CollectionFilters.scss b/src/client/views/search/CollectionFilters.scss
index b54cdcbd1..845b16f67 100644
--- a/src/client/views/search/CollectionFilters.scss
+++ b/src/client/views/search/CollectionFilters.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .collection-filters {
     display: flex;
diff --git a/src/client/views/search/IconBar.scss b/src/client/views/search/IconBar.scss
index 013dcd57e..6aaf7918d 100644
--- a/src/client/views/search/IconBar.scss
+++ b/src/client/views/search/IconBar.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .icon-bar {
     display: flex;
diff --git a/src/client/views/search/IconButton.scss b/src/client/views/search/IconButton.scss
index 4ec03c7c9..d87b8bd5c 100644
--- a/src/client/views/search/IconButton.scss
+++ b/src/client/views/search/IconButton.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .type-outer {
     display: flex;
@@ -9,7 +9,7 @@
     .type-icon {
         height: 30px;
         width: 30px;
-        color: $light-color;
+        color: $white;
         // background-color: rgb(194, 194, 197);
         background-color: gray;
         border-radius: 50%;
diff --git a/src/client/views/search/IconButton.tsx b/src/client/views/search/IconButton.tsx
index 349690b20..6fd91c9c1 100644
--- a/src/client/views/search/IconButton.tsx
+++ b/src/client/views/search/IconButton.tsx
@@ -4,7 +4,7 @@ import { action, IReactionDisposer, observable, reaction, runInAction } from 'mo
 import { observer } from 'mobx-react';
 import * as React from 'react';
 import { DocumentType } from "../../documents/DocumentTypes";
-import '../globalCssVariables.scss';
+import '../global/globalCssVariables.scss';
 import { IconBar } from './IconBar';
 import "./IconButton.scss";
 import "./SearchBox.scss";
diff --git a/src/client/views/search/NaviconButton.scss b/src/client/views/search/NaviconButton.scss
index c23bab461..8a70b29de 100644
--- a/src/client/views/search/NaviconButton.scss
+++ b/src/client/views/search/NaviconButton.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 $height-icon: 15px;
 $width-line: 30px;
@@ -20,7 +20,7 @@ $translateX: 0;
 
     .line {
         display: block;
-        background: $alt-accent;
+        background: $medium-gray;
         width: $width-line;
         height: $height-line;
         position: absolute;
diff --git a/src/client/views/search/SearchBox.scss b/src/client/views/search/SearchBox.scss
index 4f5b7e41a..8d6bc86cb 100644
--- a/src/client/views/search/SearchBox.scss
+++ b/src/client/views/search/SearchBox.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 @import "./NaviconButton.scss";
 
 .searchBox-container {
@@ -20,7 +20,7 @@
         display: flex;
         justify-content: center;
         align-items: center;
-        background-color: black;
+        background-color: $dark-color;
 
         .searchBox-lozenges {
             position: absolute;
@@ -86,7 +86,7 @@
             &.searchBox-input {
                 margin:5px;
                 border-radius:20px;
-                border:black;    
+                border:$dark-color;    
                 display: block;
                 width: 130px;
                 -webkit-transition: width 0.4s;
@@ -114,7 +114,7 @@
             }
 
             &.searchBox-close {
-                color: $light-color;
+                color: $white;
                 max-height: $searchpanel-height;
             }
         }
@@ -132,7 +132,7 @@
 
     .no-result {
         width: 500px;
-        background: $light-color-secondary;
+        background: $light-gray;
         padding: 10px;
         height: 50px;
         text-transform: uppercase;
diff --git a/src/client/views/search/SelectorContextMenu.scss b/src/client/views/search/SelectorContextMenu.scss
index 48cacc608..438b6a0c2 100644
--- a/src/client/views/search/SelectorContextMenu.scss
+++ b/src/client/views/search/SelectorContextMenu.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .parents {
     background: $lighter-alt-accent;
diff --git a/src/client/views/search/ToggleBar.scss b/src/client/views/search/ToggleBar.scss
index 79f866acb..3a164f133 100644
--- a/src/client/views/search/ToggleBar.scss
+++ b/src/client/views/search/ToggleBar.scss
@@ -1,9 +1,9 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .toggle-title {
     display: flex;
     align-items: center;
-    color: $light-color;
+    color: $white;
     text-transform: uppercase;
     flex-direction: row;
     justify-content: space-around;
@@ -25,7 +25,7 @@
     // height: 50px;
     height: 30px;
     width: 100px;
-    background-color: $alt-accent;
+    background-color: $medium-gray;
     border-radius: 10px;
     padding: 5px;
     display: flex;
@@ -36,6 +36,6 @@
         width: 40px;
         height: 100%;
         border-radius: 10px;
-        background-color: $light-color;
+        background-color: $white;
     }
 }
\ No newline at end of file
diff --git a/src/client/views/webcam/DashWebRTCVideo.scss b/src/client/views/webcam/DashWebRTCVideo.scss
index 41307a808..249aee9d6 100644
--- a/src/client/views/webcam/DashWebRTCVideo.scss
+++ b/src/client/views/webcam/DashWebRTCVideo.scss
@@ -1,4 +1,4 @@
-@import "../globalCssVariables";
+@import "../global/globalCssVariables";
 
 .webcam-cont {
     background: whitesmoke;
diff --git a/src/mobile/AudioUpload.scss b/src/mobile/AudioUpload.scss
index 6e64d9e2e..dce0c724f 100644
--- a/src/mobile/AudioUpload.scss
+++ b/src/mobile/AudioUpload.scss
@@ -1,4 +1,4 @@
-@import "../client/views/globalCssVariables.scss";
+@import "../client/views/global/globalCssVariables.scss";
 
 .audioUpload_cont {
     display: flex;
diff --git a/src/mobile/ImageUpload.scss b/src/mobile/ImageUpload.scss
index 890258918..6669a3d21 100644
--- a/src/mobile/ImageUpload.scss
+++ b/src/mobile/ImageUpload.scss
@@ -1,4 +1,4 @@
-@import "../client/views/globalCssVariables.scss";
+@import "../client/views/global/globalCssVariables.scss";
 
 .imgupload_cont {
     display: flex;
diff --git a/src/mobile/ImageUpload.tsx b/src/mobile/ImageUpload.tsx
index 2183d2172..98696496f 100644
--- a/src/mobile/ImageUpload.tsx
+++ b/src/mobile/ImageUpload.tsx
@@ -5,7 +5,7 @@ import * as rp from 'request-promise';
 import { DocServer } from '../client/DocServer';
 import { Docs } from '../client/documents/Documents';
 import { Networking } from '../client/Network';
-import { DFLT_IMAGE_NATIVE_DIM } from '../client/views/globalCssVariables.scss';
+import { DFLT_IMAGE_NATIVE_DIM } from '../client/views/global/globalCssVariables.scss';
 import { MainViewModal } from '../client/views/MainViewModal';
 import { Doc, Opt } from '../fields/Doc';
 import { List } from '../fields/List';
-- 
cgit v1.2.3-70-g09d2


From 8bc17cecdfce184e5a426dc2332d3c9ad0406f58 Mon Sep 17 00:00:00 2001
From: vkalev <vjk1883@gmail.com>
Date: Sat, 10 Jul 2021 11:13:42 -0500
Subject: fixed adding point bug with breaking handle tangency

---
 src/client/documents/Documents.ts                  |   8 +-
 src/client/views/GestureOverlay.tsx                |   2 +-
 src/client/views/InkControls.tsx                   |  18 +-
 src/client/views/InkHandles.tsx                    |  27 +--
 src/client/views/InkStroke.tsx                     | 187 ---------------------
 src/client/views/InkStrokeProperties.ts            |  69 ++++++--
 src/client/views/InkingStroke.tsx                  | 187 +++++++++++++++++++++
 src/client/views/PropertiesButtons.tsx             |   4 +-
 src/client/views/collections/CollectionMenu.tsx    |   2 +-
 .../collectionFreeForm/CollectionFreeFormView.tsx  |   2 +-
 .../views/nodes/CollectionFreeFormDocumentView.tsx |   4 +-
 src/client/views/nodes/ColorBox.tsx                |   2 +-
 src/client/views/nodes/DocumentContentsView.tsx    |   4 +-
 src/client/views/nodes/DocumentView.tsx            |   6 +-
 14 files changed, 285 insertions(+), 237 deletions(-)
 delete mode 100644 src/client/views/InkStroke.tsx
 create mode 100644 src/client/views/InkingStroke.tsx

(limited to 'src')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 188fe31c0..24682cbd0 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -31,7 +31,7 @@ import { CollectionView, CollectionViewType } from "../views/collections/Collect
 import { ContextMenu } from "../views/ContextMenu";
 import { ContextMenuProps } from "../views/ContextMenuItem";
 import { DFLT_IMAGE_NATIVE_DIM } from "../views/globalCssVariables.scss";
-import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth, InkStroke } from "../views/InkStroke";
+import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth, InkingStroke } from "../views/InkingStroke";
 import { AudioBox } from "../views/nodes/AudioBox";
 import { ColorBox } from "../views/nodes/ColorBox";
 import { ComparisonBox } from "../views/nodes/ComparisonBox";
@@ -432,7 +432,7 @@ export namespace Docs {
                 options: { links: ComputedField.MakeFunction("links(self)") as any, hideLinkButton: true }
             }],
             [DocumentType.INK, {
-                layout: { view: InkStroke, dataField: defaultDataKey },
+                layout: { view: InkingStroke, dataField: defaultDataKey },
                 options: { _fontFamily: "cursive", backgroundColor: "transparent", links: ComputedField.MakeFunction("links(self)") as any }
             }],
             [DocumentType.SCREENSHOT, {
@@ -760,7 +760,7 @@ export namespace Docs {
             const I = new Doc();
             I[Initializing] = true;
             I.type = DocumentType.INK;
-            I.layout = InkStroke.LayoutString("data");
+            I.layout = InkingStroke.LayoutString("data");
             I.color = color;
             I.fillColor = fillColor;
             I.strokeWidth = Number(strokeWidth);
@@ -1144,7 +1144,7 @@ export namespace DocUtils {
             layout = AudioBox.LayoutString;
         } else if (field instanceof InkField) {
             created = Docs.Create.InkDocument(ActiveInkColor(), CurrentUserUtils.SelectedTool, ActiveInkWidth(), ActiveInkBezierApprox(), ActiveFillColor(), ActiveArrowStart(), ActiveArrowEnd(), ActiveDash(), (field).inkData, resolved);
-            layout = InkStroke.LayoutString;
+            layout = InkingStroke.LayoutString;
         } else if (field instanceof List && field[0] instanceof Doc) {
             created = Docs.Create.StackingDocument(DocListCast(field), resolved);
             layout = CollectionView.LayoutString;
diff --git a/src/client/views/GestureOverlay.tsx b/src/client/views/GestureOverlay.tsx
index 455b3a935..491bf18b2 100644
--- a/src/client/views/GestureOverlay.tsx
+++ b/src/client/views/GestureOverlay.tsx
@@ -17,7 +17,7 @@ import { Scripting } from "../util/Scripting";
 import { Transform } from "../util/Transform";
 import { CollectionFreeFormViewChrome } from "./collections/CollectionMenu";
 import "./GestureOverlay.scss";
-import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth, SetActiveArrowStart, SetActiveDash, SetActiveFillColor, SetActiveInkColor, SetActiveInkWidth } from "./InkStroke";
+import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth, SetActiveArrowStart, SetActiveDash, SetActiveFillColor, SetActiveInkColor, SetActiveInkWidth } from "./InkingStroke";
 import { DocumentView } from "./nodes/DocumentView";
 import { RadialMenu } from "./nodes/RadialMenu";
 import HorizontalPalette from "./Palette";
diff --git a/src/client/views/InkControls.tsx b/src/client/views/InkControls.tsx
index eeddfce4c..4d8b2c6b5 100644
--- a/src/client/views/InkControls.tsx
+++ b/src/client/views/InkControls.tsx
@@ -22,17 +22,17 @@ export class InkControls extends React.Component<InkControlProps> {
 
     /**
      * Handles the movement of a selected control point when the user clicks and drags.
-     * @param controlNum The index of the currently selected control point.
+     * @param controlIndex The index of the currently selected control point.
      */
     @action
-    onControlDown = (e: React.PointerEvent, controlNum: number): void => {
+    onControlDown = (e: React.PointerEvent, controlIndex: number): void => {
         if (InkStrokeProperties.Instance) {
             InkStrokeProperties.Instance.moveControl(0, 0, 1);
             const controlUndo = UndoManager.StartBatch("DocDecs set radius");
             const screenScale = this.props.ScreenToLocalTransform().Scale;
             setupMoveUpEvents(this, e,
                 (e: PointerEvent, down: number[], delta: number[]) => {
-                    InkStrokeProperties.Instance?.moveControl(-delta[0] * screenScale, -delta[1] * screenScale, controlNum);
+                    InkStrokeProperties.Instance?.moveControl(-delta[0] * screenScale, -delta[1] * screenScale, controlIndex);
                     return false;
                 },
                 () => controlUndo?.end(), emptyFunction);
@@ -60,12 +60,20 @@ export class InkControls extends React.Component<InkControlProps> {
         }
     }
 
+    /**
+     * Updates whether a user has hovered over a particular control point or point that could be added
+     * on click.
+     */
     @action onEnterControl = (i: number) => { this._overControl = i; };
     @action onLeaveControl = () => { this._overControl = -1; };
     @action onEnterAddPoint = (i: number) => { this._overAddPoint = i; };
     @action onLeaveAddPoint = () => { this._overAddPoint = -1; };
  
     render() {
+        const formatInstance = InkStrokeProperties.Instance;
+        if (!formatInstance) return (null);
+
+        // Accessing the current ink's data and extracting all control points.
         const data = this.props.data;
         const controlPoints: ControlPoint[] = [];
         if (data.length >= 4) {
@@ -87,7 +95,7 @@ export class InkControls extends React.Component<InkControlProps> {
                             r={strokeWidth / 2} 
                             stroke={this._overAddPoint === i ? "#1F85DE" : "transparent"} 
                             strokeWidth={dotsize / 4} fill={this._overAddPoint === i ? "#1F85DE" : "transparent"}
-                            onPointerDown={() => { InkStrokeProperties.Instance?.addPoints(pts.X, pts.Y, addedPoints, i, controlPoints); }} 
+                            onPointerDown={() => { formatInstance?.addPoints(pts.X, pts.Y, addedPoints, i, controlPoints); }} 
                             onMouseEnter={() => this.onEnterAddPoint(i)} 
                             onMouseLeave={this.onLeaveAddPoint} 
                             pointerEvents="all" 
@@ -103,7 +111,7 @@ export class InkControls extends React.Component<InkControlProps> {
                             height={this._overControl === i ? strokeWidth * 1.5 : strokeWidth} 
                             width={this._overControl === i ? strokeWidth * 1.5 : strokeWidth} 
                             strokeWidth={strokeWidth / 6} stroke="#1F85DE" 
-                            fill={InkStrokeProperties.Instance?._currentPoint === control.I ? "#1F85DE" : "white"}
+                            fill={formatInstance?._currentPoint === control.I ? "#1F85DE" : "white"}
                             onPointerDown={(e) => { this.changeCurrPoint(control.I); this.onControlDown(e, control.I); }} 
                             onMouseEnter={() => this.onEnterControl(i)} 
                             onMouseLeave={this.onLeaveControl} 
diff --git a/src/client/views/InkHandles.tsx b/src/client/views/InkHandles.tsx
index 993e427b3..a33380221 100644
--- a/src/client/views/InkHandles.tsx
+++ b/src/client/views/InkHandles.tsx
@@ -15,33 +15,38 @@ export interface InkControlProps {
 
 @observer
 export class InkHandles extends React.Component<InkControlProps> {
-    @observable private _brokenIndices: number[] = [];
-
     /**
      * Handles the movement of a selected handle point when the user clicks and drags.
      * @param handleNum The index of the currently selected handle point.
      */
-     onHandleDown = (e: React.PointerEvent, handleNum: number): void => {
+     onHandleDown = (e: React.PointerEvent, handleIndex: number): void => {
         if (InkStrokeProperties.Instance) {
             InkStrokeProperties.Instance.moveControl(0, 0, 1);
             const controlUndo = UndoManager.StartBatch("DocDecs set radius");
             const screenScale = this.props.ScreenToLocalTransform().Scale;
-            document.addEventListener("keydown", (e: KeyboardEvent) => this.onBreakTangent(e, handleNum), true);
+
+            const order = handleIndex % 4;
+            const oppositeHandleIndex = order === 1 ? handleIndex - 3 : handleIndex + 3;
+            const controlIndex = order === 1 ? handleIndex - 1 : handleIndex + 2;
+            document.addEventListener("keydown", (e: KeyboardEvent) => this.onBreakTangent(e, controlIndex), true);
             setupMoveUpEvents(this, e, (e: PointerEvent, down: number[], delta: number[]) => {
-                    InkStrokeProperties.Instance?.moveHandle(-delta[0] * screenScale, -delta[1] * screenScale, handleNum, this._brokenIndices);
+                    InkStrokeProperties.Instance?.moveHandle(-delta[0] * screenScale, -delta[1] * screenScale, handleIndex, oppositeHandleIndex, controlIndex);
                     return false;
                 }, () => controlUndo?.end(), emptyFunction
             );
         }
     }
 
+    /**
+     * Breaks tangent handle movement when ‘Alt’ key is held down. Adds the current handle index and 
+     * its matching (opposite) handle to a list of broken handle indices.
+     * @param handleNum The index of the currently selected handle point.
+     */
     @action
-    onBreakTangent = (e: KeyboardEvent, handleIndex: number) => {
+    onBreakTangent = (e: KeyboardEvent, controlIndex: number) => {
         if (["Alt"].includes(e.key)) {
-            const order = handleIndex % 4;
-            const oppositeHandleIndex = order === 1 ? handleIndex - 3 : handleIndex + 3;
-            if (!this._brokenIndices.includes(handleIndex) && !this._brokenIndices.includes(oppositeHandleIndex)) {
-                this._brokenIndices.push(handleIndex, oppositeHandleIndex);
+            if (!InkStrokeProperties.Instance?._brokenIndices.includes(controlIndex)) {
+                InkStrokeProperties.Instance?._brokenIndices.push(controlIndex);
             }
         }
     }
@@ -49,6 +54,8 @@ export class InkHandles extends React.Component<InkControlProps> {
     render() {
         const formatInstance = InkStrokeProperties.Instance;
         if (!formatInstance) return (null);
+
+        // Accessing the current ink's data and extracting all handle points and handle lines.
         const data = this.props.data;
         const handlePoints: HandlePoint[] = [];
         const handleLines: HandleLine[] = [];
diff --git a/src/client/views/InkStroke.tsx b/src/client/views/InkStroke.tsx
deleted file mode 100644
index 9ca8bdbea..000000000
--- a/src/client/views/InkStroke.tsx
+++ /dev/null
@@ -1,187 +0,0 @@
-import React = require("react");
-import { action, observable } from "mobx";
-import { observer } from "mobx-react";
-import { Doc } from "../../fields/Doc";
-import { documentSchema } from "../../fields/documentSchemas";
-import { InkData, InkField, InkTool, ControlPoint, HandlePoint, HandleLine } from "../../fields/InkField";
-import { makeInterface } from "../../fields/Schema";
-import { Cast, StrCast } from "../../fields/Types";
-import { TraceMobx } from "../../fields/util";
-import { setupMoveUpEvents, emptyFunction, returnFalse } from "../../Utils";
-import { CognitiveServices } from "../cognitive_services/CognitiveServices";
-import { InteractionUtils } from "../util/InteractionUtils";
-import { Scripting } from "../util/Scripting";
-import { UndoManager } from "../util/UndoManager";
-import { ContextMenu } from "./ContextMenu";
-import { ViewBoxBaseComponent } from "./DocComponent";
-import "./InkStroke.scss";
-import { FieldView, FieldViewProps } from "./nodes/FieldView";
-import { InkStrokeProperties } from "./InkStrokeProperties";
-import { CurrentUserUtils } from "../util/CurrentUserUtils";
-import { InkControls } from "./InkControls";
-import { InkHandles } from "./InkHandles";
-
-type InkDocument = makeInterface<[typeof documentSchema]>;
-const InkDocument = makeInterface(documentSchema);
-
-@observer
-export class InkStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocument>(InkDocument) {
-    static readonly MaskDim = 50000;
-    @observable private _properties?: InkStrokeProperties;
-
-    constructor(props: FieldViewProps & InkDocument) {
-        super(props);
-
-        this._properties = InkStrokeProperties.Instance;
-    }
-
-    public static LayoutString(fieldStr: string) { 
-        return FieldView.LayoutString(InkStroke, fieldStr); 
-    }
-
-    analyzeStrokes() {
-        const data: InkData = Cast(this.dataDoc[this.fieldKey], InkField)?.inkData ?? [];
-        CognitiveServices.Inking.Appliers.ConcatenateHandwriting(this.dataDoc, ["inkAnalysis", "handwriting"], [data]);
-    }
-
-    @action
-    public static toggleMask = (inkDoc: Doc) => {
-        inkDoc.isInkMask = !inkDoc.isInkMask;
-        inkDoc._backgroundColor = inkDoc.isInkMask ? "rgba(0,0,0,0.7)" : undefined;
-        inkDoc.mixBlendMode = inkDoc.isInkMask ? "hard-light" : undefined;
-        inkDoc.color = "#9b9b9bff";
-        inkDoc._stayInCollection = inkDoc.isInkMask ? true : undefined;
-    }
-
-    /**
-     * Handles the movement of the entire ink object when the user clicks and drags.
-     * @param e React Pointer Event.
-     */
-    onPointerDown = (e: React.PointerEvent) => {
-        if (this.props.isSelected(true)) {
-            setupMoveUpEvents(this, e, returnFalse, emptyFunction, 
-                action((e: PointerEvent, doubleTap: boolean | undefined) =>
-                doubleTap && this._properties && (this._properties._controlButton = true))
-            );
-        }
-    }
-
-    render() {
-        TraceMobx();
-
-        const data: InkData = Cast(this.dataDoc[this.fieldKey], InkField)?.inkData ?? [];
-        const strokeWidth = Number(this.layoutDoc.strokeWidth);
-        const lineTop = Math.min(...data.map(p => p.Y));
-        const lineBottom = Math.max(...data.map(p => p.Y));
-        const lineLeft = Math.min(...data.map(p => p.X));
-        const lineRight = Math.max(...data.map(p => p.X));
-        const left = lineLeft - strokeWidth / 2;
-        const top = lineTop - strokeWidth / 2;
-        const right = lineRight + strokeWidth / 2;
-        const bottom = lineBottom + strokeWidth / 2;
-        const width = Math.max(1, right - left);
-        const height = Math.max(1, bottom - top);
-        const scaleX = width === strokeWidth ? 1 : (this.props.PanelWidth() - strokeWidth) / (width - strokeWidth);
-        const scaleY = height === strokeWidth ? 1 : (this.props.PanelHeight() - strokeWidth) / (height - strokeWidth);
-        const strokeColor = StrCast(this.layoutDoc.color, "");
-        const dotsize = Math.max(width * scaleX, height * scaleY) / 40;
-
-        // Visually renders the polygonal line made by the user.
-        const inkLine = InteractionUtils.CreatePolyline(data, left, top, strokeColor, strokeWidth, strokeWidth, 
-            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"), 
-            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker), 
-            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", 
-            this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1, 
-            false);
-        const selectedLine = InteractionUtils.CreatePolyline(
-            data, lineLeft - strokeWidth * 3, lineTop - strokeWidth * 3, "#1F85DE", strokeWidth / 6, 
-            strokeWidth / 6,StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
-            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
-            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", 
-            this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1, 
-            false);
-        // Invisible polygonal line that enables the ink to be selected by the user.
-        const clickableLine = InteractionUtils.CreatePolyline(data, left, top, 
-            this.props.isSelected() && strokeWidth > 5 ? strokeColor : "transparent", strokeWidth, 
-            strokeWidth + 15, StrCast(this.layoutDoc.strokeBezier), 
-            StrCast(this.layoutDoc.fillColor, "none"), "none", "none", undefined, scaleX, scaleY, "", 
-            this.props.layerProvider?.(this.props.Document) === false ? "none" : "visiblepainted", false, true);
-        const addedPoints = InteractionUtils.CreatePoints(data, left, top, strokeColor, strokeWidth, strokeWidth,
-            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
-            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
-            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", 
-            this.props.isSelected() && strokeWidth <= 5, false);
-
-        return (
-            <svg className="inkStroke"
-                style={{
-                    pointerEvents: this.props.Document.isInkMask && this.props.layerProvider?.(this.props.Document) !== false ? "all" : "none",
-                    transform: this.props.Document.isInkMask ? `translate(${InkStroke.MaskDim / 2}px, ${InkStroke.MaskDim / 2}px)` : undefined,
-                    mixBlendMode: this.layoutDoc.tool === InkTool.Highlighter ? "multiply" : "unset",
-                    overflow: "visible",
-                }}
-                onPointerDown={this.onPointerDown}
-                onContextMenu={() => {
-                    const cm = ContextMenu.Instance;
-                    if (cm) {
-                        !Doc.UserDoc().noviceMode && cm.addItem({ description: "Recognize Writing", event: this.analyzeStrokes, icon: "paint-brush" });
-                        cm.addItem({ description: "Toggle Mask", event: () => InkStroke.toggleMask(this.rootDoc), icon: "paint-brush" });
-                        cm.addItem({ description: "Edit Points", event: action(() => {if (this._properties) { this._properties._controlButton = !this._properties._controlButton; }} ), icon: "paint-brush" });
-                    }
-                }}
-            >
-                
-                {clickableLine}
-                {inkLine}
-                {this.props.isSelected() ? selectedLine : ""}
-                {this.props.isSelected() && this._properties?._controlButton ? 
-                    <>
-                        <InkControls 
-                            data={data} 
-                            addedPoints={addedPoints} 
-                            format={[left, top, scaleX, scaleY, strokeWidth, dotsize]} 
-                            ScreenToLocalTransform={this.props.ScreenToLocalTransform} />
-                        <InkHandles 
-                            data={data} 
-                            format={[left, top, scaleX, scaleY, strokeWidth, dotsize]} 
-                            ScreenToLocalTransform={this.props.ScreenToLocalTransform} /> 
-                    </> : ""}
-            </svg>
-        );
-    }
-}
-
-
-export function SetActiveInkWidth(width: string): void { !isNaN(parseInt(width)) && ActiveInkPen() && (ActiveInkPen().activeInkWidth = width); }
-export function SetActiveBezierApprox(bezier: string): void { ActiveInkPen() && (ActiveInkPen().activeInkBezier = isNaN(parseInt(bezier)) ? "" : bezier); }
-export function SetActiveInkColor(value: string) { ActiveInkPen() && (ActiveInkPen().activeInkColor = value); }
-export function SetActiveFillColor(value: string) { ActiveInkPen() && (ActiveInkPen().activeFillColor = value); }
-export function SetActiveArrowStart(value: string) { ActiveInkPen() && (ActiveInkPen().activeArrowStart = value); }
-export function SetActiveArrowEnd(value: string) { ActiveInkPen() && (ActiveInkPen().activeArrowEnd = value); }
-export function SetActiveDash(dash: string): void { !isNaN(parseInt(dash)) && ActiveInkPen() && (ActiveInkPen().activeDash = dash); }
-export function ActiveInkPen(): Doc { return Doc.UserDoc(); }
-export function ActiveInkColor(): string { return StrCast(ActiveInkPen()?.activeInkColor, "black"); }
-export function ActiveFillColor(): string { return StrCast(ActiveInkPen()?.activeFillColor, ""); }
-export function ActiveArrowStart(): string { return StrCast(ActiveInkPen()?.activeArrowStart, ""); }
-export function ActiveArrowEnd(): string { return StrCast(ActiveInkPen()?.activeArrowEnd, ""); }
-export function ActiveDash(): string { return StrCast(ActiveInkPen()?.activeDash, "0"); }
-export function ActiveInkWidth(): string { return StrCast(ActiveInkPen()?.activeInkWidth, "1"); }
-export function ActiveInkBezierApprox(): string { return StrCast(ActiveInkPen()?.activeInkBezier); }
-Scripting.addGlobal(function activateBrush(pen: any, width: any, color: any, fill: any, arrowStart: any, arrowEnd: any, dash: any) {
-    CurrentUserUtils.SelectedTool = pen ? InkTool.Highlighter : InkTool.None;
-    SetActiveInkWidth(width);
-    SetActiveInkColor(color);
-    SetActiveFillColor(fill);
-    SetActiveArrowStart(arrowStart);
-    SetActiveArrowEnd(arrowEnd);
-    SetActiveDash(dash);
-});
-Scripting.addGlobal(function activateEraser(pen: any) { return CurrentUserUtils.SelectedTool = pen ? InkTool.Eraser : InkTool.None; });
-Scripting.addGlobal(function activateStamp(pen: any) { return CurrentUserUtils.SelectedTool = pen ? InkTool.Stamp : InkTool.None; });
-Scripting.addGlobal(function deactivateInk() { return CurrentUserUtils.SelectedTool = InkTool.None; });
-Scripting.addGlobal(function setInkWidth(width: any) { return SetActiveInkWidth(width); });
-Scripting.addGlobal(function setInkColor(color: any) { return SetActiveInkColor(color); });
-Scripting.addGlobal(function setFillColor(fill: any) { return SetActiveFillColor(fill); });
-Scripting.addGlobal(function setActiveArrowStart(arrowStart: any) { return SetActiveArrowStart(arrowStart); });
-Scripting.addGlobal(function setActiveArrowEnd(arrowEnd: any) { return SetActiveArrowStart(arrowEnd); });
-Scripting.addGlobal(function setActiveDash(dash: any) { return SetActiveDash(dash); });
diff --git a/src/client/views/InkStrokeProperties.ts b/src/client/views/InkStrokeProperties.ts
index 812e8ff6e..4ec03c560 100644
--- a/src/client/views/InkStrokeProperties.ts
+++ b/src/client/views/InkStrokeProperties.ts
@@ -1,7 +1,7 @@
 import { action, computed, observable } from "mobx";
 import { Doc, Field, Opt } from "../../fields/Doc";
 import { Document } from "../../fields/documentSchemas";
-import { InkField, InkData, PointData } from "../../fields/InkField";
+import { InkField, InkData, PointData, ControlPoint } from "../../fields/InkField";
 import { Cast, NumCast } from "../../fields/Types";
 import { DocumentType } from "../documents/DocumentTypes";
 import { SelectionManager } from "../util/SelectionManager";
@@ -13,6 +13,7 @@ export class InkStrokeProperties {
     @observable _lock = false;
     @observable _controlButton = false;
     @observable _currentPoint = -1;
+    @observable _brokenIndices: number[] = [];
 
     constructor() {
         InkStrokeProperties.Instance = this;
@@ -73,6 +74,7 @@ export class InkStrokeProperties {
     addPoints = (x: number, y: number, pts: { X: number, Y: number }[], index: number, control: { X: number, Y: number }[]) => {
         this.selectedInk?.forEach(action(inkView => {
             if (this.selectedInk?.length === 1) {
+                const newPoint = { X: x, Y: y };
                 const doc = Document(inkView.rootDoc);
                 if (doc.type === DocumentType.INK) {
                     const ink = Cast(doc.data, InkField)?.inkData;
@@ -88,12 +90,25 @@ export class InkStrokeProperties {
                         for (var i = 0; i < spNum; i++) {
                             ink[i] && newPoints.push({ X: ink[i].X, Y: ink[i].Y });
                         }
-                        for (var j = 0; j < 4; j++) {
-                            newPoints.push({ X: x, Y: y });
 
-                        }
+                        // Updating the indices of the control points whose handle tangency has been broken.
+                        this._brokenIndices = this._brokenIndices.map((control) => { 
+                            if (control >= spNum) {
+                                return control + 4; 
+                            } else {
+                                return control;
+                            }
+                        });
+
+                        // const [handleA, handleB] = this.getNewHandlePoints(newPoint, pts[index-1], pts[index+1]);
+                        newPoints.push(newPoint);
+                        newPoints.push(newPoint);
+                        newPoints.push(newPoint);
+                        newPoints.push(newPoint);
+
                         for (var i = spNum; i < ink.length; i++) {
                             newPoints.push({ X: ink[i].X, Y: ink[i].Y });
+
                         }
                         this._currentPoint = -1;
                         Doc.GetProto(doc).data = new InkField(newPoints);
@@ -103,6 +118,20 @@ export class InkStrokeProperties {
         }));
     }
 
+    getNewHandlePoints = (newControl: PointData, a: PointData, b: PointData) => {
+        // find midpoint between the left and right control point of new control
+        // rotate midpoint by +-pi/2 to get new handle points
+        // multiplying x-y coordinates of both by 10/L where L is its current magnitude
+        const angle = this.angleChange(a, b, newControl);
+        const midpoint = this.rotatePoint(a, newControl, angle/2);
+        // const handleA = this.rotatePoint(midpoint, newControl, -Math.PI/2);
+        // const handleB = this.rotatePoint(midpoint, newControl, -Math.PI/2);
+        const handleA = { X: midpoint.X + (20 * Math.cos(-Math.PI/2)), Y: midpoint.Y + (20 * Math.sin(-Math.PI/2)) };
+        const handleB = { X: midpoint.X + (20 * Math.cos(Math.PI/2)), Y: midpoint.Y + (20 * Math.sin(Math.PI/2)) };
+
+        return [handleA, handleB];
+    }
+
     /**
      * Deletes the points of the current ink instance.
      * @returns The changed x- and y-coordinates of the control points.
@@ -195,23 +224,27 @@ export class InkStrokeProperties {
         return target;
     }
 
+    angleBetweenTwoVectors = (vectorA: PointData, vectorB: PointData) => {
+        const magnitudeA = Math.sqrt(vectorA.X * vectorA.X + vectorA.Y * vectorA.Y);
+        const magnitudeB = Math.sqrt(vectorB.X * vectorB.X + vectorB.Y * vectorB.Y);
+        // Normalizing the vectors.
+        vectorA = { X: vectorA.X / magnitudeA, Y: vectorA.Y / magnitudeA };
+        vectorB = { X: vectorB.X / magnitudeB, Y: vectorB.Y / magnitudeB };
+        const dotProduct = vectorB.X * vectorA.X + vectorB.Y * vectorA.Y;
+        return Math.acos(dotProduct);
+    }
+
     /**
      * Finds the angle difference (in radians) between two vectors relative to an arbitrary origin.
      */
     angleChange = (a: PointData, b: PointData, origin: PointData) => {
         // Finding vector representation of inputted points relative to new origin.
-        let vectorA = { X: a.X - origin.X, Y: a.Y - origin.Y };
-        let vectorB = { X: b.X - origin.X, Y: b.Y - origin.Y };
+        const vectorA = { X: a.X - origin.X, Y: a.Y - origin.Y };
+        const vectorB = { X: b.X - origin.X, Y: b.Y - origin.Y };
         const crossProduct = vectorB.X * vectorA.Y - vectorB.Y * vectorA.X;
         // Determining whether rotation is clockwise or counterclockwise.
         const sign = crossProduct < 0 ? 1 : -1;
-        const magnitudeA = Math.sqrt(vectorA.X * vectorA.X + vectorA.Y * vectorA.Y);
-        const magnitudeB = Math.sqrt(vectorB.X * vectorB.X + vectorB.Y * vectorB.Y);
-        // Normalizing the vectors.
-        vectorA = { X: vectorA.X / magnitudeA, Y: vectorA.Y / magnitudeA };
-        vectorB = { X: vectorB.X / magnitudeB, Y: vectorB.Y / magnitudeB };
-        const dotProduct = vectorB.X * vectorA.X + vectorB.Y * vectorA.Y;
-        const theta = Math.acos(dotProduct);
+        const theta = this.angleBetweenTwoVectors(vectorA, vectorB);
         return sign * theta;
     }
 
@@ -220,20 +253,20 @@ export class InkStrokeProperties {
      */
     @undoBatch
     @action
-    moveHandle = (deltaX: number, deltaY: number, handleIndex: number, brokenIndices: number[]) =>
+    moveHandle = (deltaX: number, deltaY: number, handleIndex: number, oppositeHandleIndex: number, controlIndex: number) =>
         this.applyFunction((doc: Doc, ink: InkData, xScale: number, yScale: number) => {
             const order = handleIndex % 4;
             const oldHandlePoint = ink[handleIndex];
+            let oppositeHandlePoint = ink[oppositeHandleIndex];
+            const controlPoint = ink[controlIndex];
             const newHandlePoint = { X: ink[handleIndex].X - deltaX / xScale, Y: ink[handleIndex].Y - deltaY / yScale };
             ink[handleIndex] = newHandlePoint;
             
             // Rotate opposite handle if user hasn't held 'Alt' key or not first/final control (which have only 1 handle).
-            if (!brokenIndices.includes(handleIndex) && handleIndex !== 1 && handleIndex !== ink.length - 2) {
-                let oppositeHandlePoint = order === 1 ? ink[handleIndex - 3] : ink[handleIndex + 3];
-                const controlPoint = order === 1 ? ink[handleIndex - 1] : ink[handleIndex + 1];
+            if (!this._brokenIndices.includes(controlIndex) && handleIndex !== 1 && handleIndex !== ink.length - 2) {
                 const angle = this.angleChange(oldHandlePoint, newHandlePoint, controlPoint);
                 oppositeHandlePoint = this.rotatePoint(oppositeHandlePoint, controlPoint, angle);
-                order === 1 ? ink[handleIndex - 3] = oppositeHandlePoint : ink[handleIndex + 3] = oppositeHandlePoint;
+                ink[oppositeHandleIndex] = oppositeHandlePoint;
             }
 
             return ink;
diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx
new file mode 100644
index 000000000..b630c20cc
--- /dev/null
+++ b/src/client/views/InkingStroke.tsx
@@ -0,0 +1,187 @@
+import React = require("react");
+import { action, observable } from "mobx";
+import { observer } from "mobx-react";
+import { Doc } from "../../fields/Doc";
+import { documentSchema } from "../../fields/documentSchemas";
+import { InkData, InkField, InkTool } from "../../fields/InkField";
+import { makeInterface } from "../../fields/Schema";
+import { Cast, StrCast } from "../../fields/Types";
+import { TraceMobx } from "../../fields/util";
+import { setupMoveUpEvents, emptyFunction, returnFalse } from "../../Utils";
+import { CognitiveServices } from "../cognitive_services/CognitiveServices";
+import { InteractionUtils } from "../util/InteractionUtils";
+import { Scripting } from "../util/Scripting";
+import { ContextMenu } from "./ContextMenu";
+import { ViewBoxBaseComponent } from "./DocComponent";
+import "./InkStroke.scss";
+import { FieldView, FieldViewProps } from "./nodes/FieldView";
+import { InkStrokeProperties } from "./InkStrokeProperties";
+import { CurrentUserUtils } from "../util/CurrentUserUtils";
+import { InkControls } from "./InkControls";
+import { InkHandles } from "./InkHandles";
+
+type InkDocument = makeInterface<[typeof documentSchema]>;
+const InkDocument = makeInterface(documentSchema);
+
+@observer
+export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocument>(InkDocument) {
+    static readonly MaskDim = 50000;
+    @observable private _properties?: InkStrokeProperties;
+
+    constructor(props: FieldViewProps & InkDocument) {
+        super(props);
+
+        this._properties = InkStrokeProperties.Instance;
+    }
+
+    public static LayoutString(fieldStr: string) { 
+        return FieldView.LayoutString(InkingStroke, fieldStr); 
+    }
+
+    analyzeStrokes() {
+        const data: InkData = Cast(this.dataDoc[this.fieldKey], InkField)?.inkData ?? [];
+        CognitiveServices.Inking.Appliers.ConcatenateHandwriting(this.dataDoc, ["inkAnalysis", "handwriting"], [data]);
+    }
+
+    @action
+    public static toggleMask = (inkDoc: Doc) => {
+        inkDoc.isInkMask = !inkDoc.isInkMask;
+        inkDoc._backgroundColor = inkDoc.isInkMask ? "rgba(0,0,0,0.7)" : undefined;
+        inkDoc.mixBlendMode = inkDoc.isInkMask ? "hard-light" : undefined;
+        inkDoc.color = "#9b9b9bff";
+        inkDoc._stayInCollection = inkDoc.isInkMask ? true : undefined;
+    }
+
+    /**
+     * Handles the movement of the entire ink object when the user clicks and drags.
+     */
+    onPointerDown = (e: React.PointerEvent) => {
+        if (this.props.isSelected(true)) {
+            setupMoveUpEvents(this, e, returnFalse, emptyFunction, 
+                action((e: PointerEvent, doubleTap: boolean | undefined) =>
+                doubleTap && this._properties && (this._properties._controlButton = true))
+            );
+        }
+    }
+
+    render() {
+        TraceMobx();
+        // Extracting the ink data and formatting information of the current ink stroke.
+        const data: InkData = Cast(this.dataDoc[this.fieldKey], InkField)?.inkData ?? [];
+        const strokeWidth = Number(this.layoutDoc.strokeWidth);
+        const lineTop = Math.min(...data.map(p => p.Y));
+        const lineBottom = Math.max(...data.map(p => p.Y));
+        const lineLeft = Math.min(...data.map(p => p.X));
+        const lineRight = Math.max(...data.map(p => p.X));
+        const left = lineLeft - strokeWidth / 2;
+        const top = lineTop - strokeWidth / 2;
+        const right = lineRight + strokeWidth / 2;
+        const bottom = lineBottom + strokeWidth / 2;
+        const width = Math.max(1, right - left);
+        const height = Math.max(1, bottom - top);
+        const scaleX = width === strokeWidth ? 1 : (this.props.PanelWidth() - strokeWidth) / (width - strokeWidth);
+        const scaleY = height === strokeWidth ? 1 : (this.props.PanelHeight() - strokeWidth) / (height - strokeWidth);
+        const strokeColor = StrCast(this.layoutDoc.color, "");
+        const dotsize = Math.max(width * scaleX, height * scaleY) / 40;
+
+        // Visually renders the polygonal line made by the user.
+        const inkLine = InteractionUtils.CreatePolyline(data, left, top, strokeColor, strokeWidth, strokeWidth, 
+            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"), 
+            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker), 
+            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", 
+            this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1, 
+            false);
+        // Thin blue line indicating that the current ink stroke is selected.
+        const selectedLine = InteractionUtils.CreatePolyline(
+            data, lineLeft - strokeWidth * 3, lineTop - strokeWidth * 3, "#1F85DE", strokeWidth / 6, 
+            strokeWidth / 6,StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
+            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
+            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", 
+            this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1, 
+            false);
+        // Invisible polygonal line that enables the ink to be selected by the user.
+        const clickableLine = InteractionUtils.CreatePolyline(data, left, top, 
+            this.props.isSelected() && strokeWidth > 5 ? strokeColor : "transparent", strokeWidth, 
+            strokeWidth + 15, StrCast(this.layoutDoc.strokeBezier), 
+            StrCast(this.layoutDoc.fillColor, "none"), "none", "none", undefined, scaleX, scaleY, "", 
+            this.props.layerProvider?.(this.props.Document) === false ? "none" : "visiblepainted", false, true);
+        // Set of points rendered upon the ink that can be added if a user clicks on one.
+        const addedPoints = InteractionUtils.CreatePoints(data, left, top, strokeColor, strokeWidth, strokeWidth,
+            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
+            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
+            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", 
+            this.props.isSelected() && strokeWidth <= 5, false);
+
+        return (
+            <svg className="inkStroke"
+                style={{
+                    pointerEvents: this.props.Document.isInkMask && this.props.layerProvider?.(this.props.Document) !== false ? "all" : "none",
+                    transform: this.props.Document.isInkMask ? `translate(${InkingStroke.MaskDim / 2}px, ${InkingStroke.MaskDim / 2}px)` : undefined,
+                    mixBlendMode: this.layoutDoc.tool === InkTool.Highlighter ? "multiply" : "unset",
+                    overflow: "visible",
+                }}
+                onPointerDown={this.onPointerDown}
+                onContextMenu={() => {
+                    const cm = ContextMenu.Instance;
+                    if (cm) {
+                        !Doc.UserDoc().noviceMode && cm.addItem({ description: "Recognize Writing", event: this.analyzeStrokes, icon: "paint-brush" });
+                        cm.addItem({ description: "Toggle Mask", event: () => InkingStroke.toggleMask(this.rootDoc), icon: "paint-brush" });
+                        cm.addItem({ description: "Edit Points", event: action(() => {if (this._properties) { this._properties._controlButton = !this._properties._controlButton; }} ), icon: "paint-brush" });
+                    }
+                }}
+            >
+                
+                {clickableLine}
+                {inkLine}
+                {this.props.isSelected() ? selectedLine : ""}
+                {this.props.isSelected() && this._properties?._controlButton ? 
+                    <>
+                        <InkControls 
+                            data={data} 
+                            addedPoints={addedPoints} 
+                            format={[left, top, scaleX, scaleY, strokeWidth, dotsize]} 
+                            ScreenToLocalTransform={this.props.ScreenToLocalTransform} />
+                        <InkHandles 
+                            data={data} 
+                            format={[left, top, scaleX, scaleY, strokeWidth, dotsize]} 
+                            ScreenToLocalTransform={this.props.ScreenToLocalTransform} /> 
+                    </> : ""}
+            </svg>
+        );
+    }
+}
+
+
+export function SetActiveInkWidth(width: string): void { !isNaN(parseInt(width)) && ActiveInkPen() && (ActiveInkPen().activeInkWidth = width); }
+export function SetActiveBezierApprox(bezier: string): void { ActiveInkPen() && (ActiveInkPen().activeInkBezier = isNaN(parseInt(bezier)) ? "" : bezier); }
+export function SetActiveInkColor(value: string) { ActiveInkPen() && (ActiveInkPen().activeInkColor = value); }
+export function SetActiveFillColor(value: string) { ActiveInkPen() && (ActiveInkPen().activeFillColor = value); }
+export function SetActiveArrowStart(value: string) { ActiveInkPen() && (ActiveInkPen().activeArrowStart = value); }
+export function SetActiveArrowEnd(value: string) { ActiveInkPen() && (ActiveInkPen().activeArrowEnd = value); }
+export function SetActiveDash(dash: string): void { !isNaN(parseInt(dash)) && ActiveInkPen() && (ActiveInkPen().activeDash = dash); }
+export function ActiveInkPen(): Doc { return Doc.UserDoc(); }
+export function ActiveInkColor(): string { return StrCast(ActiveInkPen()?.activeInkColor, "black"); }
+export function ActiveFillColor(): string { return StrCast(ActiveInkPen()?.activeFillColor, ""); }
+export function ActiveArrowStart(): string { return StrCast(ActiveInkPen()?.activeArrowStart, ""); }
+export function ActiveArrowEnd(): string { return StrCast(ActiveInkPen()?.activeArrowEnd, ""); }
+export function ActiveDash(): string { return StrCast(ActiveInkPen()?.activeDash, "0"); }
+export function ActiveInkWidth(): string { return StrCast(ActiveInkPen()?.activeInkWidth, "1"); }
+export function ActiveInkBezierApprox(): string { return StrCast(ActiveInkPen()?.activeInkBezier); }
+Scripting.addGlobal(function activateBrush(pen: any, width: any, color: any, fill: any, arrowStart: any, arrowEnd: any, dash: any) {
+    CurrentUserUtils.SelectedTool = pen ? InkTool.Highlighter : InkTool.None;
+    SetActiveInkWidth(width);
+    SetActiveInkColor(color);
+    SetActiveFillColor(fill);
+    SetActiveArrowStart(arrowStart);
+    SetActiveArrowEnd(arrowEnd);
+    SetActiveDash(dash);
+});
+Scripting.addGlobal(function activateEraser(pen: any) { return CurrentUserUtils.SelectedTool = pen ? InkTool.Eraser : InkTool.None; });
+Scripting.addGlobal(function activateStamp(pen: any) { return CurrentUserUtils.SelectedTool = pen ? InkTool.Stamp : InkTool.None; });
+Scripting.addGlobal(function deactivateInk() { return CurrentUserUtils.SelectedTool = InkTool.None; });
+Scripting.addGlobal(function setInkWidth(width: any) { return SetActiveInkWidth(width); });
+Scripting.addGlobal(function setInkColor(color: any) { return SetActiveInkColor(color); });
+Scripting.addGlobal(function setFillColor(fill: any) { return SetActiveFillColor(fill); });
+Scripting.addGlobal(function setActiveArrowStart(arrowStart: any) { return SetActiveArrowStart(arrowStart); });
+Scripting.addGlobal(function setActiveArrowEnd(arrowEnd: any) { return SetActiveArrowStart(arrowEnd); });
+Scripting.addGlobal(function setActiveDash(dash: any) { return SetActiveDash(dash); });
diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx
index 920244463..5c41a96d0 100644
--- a/src/client/views/PropertiesButtons.tsx
+++ b/src/client/views/PropertiesButtons.tsx
@@ -11,7 +11,7 @@ import { DocumentType } from '../documents/DocumentTypes';
 import { SelectionManager } from '../util/SelectionManager';
 import { undoBatch } from '../util/UndoManager';
 import { CollectionViewType } from './collections/CollectionView';
-import { InkStroke } from './InkStroke';
+import { InkingStroke } from './InkingStroke';
 import { DocumentView } from './nodes/DocumentView';
 import './PropertiesButtons.scss';
 import React = require("react");
@@ -56,7 +56,7 @@ export class PropertiesButtons extends React.Component<{}, {}> {
         return this.propertyToggleBtn("Dictate", "_showAudio", on => `${on ? "Hide" : "Show"} dictation/recording controls`, on => "microphone");
     }
     @computed get maskButton() {
-        return this.propertyToggleBtn("Mask", "isInkMask", on => on ? "Make plain ink" : "Make highlight mask", on => "paint-brush", (dv, doc) => InkStroke.toggleMask(dv?.layoutDoc || doc));
+        return this.propertyToggleBtn("Mask", "isInkMask", on => on ? "Make plain ink" : "Make highlight mask", on => "paint-brush", (dv, doc) => InkingStroke.toggleMask(dv?.layoutDoc || doc));
     }
     @computed get clustersButton() {
         return this.propertyToggleBtn("Clusters", "_useClusters", on => `${on ? "Hide" : "Show"} clusters`, on => "braille");
diff --git a/src/client/views/collections/CollectionMenu.tsx b/src/client/views/collections/CollectionMenu.tsx
index 65061d260..6e6fabd0d 100644
--- a/src/client/views/collections/CollectionMenu.tsx
+++ b/src/client/views/collections/CollectionMenu.tsx
@@ -25,7 +25,7 @@ import { undoBatch } from "../../util/UndoManager";
 import { AntimodeMenu, AntimodeMenuProps } from "../AntimodeMenu";
 import { EditableView } from "../EditableView";
 import { GestureOverlay } from "../GestureOverlay";
-import { ActiveFillColor, ActiveInkColor, SetActiveArrowEnd, SetActiveArrowStart, SetActiveBezierApprox, SetActiveFillColor, SetActiveInkColor, SetActiveInkWidth, ActiveArrowStart, ActiveArrowEnd } from "../InkStroke";
+import { ActiveFillColor, ActiveInkColor, SetActiveArrowEnd, SetActiveArrowStart, SetActiveBezierApprox, SetActiveFillColor, SetActiveInkColor, SetActiveInkWidth, ActiveArrowStart, ActiveArrowEnd } from "../InkingStroke";
 import { CollectionFreeFormDocumentView } from "../nodes/CollectionFreeFormDocumentView";
 import { DocumentView } from "../nodes/DocumentView";
 import { RichTextMenu } from "../nodes/formattedText/RichTextMenu";
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index 9e81a6cda..accb80c5a 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -32,7 +32,7 @@ import { COLLECTION_BORDER_WIDTH } from "../../../views/globalCssVariables.scss"
 import { Timeline } from "../../animationtimeline/Timeline";
 import { ContextMenu } from "../../ContextMenu";
 import { DocumentDecorations } from "../../DocumentDecorations";
-import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth } from "../../InkStroke";
+import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth } from "../../InkingStroke";
 import { LightboxView } from "../../LightboxView";
 import { CollectionFreeFormDocumentView } from "../../nodes/CollectionFreeFormDocumentView";
 import { DocFocusOptions, DocumentView, DocumentViewProps, ViewAdjustment, ViewSpecPrefix } from "../../nodes/DocumentView";
diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
index 744a9c5de..092823603 100644
--- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
+++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
@@ -13,7 +13,7 @@ import { SelectionManager } from "../../util/SelectionManager";
 import { Transform } from "../../util/Transform";
 import { CollectionFreeFormView } from "../collections/collectionFreeForm/CollectionFreeFormView";
 import { DocComponent } from "../DocComponent";
-import { InkStroke } from "../InkStroke";
+import { InkingStroke } from "../InkingStroke";
 import { StyleProp } from "../StyleProvider";
 import "./CollectionFreeFormDocumentView.scss";
 import { DocumentView, DocumentViewProps } from "./DocumentView";
@@ -38,7 +38,7 @@ export class CollectionFreeFormDocumentView extends DocComponent<CollectionFreeF
     @observable _animPos: number[] | undefined = undefined;
     @observable _contentView: DocumentView | undefined | null;
     get displayName() { return "CollectionFreeFormDocumentView(" + this.rootDoc.title + ")"; } // this makes mobx trace() statements more descriptive
-    get maskCentering() { return this.props.Document.isInkMask ? InkStroke.MaskDim / 2 : 0; }
+    get maskCentering() { return this.props.Document.isInkMask ? InkingStroke.MaskDim / 2 : 0; }
     get transform() { return `translate(${this.X - this.maskCentering}px, ${this.Y - this.maskCentering}px) rotate(${this.props.jitterRotation}deg)`; }
     get X() { return this.dataProvider ? this.dataProvider.x : (this.Document.x || 0); }
     get Y() { return this.dataProvider ? this.dataProvider.y : (this.Document.y || 0); }
diff --git a/src/client/views/nodes/ColorBox.tsx b/src/client/views/nodes/ColorBox.tsx
index 2d466763b..8da5cd1b1 100644
--- a/src/client/views/nodes/ColorBox.tsx
+++ b/src/client/views/nodes/ColorBox.tsx
@@ -12,7 +12,7 @@ import { CurrentUserUtils } from "../../util/CurrentUserUtils";
 import { SelectionManager } from "../../util/SelectionManager";
 import { undoBatch } from "../../util/UndoManager";
 import { ViewBoxBaseComponent } from "../DocComponent";
-import { ActiveInkColor, ActiveInkWidth, SetActiveInkColor, SetActiveInkWidth } from "../InkStroke";
+import { ActiveInkColor, ActiveInkWidth, SetActiveInkColor, SetActiveInkWidth } from "../InkingStroke";
 import "./ColorBox.scss";
 import { FieldView, FieldViewProps } from './FieldView';
 import { RichTextMenu } from "./formattedText/RichTextMenu";
diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx
index 5da3a52d5..f0a54e4ac 100644
--- a/src/client/views/nodes/DocumentContentsView.tsx
+++ b/src/client/views/nodes/DocumentContentsView.tsx
@@ -10,7 +10,7 @@ import { CollectionDockingView } from "../collections/CollectionDockingView";
 import { CollectionFreeFormView } from "../collections/collectionFreeForm/CollectionFreeFormView";
 import { CollectionSchemaView } from "../collections/CollectionSchemaView";
 import { CollectionView } from "../collections/CollectionView";
-import { InkStroke } from "../InkStroke";
+import { InkingStroke } from "../InkingStroke";
 import { PresElementBox } from "../presentationview/PresElementBox";
 import { SearchBox } from "../search/SearchBox";
 import { DashWebRTCVideo } from "../webcam/DashWebRTCVideo";
@@ -224,7 +224,7 @@ export class DocumentContentsView extends React.Component<DocumentViewProps & Fo
                     FormattedTextBox, ImageBox, DirectoryImportBox, FontIconBox, LabelBox, EquationBox, SliderBox, FieldView,
                     CollectionFreeFormView, CollectionDockingView, CollectionSchemaView, CollectionView, WebBox, KeyValueBox,
                     PDFBox, VideoBox, AudioBox, PresBox, YoutubeBox, PresElementBox, SearchBox, FilterBox, FunctionPlotBox,
-                    ColorBox, DashWebRTCVideo, LinkAnchorBox, InkStroke, LinkBox, ScriptingBox,
+                    ColorBox, DashWebRTCVideo, LinkAnchorBox, InkingStroke, LinkBox, ScriptingBox,
                     ScreenshotBox,
                     HTMLtag, ComparisonBox
                 }}
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 924b0e7d3..b861669f8 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -34,7 +34,7 @@ import { ContextMenu } from "../ContextMenu";
 import { ContextMenuProps } from '../ContextMenuItem';
 import { DocComponent } from "../DocComponent";
 import { EditableView } from '../EditableView';
-import { InkStroke } from "../InkStroke";
+import { InkingStroke } from "../InkingStroke";
 import { LightboxView } from "../LightboxView";
 import { StyleLayers, StyleProp } from "../StyleProvider";
 import { CollectionFreeFormDocumentView } from "./CollectionFreeFormDocumentView";
@@ -1138,8 +1138,8 @@ export class DocumentView extends React.Component<DocumentViewProps> {
 
     render() {
         TraceMobx();
-        const xshift = () => (this.props.Document.isInkMask ? InkStroke.MaskDim : Math.abs(this.Xshift) <= 0.001 ? this.props.PanelWidth() : undefined);
-        const yshift = () => (this.props.Document.isInkMask ? InkStroke.MaskDim : Math.abs(this.Yshift) <= 0.001 ? this.props.PanelHeight() : undefined);
+        const xshift = () => (this.props.Document.isInkMask ? InkingStroke.MaskDim : Math.abs(this.Xshift) <= 0.001 ? this.props.PanelWidth() : undefined);
+        const yshift = () => (this.props.Document.isInkMask ? InkingStroke.MaskDim : Math.abs(this.Yshift) <= 0.001 ? this.props.PanelHeight() : undefined);
         return (<div className="contentFittingDocumentView">
             {!this.props.Document || !this.props.PanelWidth() ? (null) : (
                 <div className="contentFittingDocumentView-previewDoc" ref={this.ContentRef}
-- 
cgit v1.2.3-70-g09d2


From dda6b85a142f5b47cb01e63777cc031aa556d491 Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Sat, 10 Jul 2021 15:51:32 -0400
Subject: Seperated a file into two for organizaitonal purposes

---
 .../schemaView/CollectionSchemaMovableColumn.tsx   | 261 +++++++++++++++++++++
 .../schemaView/CollectionSchemaMovableRow.tsx      | 147 ++++++++++++
 .../schemaView/CollectionSchemaMovableTableHOC.tsx | 261 ---------------------
 .../views/collections/schemaView/SchemaTable.tsx   |   3 +-
 4 files changed, 410 insertions(+), 262 deletions(-)
 create mode 100644 src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
 create mode 100644 src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx
 delete mode 100644 src/client/views/collections/schemaView/CollectionSchemaMovableTableHOC.tsx

(limited to 'src')

diff --git a/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx b/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
new file mode 100644
index 000000000..e1066caf4
--- /dev/null
+++ b/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
@@ -0,0 +1,261 @@
+import React = require("react");
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action } from "mobx";
+import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
+import { Doc } from "../../../../fields/Doc";
+import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { Cast, FieldValue, StrCast } from "../../../../fields/Types";
+import { DocumentManager } from "../../../util/DocumentManager";
+import { DragManager, dropActionType, SetupDrag } from "../../../util/DragManager";
+import { SnappingManager } from "../../../util/SnappingManager";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { ContextMenu } from "../../ContextMenu";
+import "./CollectionSchemaView.scss";
+
+export interface MovableColumnProps {
+    columnRenderer: TableCellRenderer;
+    columnValue: SchemaHeaderField;
+    allColumns: SchemaHeaderField[];
+    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columns: SchemaHeaderField[]) => void;
+    ScreenToLocalTransform: () => Transform;
+}
+export class MovableColumn extends React.Component<MovableColumnProps> {
+    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
+    private _colDropDisposer?: DragManager.DragDropDisposer;
+    private _startDragPosition: { x: number, y: number } = { x: 0, y: 0 };
+    private _sensitivity: number = 16;
+    private _dragRef: React.RefObject<HTMLDivElement> = React.createRef();
+
+    onPointerEnter = (e: React.PointerEvent): void => {
+        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
+            this._header!.current!.className = "collectionSchema-col-wrapper";
+            document.addEventListener("pointermove", this.onDragMove, true);
+        }
+    }
+    onPointerLeave = (e: React.PointerEvent): void => {
+        this._header!.current!.className = "collectionSchema-col-wrapper";
+        document.removeEventListener("pointermove", this.onDragMove, true);
+        !e.buttons && document.removeEventListener("pointermove", this.onPointerMove);
+    }
+    onDragMove = (e: PointerEvent): void => {
+        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
+        const before = x[0] < bounds[0];
+        this._header!.current!.className = "collectionSchema-col-wrapper";
+        if (before) this._header!.current!.className += " col-before";
+        if (!before) this._header!.current!.className += " col-after";
+        e.stopPropagation();
+    }
+
+    createColDropTarget = (ele: HTMLDivElement) => {
+        this._colDropDisposer?.();
+        if (ele) {
+            this._colDropDisposer = DragManager.MakeDropTarget(ele, this.colDrop.bind(this));
+        }
+    }
+
+    colDrop = (e: Event, de: DragManager.DropEvent) => {
+        document.removeEventListener("pointermove", this.onDragMove, true);
+        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
+        const before = x[0] < bounds[0];
+        const colDragData = de.complete.columnDragData;
+        if (colDragData) {
+            e.stopPropagation();
+            this.props.reorderColumns(colDragData.colKey, this.props.columnValue, before, this.props.allColumns);
+            return true;
+        }
+        return false;
+    }
+
+    onPointerMove = (e: PointerEvent) => {
+        const onRowMove = (e: PointerEvent) => {
+            e.stopPropagation();
+            e.preventDefault();
+
+            document.removeEventListener("pointermove", onRowMove);
+            document.removeEventListener('pointerup', onRowUp);
+            const dragData = new DragManager.ColumnDragData(this.props.columnValue);
+            DragManager.StartColumnDrag(this._dragRef.current!, dragData, e.x, e.y);
+        };
+        const onRowUp = (): void => {
+            document.removeEventListener("pointermove", onRowMove);
+            document.removeEventListener('pointerup', onRowUp);
+        };
+        if (e.buttons === 1) {
+            const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX - this._startDragPosition.x, e.clientY - this._startDragPosition.y);
+            if (Math.abs(dx) + Math.abs(dy) > this._sensitivity) {
+                document.removeEventListener("pointermove", this.onPointerMove);
+                e.stopPropagation();
+
+                document.addEventListener("pointermove", onRowMove);
+                document.addEventListener("pointerup", onRowUp);
+            }
+        }
+    }
+
+    onPointerUp = (e: React.PointerEvent) => {
+        document.removeEventListener("pointermove", this.onPointerMove);
+    }
+
+    @action
+    onPointerDown = (e: React.PointerEvent, ref: React.RefObject<HTMLDivElement>) => {
+        this._dragRef = ref;
+        const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX, e.clientY);
+        if (!(e.target as any)?.tagName.includes("INPUT")) {
+            this._startDragPosition = { x: dx, y: dy };
+            document.addEventListener("pointermove", this.onPointerMove);
+        }
+    }
+
+
+    render() {
+        const reference = React.createRef<HTMLDivElement>();
+
+        return (
+            <div className="collectionSchema-col" ref={this.createColDropTarget}>
+                <div className="collectionSchema-col-wrapper" ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
+                    <div className="col-dragger" ref={reference} onPointerDown={e => this.onPointerDown(e, reference)} onPointerUp={this.onPointerUp}>
+                        {this.props.columnRenderer}
+                    </div>
+                </div>
+            </div>
+        );
+    }
+}
+
+export interface MovableRowProps {
+    rowInfo: RowInfo;
+    ScreenToLocalTransform: () => Transform;
+    addDoc: (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => boolean;
+    removeDoc: (doc: Doc | Doc[]) => boolean;
+    rowFocused: boolean;
+    textWrapRow: (doc: Doc) => void;
+    rowWrapped: boolean;
+    dropAction: string;
+    addDocTab: any;
+}
+
+export class MovableRow extends React.Component<MovableRowProps> {
+    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
+    private _rowDropDisposer?: DragManager.DragDropDisposer;
+
+    // Event listeners are only necessary when the user is hovering over the table
+    // Create one when the mouse starts hovering...
+    onPointerEnter = (e: React.PointerEvent): void => {
+        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
+            this._header!.current!.className = "collectionSchema-row-wrapper";
+            document.addEventListener("pointermove", this.onDragMove, true);
+        }
+    }
+    // ... and delete it when the mouse leaves
+    onPointerLeave = (e: React.PointerEvent): void => {
+        this._header!.current!.className = "collectionSchema-row-wrapper";
+        document.removeEventListener("pointermove", this.onDragMove, true);
+    }
+    // The method for the event listener, reorders columns when dragged to their new locations.
+    onDragMove = (e: PointerEvent): void => {
+        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
+        const before = x[1] < bounds[1];
+        this._header!.current!.className = "collectionSchema-row-wrapper";
+        if (before) this._header!.current!.className += " row-above";
+        if (!before) this._header!.current!.className += " row-below";
+        e.stopPropagation();
+    }
+    componentWillUnmount() {
+
+        this._rowDropDisposer?.();
+    }
+    //
+    createRowDropTarget = (ele: HTMLDivElement) => {
+        this._rowDropDisposer?.();
+        if (ele) {
+            this._rowDropDisposer = DragManager.MakeDropTarget(ele, this.rowDrop.bind(this));
+        }
+    }
+    // Controls what hppens when a row is dragged and dropped
+    rowDrop = (e: Event, de: DragManager.DropEvent) => {
+        this.onPointerLeave(e as any);
+        const rowDoc = FieldValue(Cast(this.props.rowInfo.original, Doc));
+        if (!rowDoc) return false;
+
+        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
+        const before = x[1] < bounds[1];
+
+        const docDragData = de.complete.docDragData;
+        if (docDragData) {
+            e.stopPropagation();
+            if (docDragData.draggedDocuments[0] === rowDoc) return true;
+            const addDocument = (doc: Doc | Doc[]) => this.props.addDoc(doc, rowDoc, before);
+            const movedDocs = docDragData.draggedDocuments;
+            return (docDragData.dropAction || docDragData.userDropAction) ?
+                docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before) || added, false)
+                : (docDragData.moveDocument) ?
+                    movedDocs.reduce((added: boolean, d) => docDragData.moveDocument?.(d, rowDoc, addDocument) || added, false)
+                    : docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before), false);
+        }
+        return false;
+    }
+
+    onRowContextMenu = (e: React.MouseEvent): void => {
+        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
+        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
+    }
+
+    @undoBatch
+    @action
+    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
+        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
+        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
+    }
+
+    @action
+    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
+        console.log("yes");
+        if (e.key === "Backspace" || e.key === "Delete") {
+            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
+        }
+    }
+
+    render() {
+        const { children = null, rowInfo } = this.props;
+
+        if (!rowInfo) {
+            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
+        }
+
+        const { original } = rowInfo;
+        const doc = FieldValue(Cast(original, Doc));
+
+        if (!doc) return (null);
+
+        const reference = React.createRef<HTMLDivElement>();
+        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
+
+        let className = "collectionSchema-row";
+        if (this.props.rowFocused) className += " row-focused";
+        if (this.props.rowWrapped) className += " row-wrapped";
+
+        return (
+            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
+                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
+                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
+                        <div className="row-dragger">
+                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
+                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
+                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
+                        </div>
+                        {children}
+                    </ReactTableDefaults.TrComponent>
+                </div>
+            </div>
+        );
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx b/src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx
new file mode 100644
index 000000000..f48906ba5
--- /dev/null
+++ b/src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx
@@ -0,0 +1,147 @@
+import React = require("react");
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action } from "mobx";
+import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
+import { Doc } from "../../../../fields/Doc";
+import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { Cast, FieldValue, StrCast } from "../../../../fields/Types";
+import { DocumentManager } from "../../../util/DocumentManager";
+import { DragManager, dropActionType, SetupDrag } from "../../../util/DragManager";
+import { SnappingManager } from "../../../util/SnappingManager";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { ContextMenu } from "../../ContextMenu";
+import "./CollectionSchemaView.scss";
+
+export interface MovableRowProps {
+    rowInfo: RowInfo;
+    ScreenToLocalTransform: () => Transform;
+    addDoc: (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => boolean;
+    removeDoc: (doc: Doc | Doc[]) => boolean;
+    rowFocused: boolean;
+    textWrapRow: (doc: Doc) => void;
+    rowWrapped: boolean;
+    dropAction: string;
+    addDocTab: any;
+}
+
+export class MovableRow extends React.Component<MovableRowProps> {
+    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
+    private _rowDropDisposer?: DragManager.DragDropDisposer;
+
+    // Event listeners are only necessary when the user is hovering over the table
+    // Create one when the mouse starts hovering...
+    onPointerEnter = (e: React.PointerEvent): void => {
+        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
+            this._header!.current!.className = "collectionSchema-row-wrapper";
+            document.addEventListener("pointermove", this.onDragMove, true);
+        }
+    }
+    // ... and delete it when the mouse leaves
+    onPointerLeave = (e: React.PointerEvent): void => {
+        this._header!.current!.className = "collectionSchema-row-wrapper";
+        document.removeEventListener("pointermove", this.onDragMove, true);
+    }
+    // The method for the event listener, reorders columns when dragged to their new locations.
+    onDragMove = (e: PointerEvent): void => {
+        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
+        const before = x[1] < bounds[1];
+        this._header!.current!.className = "collectionSchema-row-wrapper";
+        if (before) this._header!.current!.className += " row-above";
+        if (!before) this._header!.current!.className += " row-below";
+        e.stopPropagation();
+    }
+    componentWillUnmount() {
+
+        this._rowDropDisposer?.();
+    }
+    //
+    createRowDropTarget = (ele: HTMLDivElement) => {
+        this._rowDropDisposer?.();
+        if (ele) {
+            this._rowDropDisposer = DragManager.MakeDropTarget(ele, this.rowDrop.bind(this));
+        }
+    }
+    // Controls what hppens when a row is dragged and dropped
+    rowDrop = (e: Event, de: DragManager.DropEvent) => {
+        this.onPointerLeave(e as any);
+        const rowDoc = FieldValue(Cast(this.props.rowInfo.original, Doc));
+        if (!rowDoc) return false;
+
+        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
+        const before = x[1] < bounds[1];
+
+        const docDragData = de.complete.docDragData;
+        if (docDragData) {
+            e.stopPropagation();
+            if (docDragData.draggedDocuments[0] === rowDoc) return true;
+            const addDocument = (doc: Doc | Doc[]) => this.props.addDoc(doc, rowDoc, before);
+            const movedDocs = docDragData.draggedDocuments;
+            return (docDragData.dropAction || docDragData.userDropAction) ?
+                docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before) || added, false)
+                : (docDragData.moveDocument) ?
+                    movedDocs.reduce((added: boolean, d) => docDragData.moveDocument?.(d, rowDoc, addDocument) || added, false)
+                    : docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before), false);
+        }
+        return false;
+    }
+
+    onRowContextMenu = (e: React.MouseEvent): void => {
+        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
+        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
+    }
+
+    @undoBatch
+    @action
+    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
+        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
+        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
+    }
+
+    @action
+    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
+        console.log("yes");
+        if (e.key === "Backspace" || e.key === "Delete") {
+            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
+        }
+    }
+
+    render() {
+        const { children = null, rowInfo } = this.props;
+
+        if (!rowInfo) {
+            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
+        }
+
+        const { original } = rowInfo;
+        const doc = FieldValue(Cast(original, Doc));
+
+        if (!doc) return (null);
+
+        const reference = React.createRef<HTMLDivElement>();
+        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
+
+        let className = "collectionSchema-row";
+        if (this.props.rowFocused) className += " row-focused";
+        if (this.props.rowWrapped) className += " row-wrapped";
+
+        return (
+            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
+                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
+                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
+                        <div className="row-dragger">
+                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
+                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
+                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
+                        </div>
+                        {children}
+                    </ReactTableDefaults.TrComponent>
+                </div>
+            </div>
+        );
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaMovableTableHOC.tsx b/src/client/views/collections/schemaView/CollectionSchemaMovableTableHOC.tsx
deleted file mode 100644
index e1066caf4..000000000
--- a/src/client/views/collections/schemaView/CollectionSchemaMovableTableHOC.tsx
+++ /dev/null
@@ -1,261 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action } from "mobx";
-import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
-import { Doc } from "../../../../fields/Doc";
-import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
-import { Cast, FieldValue, StrCast } from "../../../../fields/Types";
-import { DocumentManager } from "../../../util/DocumentManager";
-import { DragManager, dropActionType, SetupDrag } from "../../../util/DragManager";
-import { SnappingManager } from "../../../util/SnappingManager";
-import { Transform } from "../../../util/Transform";
-import { undoBatch } from "../../../util/UndoManager";
-import { ContextMenu } from "../../ContextMenu";
-import "./CollectionSchemaView.scss";
-
-export interface MovableColumnProps {
-    columnRenderer: TableCellRenderer;
-    columnValue: SchemaHeaderField;
-    allColumns: SchemaHeaderField[];
-    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columns: SchemaHeaderField[]) => void;
-    ScreenToLocalTransform: () => Transform;
-}
-export class MovableColumn extends React.Component<MovableColumnProps> {
-    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
-    private _colDropDisposer?: DragManager.DragDropDisposer;
-    private _startDragPosition: { x: number, y: number } = { x: 0, y: 0 };
-    private _sensitivity: number = 16;
-    private _dragRef: React.RefObject<HTMLDivElement> = React.createRef();
-
-    onPointerEnter = (e: React.PointerEvent): void => {
-        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
-            this._header!.current!.className = "collectionSchema-col-wrapper";
-            document.addEventListener("pointermove", this.onDragMove, true);
-        }
-    }
-    onPointerLeave = (e: React.PointerEvent): void => {
-        this._header!.current!.className = "collectionSchema-col-wrapper";
-        document.removeEventListener("pointermove", this.onDragMove, true);
-        !e.buttons && document.removeEventListener("pointermove", this.onPointerMove);
-    }
-    onDragMove = (e: PointerEvent): void => {
-        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
-        const before = x[0] < bounds[0];
-        this._header!.current!.className = "collectionSchema-col-wrapper";
-        if (before) this._header!.current!.className += " col-before";
-        if (!before) this._header!.current!.className += " col-after";
-        e.stopPropagation();
-    }
-
-    createColDropTarget = (ele: HTMLDivElement) => {
-        this._colDropDisposer?.();
-        if (ele) {
-            this._colDropDisposer = DragManager.MakeDropTarget(ele, this.colDrop.bind(this));
-        }
-    }
-
-    colDrop = (e: Event, de: DragManager.DropEvent) => {
-        document.removeEventListener("pointermove", this.onDragMove, true);
-        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
-        const before = x[0] < bounds[0];
-        const colDragData = de.complete.columnDragData;
-        if (colDragData) {
-            e.stopPropagation();
-            this.props.reorderColumns(colDragData.colKey, this.props.columnValue, before, this.props.allColumns);
-            return true;
-        }
-        return false;
-    }
-
-    onPointerMove = (e: PointerEvent) => {
-        const onRowMove = (e: PointerEvent) => {
-            e.stopPropagation();
-            e.preventDefault();
-
-            document.removeEventListener("pointermove", onRowMove);
-            document.removeEventListener('pointerup', onRowUp);
-            const dragData = new DragManager.ColumnDragData(this.props.columnValue);
-            DragManager.StartColumnDrag(this._dragRef.current!, dragData, e.x, e.y);
-        };
-        const onRowUp = (): void => {
-            document.removeEventListener("pointermove", onRowMove);
-            document.removeEventListener('pointerup', onRowUp);
-        };
-        if (e.buttons === 1) {
-            const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX - this._startDragPosition.x, e.clientY - this._startDragPosition.y);
-            if (Math.abs(dx) + Math.abs(dy) > this._sensitivity) {
-                document.removeEventListener("pointermove", this.onPointerMove);
-                e.stopPropagation();
-
-                document.addEventListener("pointermove", onRowMove);
-                document.addEventListener("pointerup", onRowUp);
-            }
-        }
-    }
-
-    onPointerUp = (e: React.PointerEvent) => {
-        document.removeEventListener("pointermove", this.onPointerMove);
-    }
-
-    @action
-    onPointerDown = (e: React.PointerEvent, ref: React.RefObject<HTMLDivElement>) => {
-        this._dragRef = ref;
-        const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX, e.clientY);
-        if (!(e.target as any)?.tagName.includes("INPUT")) {
-            this._startDragPosition = { x: dx, y: dy };
-            document.addEventListener("pointermove", this.onPointerMove);
-        }
-    }
-
-
-    render() {
-        const reference = React.createRef<HTMLDivElement>();
-
-        return (
-            <div className="collectionSchema-col" ref={this.createColDropTarget}>
-                <div className="collectionSchema-col-wrapper" ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
-                    <div className="col-dragger" ref={reference} onPointerDown={e => this.onPointerDown(e, reference)} onPointerUp={this.onPointerUp}>
-                        {this.props.columnRenderer}
-                    </div>
-                </div>
-            </div>
-        );
-    }
-}
-
-export interface MovableRowProps {
-    rowInfo: RowInfo;
-    ScreenToLocalTransform: () => Transform;
-    addDoc: (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => boolean;
-    removeDoc: (doc: Doc | Doc[]) => boolean;
-    rowFocused: boolean;
-    textWrapRow: (doc: Doc) => void;
-    rowWrapped: boolean;
-    dropAction: string;
-    addDocTab: any;
-}
-
-export class MovableRow extends React.Component<MovableRowProps> {
-    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
-    private _rowDropDisposer?: DragManager.DragDropDisposer;
-
-    // Event listeners are only necessary when the user is hovering over the table
-    // Create one when the mouse starts hovering...
-    onPointerEnter = (e: React.PointerEvent): void => {
-        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
-            this._header!.current!.className = "collectionSchema-row-wrapper";
-            document.addEventListener("pointermove", this.onDragMove, true);
-        }
-    }
-    // ... and delete it when the mouse leaves
-    onPointerLeave = (e: React.PointerEvent): void => {
-        this._header!.current!.className = "collectionSchema-row-wrapper";
-        document.removeEventListener("pointermove", this.onDragMove, true);
-    }
-    // The method for the event listener, reorders columns when dragged to their new locations.
-    onDragMove = (e: PointerEvent): void => {
-        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
-        const before = x[1] < bounds[1];
-        this._header!.current!.className = "collectionSchema-row-wrapper";
-        if (before) this._header!.current!.className += " row-above";
-        if (!before) this._header!.current!.className += " row-below";
-        e.stopPropagation();
-    }
-    componentWillUnmount() {
-
-        this._rowDropDisposer?.();
-    }
-    //
-    createRowDropTarget = (ele: HTMLDivElement) => {
-        this._rowDropDisposer?.();
-        if (ele) {
-            this._rowDropDisposer = DragManager.MakeDropTarget(ele, this.rowDrop.bind(this));
-        }
-    }
-    // Controls what hppens when a row is dragged and dropped
-    rowDrop = (e: Event, de: DragManager.DropEvent) => {
-        this.onPointerLeave(e as any);
-        const rowDoc = FieldValue(Cast(this.props.rowInfo.original, Doc));
-        if (!rowDoc) return false;
-
-        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
-        const before = x[1] < bounds[1];
-
-        const docDragData = de.complete.docDragData;
-        if (docDragData) {
-            e.stopPropagation();
-            if (docDragData.draggedDocuments[0] === rowDoc) return true;
-            const addDocument = (doc: Doc | Doc[]) => this.props.addDoc(doc, rowDoc, before);
-            const movedDocs = docDragData.draggedDocuments;
-            return (docDragData.dropAction || docDragData.userDropAction) ?
-                docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before) || added, false)
-                : (docDragData.moveDocument) ?
-                    movedDocs.reduce((added: boolean, d) => docDragData.moveDocument?.(d, rowDoc, addDocument) || added, false)
-                    : docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before), false);
-        }
-        return false;
-    }
-
-    onRowContextMenu = (e: React.MouseEvent): void => {
-        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
-        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
-    }
-
-    @undoBatch
-    @action
-    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
-        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
-        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
-    }
-
-    @action
-    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
-        console.log("yes");
-        if (e.key === "Backspace" || e.key === "Delete") {
-            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
-        }
-    }
-
-    render() {
-        const { children = null, rowInfo } = this.props;
-
-        if (!rowInfo) {
-            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
-        }
-
-        const { original } = rowInfo;
-        const doc = FieldValue(Cast(original, Doc));
-
-        if (!doc) return (null);
-
-        const reference = React.createRef<HTMLDivElement>();
-        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
-
-        let className = "collectionSchema-row";
-        if (this.props.rowFocused) className += " row-focused";
-        if (this.props.rowWrapped) className += " row-wrapped";
-
-        return (
-            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
-                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
-                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
-                        <div className="row-dragger">
-                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
-                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
-                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
-                        </div>
-                        {children}
-                    </ReactTableDefaults.TrComponent>
-                </div>
-            </div>
-        );
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/SchemaTable.tsx b/src/client/views/collections/schemaView/SchemaTable.tsx
index 05d77a739..a735d4257 100644
--- a/src/client/views/collections/schemaView/SchemaTable.tsx
+++ b/src/client/views/collections/schemaView/SchemaTable.tsx
@@ -28,7 +28,8 @@ import { DocumentView } from "../../nodes/DocumentView";
 import { DefaultStyleProvider } from "../../StyleProvider";
 import { CellProps, CollectionSchemaButtons, CollectionSchemaCell, CollectionSchemaCheckboxCell, CollectionSchemaDateCell, CollectionSchemaDocCell, CollectionSchemaImageCell, CollectionSchemaListCell, CollectionSchemaNumberCell, CollectionSchemaStringCell } from "./CollectionSchemaCells";
 import { CollectionSchemaAddColumnHeader, KeysDropdown } from "./CollectionSchemaHeaders";
-import { MovableColumn, MovableRow } from "./CollectionSchemaMovableTableHOC";
+import { MovableColumn } from "./CollectionSchemaMovableColumn";
+import { MovableRow } from "./CollectionSchemaMovableRow";
 import "./CollectionSchemaView.scss";
 import { CollectionView } from "../CollectionView";
 
-- 
cgit v1.2.3-70-g09d2


From a5c099cb5ae455064f65989dc977870ce2c3f7fc Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Sat, 10 Jul 2021 16:57:45 -0400
Subject: added indentation for visibility of hierarchy

---
 src/client/util/SelectionManager.ts                |   2 +-
 .../schemaView/CollectionSchemaHeaders.tsx         |   1 -
 .../schemaView/CollectionSchemaMovableColumn.tsx   | 133 ---------------------
 .../views/collections/schemaView/SchemaTable.tsx   |   3 +-
 src/fields/SchemaHeaderField.ts                    |   2 +-
 5 files changed, 4 insertions(+), 137 deletions(-)

(limited to 'src')

diff --git a/src/client/util/SelectionManager.ts b/src/client/util/SelectionManager.ts
index ca5ef75d2..a624d5b7c 100644
--- a/src/client/util/SelectionManager.ts
+++ b/src/client/util/SelectionManager.ts
@@ -1,7 +1,7 @@
 import { action, observable, ObservableMap } from "mobx";
 import { computedFn } from "mobx-utils";
 import { Doc, Opt } from "../../fields/Doc";
-import { CollectionSchemaView } from "../views/collections/CollectionSchemaView";
+import { CollectionSchemaView } from "../views/collections/schemaView/CollectionSchemaView";
 import { CollectionViewType } from "../views/collections/CollectionView";
 import { DocumentView } from "../views/nodes/DocumentView";
 
diff --git a/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx b/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
index ab3076224..b2115b22e 100644
--- a/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
+++ b/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
@@ -11,7 +11,6 @@ import { Cast, StrCast } from "../../../../fields/Types";
 import { undoBatch } from "../../../util/UndoManager";
 import { SearchBox } from "../../search/SearchBox";
 import { ColumnType } from "./CollectionSchemaView";
-import { ColumnType2 } from "../CollectionSchemaView";
 import "./CollectionSchemaView.scss";
 import { CollectionView } from "../CollectionView";
 
diff --git a/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx b/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
index e1066caf4..456c38c68 100644
--- a/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
+++ b/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
@@ -126,136 +126,3 @@ export class MovableColumn extends React.Component<MovableColumnProps> {
         );
     }
 }
-
-export interface MovableRowProps {
-    rowInfo: RowInfo;
-    ScreenToLocalTransform: () => Transform;
-    addDoc: (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => boolean;
-    removeDoc: (doc: Doc | Doc[]) => boolean;
-    rowFocused: boolean;
-    textWrapRow: (doc: Doc) => void;
-    rowWrapped: boolean;
-    dropAction: string;
-    addDocTab: any;
-}
-
-export class MovableRow extends React.Component<MovableRowProps> {
-    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
-    private _rowDropDisposer?: DragManager.DragDropDisposer;
-
-    // Event listeners are only necessary when the user is hovering over the table
-    // Create one when the mouse starts hovering...
-    onPointerEnter = (e: React.PointerEvent): void => {
-        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
-            this._header!.current!.className = "collectionSchema-row-wrapper";
-            document.addEventListener("pointermove", this.onDragMove, true);
-        }
-    }
-    // ... and delete it when the mouse leaves
-    onPointerLeave = (e: React.PointerEvent): void => {
-        this._header!.current!.className = "collectionSchema-row-wrapper";
-        document.removeEventListener("pointermove", this.onDragMove, true);
-    }
-    // The method for the event listener, reorders columns when dragged to their new locations.
-    onDragMove = (e: PointerEvent): void => {
-        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
-        const before = x[1] < bounds[1];
-        this._header!.current!.className = "collectionSchema-row-wrapper";
-        if (before) this._header!.current!.className += " row-above";
-        if (!before) this._header!.current!.className += " row-below";
-        e.stopPropagation();
-    }
-    componentWillUnmount() {
-
-        this._rowDropDisposer?.();
-    }
-    //
-    createRowDropTarget = (ele: HTMLDivElement) => {
-        this._rowDropDisposer?.();
-        if (ele) {
-            this._rowDropDisposer = DragManager.MakeDropTarget(ele, this.rowDrop.bind(this));
-        }
-    }
-    // Controls what hppens when a row is dragged and dropped
-    rowDrop = (e: Event, de: DragManager.DropEvent) => {
-        this.onPointerLeave(e as any);
-        const rowDoc = FieldValue(Cast(this.props.rowInfo.original, Doc));
-        if (!rowDoc) return false;
-
-        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
-        const before = x[1] < bounds[1];
-
-        const docDragData = de.complete.docDragData;
-        if (docDragData) {
-            e.stopPropagation();
-            if (docDragData.draggedDocuments[0] === rowDoc) return true;
-            const addDocument = (doc: Doc | Doc[]) => this.props.addDoc(doc, rowDoc, before);
-            const movedDocs = docDragData.draggedDocuments;
-            return (docDragData.dropAction || docDragData.userDropAction) ?
-                docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before) || added, false)
-                : (docDragData.moveDocument) ?
-                    movedDocs.reduce((added: boolean, d) => docDragData.moveDocument?.(d, rowDoc, addDocument) || added, false)
-                    : docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before), false);
-        }
-        return false;
-    }
-
-    onRowContextMenu = (e: React.MouseEvent): void => {
-        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
-        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
-    }
-
-    @undoBatch
-    @action
-    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
-        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
-        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
-    }
-
-    @action
-    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
-        console.log("yes");
-        if (e.key === "Backspace" || e.key === "Delete") {
-            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
-        }
-    }
-
-    render() {
-        const { children = null, rowInfo } = this.props;
-
-        if (!rowInfo) {
-            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
-        }
-
-        const { original } = rowInfo;
-        const doc = FieldValue(Cast(original, Doc));
-
-        if (!doc) return (null);
-
-        const reference = React.createRef<HTMLDivElement>();
-        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
-
-        let className = "collectionSchema-row";
-        if (this.props.rowFocused) className += " row-focused";
-        if (this.props.rowWrapped) className += " row-wrapped";
-
-        return (
-            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
-                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
-                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
-                        <div className="row-dragger">
-                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
-                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
-                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
-                        </div>
-                        {children}
-                    </ReactTableDefaults.TrComponent>
-                </div>
-            </div>
-        );
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/SchemaTable.tsx b/src/client/views/collections/schemaView/SchemaTable.tsx
index a735d4257..0d5c9e077 100644
--- a/src/client/views/collections/schemaView/SchemaTable.tsx
+++ b/src/client/views/collections/schemaView/SchemaTable.tsx
@@ -458,8 +458,9 @@ export class SchemaTable extends React.Component<SchemaTableProps> {
             expanded={expanded}
             resized={this.resized}
             onResizedChange={this.props.onResizedChange}
+            // if it has a child, render another table with the children
             SubComponent={!hasCollectionChild ? undefined : row => (row.original.type !== DocumentType.COL) ? (null) :
-                <div className="reactTable-sub"><SchemaTable {...this.props} Document={row.original} dataDoc={undefined} childDocs={undefined} /></div>}
+                <div style={{ paddingLeft: 57 + "px" }} className="reactTable-sub"><SchemaTable {...this.props} Document={row.original} dataDoc={undefined} childDocs={undefined} /></div>}
 
         />;
     }
diff --git a/src/fields/SchemaHeaderField.ts b/src/fields/SchemaHeaderField.ts
index 88de3a19f..74cf934f2 100644
--- a/src/fields/SchemaHeaderField.ts
+++ b/src/fields/SchemaHeaderField.ts
@@ -3,7 +3,7 @@ import { serializable, primitive } from "serializr";
 import { ObjectField } from "./ObjectField";
 import { Copy, ToScriptString, ToString, OnUpdate } from "./FieldSymbols";
 import { scriptingGlobal } from "../client/util/Scripting";
-import { ColumnType } from "../client/views/collections/CollectionSchemaView";
+import { ColumnType } from "../client/views/collections/schemaView/CollectionSchemaView";
 
 export const PastelSchemaPalette = new Map<string, string>([
     // ["pink1", "#FFB4E8"],
-- 
cgit v1.2.3-70-g09d2


From 492edd8702b2125adc9e4f0e1a9ffb2462f8a308 Mon Sep 17 00:00:00 2001
From: dinhanhtruong <70963346+dinhanhtruong@users.noreply.github.com>
Date: Sat, 10 Jul 2021 17:06:13 -0400
Subject: Crude searchbox instantiation in linkpopup

added SearchBox to linkpopup. No changes to searchbox css
---
 src/client/views/linking/LinkPopup.scss |  9 ++++++++-
 src/client/views/linking/LinkPopup.tsx  | 17 +++++++++--------
 2 files changed, 17 insertions(+), 9 deletions(-)

(limited to 'src')

diff --git a/src/client/views/linking/LinkPopup.scss b/src/client/views/linking/LinkPopup.scss
index 009a21bd6..519044e5e 100644
--- a/src/client/views/linking/LinkPopup.scss
+++ b/src/client/views/linking/LinkPopup.scss
@@ -1,3 +1,5 @@
+@import "../globalCssVariables";
+
 .linkPopup-container {
     background: white;
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
@@ -5,7 +7,7 @@
     height: 200px;
     width: 200px;
     position: absolute;
-    padding: 10px;
+    padding: 15px;
     border-radius: 3px;
 
     input {
@@ -37,4 +39,9 @@
             margin: auto;
         }
     }
+
+
+    .searchBox-container {
+        background: pink;
+    }
 }
\ No newline at end of file
diff --git a/src/client/views/linking/LinkPopup.tsx b/src/client/views/linking/LinkPopup.tsx
index 71db06f19..5c4640fdf 100644
--- a/src/client/views/linking/LinkPopup.tsx
+++ b/src/client/views/linking/LinkPopup.tsx
@@ -20,7 +20,7 @@ import './LinkPopup.scss';
 import React = require("react");
 import { CurrentUserUtils } from '../../util/CurrentUserUtils';
 import { DefaultStyleProvider } from '../StyleProvider';
-import { Transform } from 'stream';
+import { Transform } from '../../util/Transform';
 import { DocUtils } from '../../documents/Documents';
 import { SearchBox } from '../search/SearchBox';
 
@@ -39,11 +39,13 @@ interface LinkPopupProps {
 @observer
 export class LinkPopup extends React.Component<LinkPopupProps> {
 
+    getPWidth = () => 500;
+    getPHeight = () => 500;
+
     render() {
         const popupVisibility = this.props.showPopup ? "block" : "none";
         return (
             <div className="linkPopup-container" style={{ display: popupVisibility }}>
-
                 <div className="linkPopup-url-container">
                     <input defaultValue={""} autoComplete="off" type="text" placeholder="Enter URL..." id="url-input"
                         className="linkPopup-searchBox searchBox-input" />
@@ -54,12 +56,11 @@ export class LinkPopup extends React.Component<LinkPopupProps> {
                     <p className="divider-text">or</p>
                 </div>
                 <div className="linkPopup-document-search-container">
-                    <i></i>
+                    {/* <i></i>
                     <input defaultValue={""} autoComplete="off" type="text" placeholder="Search for Document..." id="search-input"
-                        className="linkPopup-searchBox searchBox-input" />
+                        className="linkPopup-searchBox searchBox-input" /> */}
 
-                    {/*                     
-                        <SearchBox Document={CurrentUserUtils.MySearchPanelDoc}
+                    <SearchBox Document={CurrentUserUtils.MySearchPanelDoc}
                         DataDoc={CurrentUserUtils.MySearchPanelDoc}
                         fieldKey="data"
                         dropAction="move"
@@ -68,7 +69,7 @@ export class LinkPopup extends React.Component<LinkPopupProps> {
                         select={returnTrue}
                         setHeight={returnFalse}
                         addDocument={undefined}
-                        addDocTab={this.addDocTabFunc}
+                        addDocTab={returnTrue}
                         pinToPres={emptyFunction}
                         rootSelected={returnTrue}
                         styleProvider={DefaultStyleProvider}
@@ -86,7 +87,7 @@ export class LinkPopup extends React.Component<LinkPopupProps> {
                         docRangeFilters={returnEmptyFilter}
                         searchFilterDocs={returnEmptyDoclist}
                         ContainingCollectionView={undefined}
-                        ContainingCollectionDoc={undefined} /> */}
+                        ContainingCollectionDoc={undefined} />
                 </div>
             </div>
         );
-- 
cgit v1.2.3-70-g09d2


From 34404caeb6b159e9ad040d8213849a9eb6f908aa Mon Sep 17 00:00:00 2001
From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com>
Date: Mon, 12 Jul 2021 13:45:49 -0400
Subject: Revert "Schema view En-Hua — added ability to type strings in without
 quotes, as well as formatting reflecting nested containers"
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .idea/.gitignore                                   |   3 -
 .idea/Dash-Web.iml                                 |   9 -
 .idea/modules.xml                                  |   8 -
 .idea/vcs.xml                                      |   6 -
 src/client/util/SelectionManager.ts                |   2 +-
 .../views/collections/CollectionSchemaCells.tsx    | 529 +++++++++++++++++
 .../views/collections/CollectionSchemaHeaders.tsx  | 518 +++++++++++++++++
 .../CollectionSchemaMovableTableHOC.tsx            | 258 +++++++++
 .../views/collections/CollectionSchemaView.scss    | 641 +++++++++++++++++++++
 .../views/collections/CollectionSchemaView.tsx     | 575 ++++++++++++++++++
 src/client/views/collections/CollectionView.tsx    |   2 +-
 src/client/views/collections/SchemaTable.tsx       | 599 +++++++++++++++++++
 .../schemaView/CollectionSchemaCells.tsx           | 585 -------------------
 .../schemaView/CollectionSchemaHeaders.tsx         | 518 -----------------
 .../schemaView/CollectionSchemaMovableColumn.tsx   | 128 ----
 .../schemaView/CollectionSchemaMovableRow.tsx      | 147 -----
 .../schemaView/CollectionSchemaView.scss           | 552 ------------------
 .../schemaView/CollectionSchemaView.tsx            | 575 ------------------
 .../views/collections/schemaView/SchemaTable.tsx   | 601 -------------------
 src/client/views/nodes/DocumentContentsView.tsx    |   2 +-
 src/client/views/search/SearchBox.tsx              |   4 +-
 src/fields/SchemaHeaderField.ts                    |   2 +-
 22 files changed, 3126 insertions(+), 3138 deletions(-)
 delete mode 100644 .idea/.gitignore
 delete mode 100644 .idea/Dash-Web.iml
 delete mode 100644 .idea/modules.xml
 delete mode 100644 .idea/vcs.xml
 create mode 100644 src/client/views/collections/CollectionSchemaCells.tsx
 create mode 100644 src/client/views/collections/CollectionSchemaHeaders.tsx
 create mode 100644 src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
 create mode 100644 src/client/views/collections/CollectionSchemaView.scss
 create mode 100644 src/client/views/collections/CollectionSchemaView.tsx
 create mode 100644 src/client/views/collections/SchemaTable.tsx
 delete mode 100644 src/client/views/collections/schemaView/CollectionSchemaCells.tsx
 delete mode 100644 src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
 delete mode 100644 src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
 delete mode 100644 src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx
 delete mode 100644 src/client/views/collections/schemaView/CollectionSchemaView.scss
 delete mode 100644 src/client/views/collections/schemaView/CollectionSchemaView.tsx
 delete mode 100644 src/client/views/collections/schemaView/SchemaTable.tsx

(limited to 'src')

diff --git a/.idea/.gitignore b/.idea/.gitignore
deleted file mode 100644
index 26d33521a..000000000
--- a/.idea/.gitignore
+++ /dev/null
@@ -1,3 +0,0 @@
-# Default ignored files
-/shelf/
-/workspace.xml
diff --git a/.idea/Dash-Web.iml b/.idea/Dash-Web.iml
deleted file mode 100644
index d6ebd4805..000000000
--- a/.idea/Dash-Web.iml
+++ /dev/null
@@ -1,9 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<module type="JAVA_MODULE" version="4">
-  <component name="NewModuleRootManager" inherit-compiler-output="true">
-    <exclude-output />
-    <content url="file://$MODULE_DIR$" />
-    <orderEntry type="inheritedJdk" />
-    <orderEntry type="sourceFolder" forTests="false" />
-  </component>
-</module>
\ No newline at end of file
diff --git a/.idea/modules.xml b/.idea/modules.xml
deleted file mode 100644
index 35c51c015..000000000
--- a/.idea/modules.xml
+++ /dev/null
@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="ProjectModuleManager">
-    <modules>
-      <module fileurl="file://$PROJECT_DIR$/.idea/Dash-Web.iml" filepath="$PROJECT_DIR$/.idea/Dash-Web.iml" />
-    </modules>
-  </component>
-</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
deleted file mode 100644
index 35eb1ddfb..000000000
--- a/.idea/vcs.xml
+++ /dev/null
@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="VcsDirectoryMappings">
-    <mapping directory="" vcs="Git" />
-  </component>
-</project>
\ No newline at end of file
diff --git a/src/client/util/SelectionManager.ts b/src/client/util/SelectionManager.ts
index a624d5b7c..ca5ef75d2 100644
--- a/src/client/util/SelectionManager.ts
+++ b/src/client/util/SelectionManager.ts
@@ -1,7 +1,7 @@
 import { action, observable, ObservableMap } from "mobx";
 import { computedFn } from "mobx-utils";
 import { Doc, Opt } from "../../fields/Doc";
-import { CollectionSchemaView } from "../views/collections/schemaView/CollectionSchemaView";
+import { CollectionSchemaView } from "../views/collections/CollectionSchemaView";
 import { CollectionViewType } from "../views/collections/CollectionView";
 import { DocumentView } from "../views/nodes/DocumentView";
 
diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
new file mode 100644
index 000000000..2e6186680
--- /dev/null
+++ b/src/client/views/collections/CollectionSchemaCells.tsx
@@ -0,0 +1,529 @@
+import React = require("react");
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action, computed, observable } from "mobx";
+import { observer } from "mobx-react";
+import DatePicker from "react-datepicker";
+import "react-datepicker/dist/react-datepicker.css";
+import { CellInfo } from "react-table";
+import "react-table/react-table.css";
+import { DateField } from "../../../fields/DateField";
+import { Doc, DocListCast, Field, Opt } from "../../../fields/Doc";
+import { Id } from "../../../fields/FieldSymbols";
+import { List } from "../../../fields/List";
+import { SchemaHeaderField } from "../../../fields/SchemaHeaderField";
+import { ComputedField } from "../../../fields/ScriptField";
+import { BoolCast, Cast, DateCast, FieldValue, NumCast, StrCast } from "../../../fields/Types";
+import { ImageField } from "../../../fields/URLField";
+import { Utils, emptyFunction } from "../../../Utils";
+import { Docs } from "../../documents/Documents";
+import { DocumentType } from "../../documents/DocumentTypes";
+import { DocumentManager } from "../../util/DocumentManager";
+import { DragManager } from "../../util/DragManager";
+import { KeyCodes } from "../../util/KeyCodes";
+import { CompileScript } from "../../util/Scripting";
+import { SearchUtil } from "../../util/SearchUtil";
+import { SnappingManager } from "../../util/SnappingManager";
+import { undoBatch } from "../../util/UndoManager";
+import '../DocumentDecorations.scss';
+import { EditableView } from "../EditableView";
+import { MAX_ROW_HEIGHT } from '../globalCssVariables.scss';
+import { DocumentIconContainer } from "../nodes/DocumentIcon";
+import { OverlayView } from "../OverlayView";
+import "./CollectionSchemaView.scss";
+import { CollectionView } from "./CollectionView";
+const path = require('path');
+
+export interface CellProps {
+    row: number;
+    col: number;
+    rowProps: CellInfo;
+    CollectionView: Opt<CollectionView>;
+    ContainingCollection: Opt<CollectionView>;
+    Document: Doc;
+    fieldKey: string;
+    renderDepth: number;
+    addDocTab: (document: Doc, where: string) => boolean;
+    pinToPres: (document: Doc) => void;
+    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined,
+        addDocument: (document: Doc | Doc[]) => boolean) => boolean;
+    isFocused: boolean;
+    changeFocusedCellByIndex: (row: number, col: number) => void;
+    setIsEditing: (isEditing: boolean) => void;
+    isEditable: boolean;
+    setPreviewDoc: (doc: Doc) => void;
+    setComputed: (script: string, doc: Doc, field: string, row: number, col: number) => boolean;
+    getField: (row: number, col?: number) => void;
+    showDoc: (doc: Doc | undefined, dataDoc?: any, screenX?: number, screenY?: number) => void;
+}
+
+@observer
+export class CollectionSchemaCell extends React.Component<CellProps> {
+    public static resolvedFieldKey(column: string, rowDoc: Doc) {
+        const fieldKey = column;
+        if (fieldKey.startsWith("*")) {
+            const rootKey = fieldKey.substring(1);
+            const allKeys = [...Array.from(Object.keys(rowDoc)), ...Array.from(Object.keys(Doc.GetProto(rowDoc)))];
+            const matchedKeys = allKeys.filter(key => key.includes(rootKey));
+            if (matchedKeys.length) return matchedKeys[0];
+        }
+        return fieldKey;
+    }
+    @observable protected _isEditing: boolean = false;
+    protected _focusRef = React.createRef<HTMLDivElement>();
+    protected _rowDoc = this.props.rowProps.original;
+    protected _rowDataDoc = Doc.GetProto(this.props.rowProps.original);
+    protected _dropDisposer?: DragManager.DragDropDisposer;
+    @observable contents: string = "";
+
+    componentDidMount() { document.addEventListener("keydown", this.onKeyDown); }
+    componentWillUnmount() { document.removeEventListener("keydown", this.onKeyDown); }
+
+    @action
+    onKeyDown = (e: KeyboardEvent): void => {
+        if (this.props.isFocused && this.props.isEditable && e.keyCode === KeyCodes.ENTER) {
+            document.removeEventListener("keydown", this.onKeyDown);
+            this._isEditing = true;
+            this.props.setIsEditing(true);
+        }
+    }
+
+    @action
+    isEditingCallback = (isEditing: boolean): void => {
+        document.removeEventListener("keydown", this.onKeyDown);
+        isEditing && document.addEventListener("keydown", this.onKeyDown);
+        this._isEditing = isEditing;
+        this.props.setIsEditing(isEditing);
+        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
+    }
+
+    @action
+    onPointerDown = async (e: React.PointerEvent): Promise<void> => {
+        this.onItemDown(e);
+        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
+        this.props.setPreviewDoc(this.props.rowProps.original);
+
+        let url: string;
+        if (url = StrCast(this.props.rowProps.row.href)) {
+            try {
+                new URL(url);
+                const temp = window.open(url)!;
+                temp.blur();
+                window.focus();
+            } catch { }
+        }
+
+        const doc = Cast(this._rowDoc[this.renderFieldKey], Doc, null);
+        doc && this.props.setPreviewDoc(doc);
+    }
+
+    @undoBatch
+    applyToDoc = (doc: Doc, row: number, col: number, run: (args?: { [name: string]: any }) => any) => {
+        const res = run({ this: doc, $r: row, $c: col, $: (r: number = 0, c: number = 0) => this.props.getField(r + row, c + col) });
+        if (!res.success) return false;
+        doc[this.renderFieldKey] = res.result;
+        return true;
+    }
+
+    private drop = (e: Event, de: DragManager.DropEvent) => {
+        if (de.complete.docDragData) {
+            if (de.complete.docDragData.draggedDocuments.length === 1) {
+                this._rowDataDoc[this.renderFieldKey] = de.complete.docDragData.draggedDocuments[0];
+            }
+            else {
+                const coll = Docs.Create.SchemaDocument([new SchemaHeaderField("title", "#f1efeb")], de.complete.docDragData.draggedDocuments, {});
+                this._rowDataDoc[this.renderFieldKey] = coll;
+            }
+            e.stopPropagation();
+        }
+    }
+
+    protected dropRef = (ele: HTMLElement | null) => {
+        this._dropDisposer?.();
+        ele && (this._dropDisposer = DragManager.MakeDropTarget(ele, this.drop.bind(this)));
+    }
+
+    returnHighlights(contents: string, positions?: number[]) {
+        if (positions) {
+            const results = [];
+            StrCast(this.props.Document._searchString);
+            const length = StrCast(this.props.Document._searchString).length;
+            const color = contents ? "black" : "grey";
+
+            results.push(<span key="-1" style={{ color }}>{contents?.slice(0, positions[0])}</span>);
+            positions.forEach((num, cur) => {
+                results.push(<span key={"start" + cur} style={{ backgroundColor: "#FFFF00", color }}>{contents?.slice(num, num + length)}</span>);
+                let end = 0;
+                cur === positions.length - 1 ? end = contents.length : end = positions[cur + 1];
+                results.push(<span key={"end" + cur} style={{ color }}>{contents?.slice(num + length, end)}</span>);
+            }
+            );
+            return results;
+        }
+        return <span style={{ color: contents ? "black" : "grey" }}>{contents ? contents?.valueOf() : "undefined"}</span>;
+    }
+
+    @computed get renderFieldKey() { return CollectionSchemaCell.resolvedFieldKey(this.props.rowProps.column.id!, this.props.rowProps.original); }
+    onItemDown = async (e: React.PointerEvent) => {
+        if (this.props.Document._searchDoc) {
+            const aliasdoc = await SearchUtil.GetAliasesOfDocument(this._rowDataDoc);
+            const targetContext = aliasdoc.length <= 0 ? undefined : Cast(aliasdoc[0].context, Doc, null);
+            DocumentManager.Instance.jumpToDocument(this._rowDoc, false, emptyFunction, targetContext,
+                undefined, undefined, undefined, () => this.props.setPreviewDoc(this._rowDoc));
+        }
+    }
+    renderCellWithType(type: string | undefined) {
+        const dragRef: React.RefObject<HTMLDivElement> = React.createRef();
+
+        const fieldKey = this.renderFieldKey;
+        const field = this._rowDoc[fieldKey];
+
+        const onPointerEnter = (e: React.PointerEvent): void => {
+            if (e.buttons === 1 && SnappingManager.GetIsDragging() && (type === "document" || type === undefined)) {
+                dragRef.current!.className = "collectionSchemaView-cellContainer doc-drag-over";
+            }
+        };
+        const onPointerLeave = (e: React.PointerEvent): void => {
+            dragRef.current!.className = "collectionSchemaView-cellContainer";
+        };
+
+        let contents = Field.toString(field as Field);
+        contents = contents === "" ? "--" : contents;
+
+        let className = "collectionSchemaView-cellWrapper";
+        if (this._isEditing) className += " editing";
+        if (this.props.isFocused && this.props.isEditable) className += " focused";
+        if (this.props.isFocused && !this.props.isEditable) className += " inactive";
+
+        const positions = [];
+        if (StrCast(this.props.Document._searchString).toLowerCase() !== "") {
+            let term = (field instanceof Promise) ? "...promise pending..." : contents.toLowerCase();
+            const search = StrCast(this.props.Document._searchString).toLowerCase();
+            let start = term.indexOf(search);
+            let tally = 0;
+            if (start !== -1) {
+                positions.push(start);
+            }
+            while (start < contents?.length && start !== -1) {
+                term = term.slice(start + search.length + 1);
+                tally += start + search.length + 1;
+                start = term.indexOf(search);
+                positions.push(tally + start);
+            }
+            if (positions.length > 1) {
+                positions.pop();
+            }
+        }
+        const placeholder = type === "number" ? "0" : contents === "" ? "--" : "undefined";
+        return (
+            <div className="collectionSchemaView-cellContainer" style={{ cursor: field instanceof Doc ? "grab" : "auto" }}
+                ref={dragRef} onPointerDown={this.onPointerDown} onClick={action(e => this._isEditing = true)} onPointerEnter={onPointerEnter} onPointerLeave={onPointerLeave}>
+                <div className={className} ref={this._focusRef} tabIndex={-1}>
+                    <div className="collectionSchemaView-cellContents" ref={type === undefined || type === "document" ? this.dropRef : null}>
+                        {!this.props.Document._searchDoc ?
+                            <EditableView
+                                editing={this._isEditing}
+                                isEditingCallback={this.isEditingCallback}
+                                display={"inline"}
+                                contents={contents}
+                                height={"auto"}
+                                maxHeight={Number(MAX_ROW_HEIGHT)}
+                                placeholder={placeholder}
+                                GetValue={() => {
+                                    const cfield = ComputedField.WithoutComputed(() => FieldValue(field));
+                                    const cscript = cfield instanceof ComputedField ? cfield.script.originalScript : undefined;
+                                    const cfinalScript = cscript?.split("return")[cscript.split("return").length - 1];
+                                    return cscript ? (cfinalScript?.endsWith(";") ? `:=${cfinalScript?.substring(0, cfinalScript.length - 2)}` : cfinalScript) :
+                                        Field.IsField(cfield) ? Field.toScriptString(cfield) : "";
+                                }}
+                                SetValue={action((value: string) => {
+                                    let retVal = false;
+                                    if (value.startsWith(":=") || value.startsWith("=:=")) {
+                                        const script = value.substring(value.startsWith("=:=") ? 3 : 2);
+                                        retVal = this.props.setComputed(script, value.startsWith(":=") ? this._rowDataDoc : this._rowDoc, this.renderFieldKey, this.props.row, this.props.col);
+                                    } else {
+                                        const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
+                                        const script = CompileScript(inputscript, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                        script.compiled && (retVal = this.applyToDoc(inputscript.length !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                    }
+                                    if (retVal) {
+                                        this._isEditing = false; // need to set this here. otherwise, the assignment of the field will invalidate & cause render() to be called with the wrong value for 'editing'
+                                        this.props.setIsEditing(false);
+                                    }
+                                    return retVal;
+                                })}
+                                OnFillDown={async (value: string) => {
+                                    const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                    script.compiled && DocListCast(this.props.Document[this.props.fieldKey]).
+                                        forEach((doc, i) => value.startsWith(":=") ?
+                                            this.props.setComputed(value.substring(2), Doc.GetProto(doc), this.renderFieldKey, i, this.props.col) :
+                                            this.applyToDoc(Doc.GetProto(doc), i, this.props.col, script.run));
+                                }}
+                            />
+                            :
+                            this.returnHighlights(contents, positions)
+                        }
+                    </div >
+                </div>
+            </div>
+        );
+    }
+
+    render() { return this.renderCellWithType(undefined); }
+}
+
+@observer
+export class CollectionSchemaNumberCell extends CollectionSchemaCell { render() { return this.renderCellWithType("number"); } }
+
+@observer
+export class CollectionSchemaBooleanCell extends CollectionSchemaCell { render() { return this.renderCellWithType("boolean"); } }
+
+@observer
+export class CollectionSchemaStringCell extends CollectionSchemaCell { render() { return this.renderCellWithType("string"); } }
+
+@observer
+export class CollectionSchemaDateCell extends CollectionSchemaCell {
+    @computed get _date(): Opt<DateField> { return this._rowDoc[this.renderFieldKey] instanceof DateField ? DateCast(this._rowDoc[this.renderFieldKey]) : undefined; }
+
+    @action
+    handleChange = (date: any) => {
+        // const script = CompileScript(date.toString(), { requiredType: "Date", addReturn: true, params: { this: Doc.name } });
+        // if (script.compiled) {
+        //     this.applyToDoc(this._document, this.props.row, this.props.col, script.run);
+        // } else {
+        // ^ DateCast is always undefined for some reason, but that is what the field should be set to
+        this._rowDoc[this.renderFieldKey] = new DateField(date as Date);
+        //}
+    }
+
+    render() {
+        return !this.props.isFocused ? <span onPointerDown={this.onPointerDown}>{this._date ? Field.toString(this._date as Field) : "--"}</span> :
+            <DatePicker
+                selected={this._date?.date || new Date}
+                onSelect={date => this.handleChange(date)}
+                onChange={date => this.handleChange(date)}
+            />;
+    }
+}
+
+@observer
+export class CollectionSchemaDocCell extends CollectionSchemaCell {
+
+    _overlayDisposer?: () => void;
+
+    @computed get _doc() { return FieldValue(Cast(this._rowDoc[this.renderFieldKey], Doc)); }
+
+    @action
+    onSetValue = (value: string) => {
+        this._doc && (Doc.GetProto(this._doc).title = value);
+
+        const script = CompileScript(value, {
+            addReturn: true,
+            typecheck: false,
+            transformer: DocumentIconContainer.getTransformer()
+        });
+
+        const results = script.compiled && script.run();
+        if (results && results.success) {
+            this._rowDoc[this.renderFieldKey] = results.result;
+            return true;
+        }
+        return false;
+    }
+
+    componentWillUnmount() { this.onBlur(); }
+
+    onBlur = () => { this._overlayDisposer?.(); };
+    onFocus = () => {
+        this.onBlur();
+        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
+    }
+
+    @action
+    isEditingCallback = (isEditing: boolean): void => {
+        document.removeEventListener("keydown", this.onKeyDown);
+        isEditing && document.addEventListener("keydown", this.onKeyDown);
+        this._isEditing = isEditing;
+        this.props.setIsEditing(isEditing);
+        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
+    }
+
+    render() {
+        return !this._doc ? this.renderCellWithType("document") :
+            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1}
+                onPointerDown={this.onPointerDown}
+            >
+                <div className="collectionSchemaView-cellContents-document"
+                    style={{ padding: "5.9px" }}
+                    ref={this.dropRef}
+                    onFocus={this.onFocus}
+                    onBlur={this.onBlur}
+                >
+                    <EditableView
+                        editing={this._isEditing}
+                        isEditingCallback={this.isEditingCallback}
+                        display={"inline"}
+                        contents={this._doc.title || "--"}
+                        height={"auto"}
+                        maxHeight={Number(MAX_ROW_HEIGHT)}
+                        GetValue={() => StrCast(this._doc?.title)}
+                        SetValue={action((value: string) => {
+                            this.onSetValue(value);
+                            return true;
+                        })}
+                    />
+                </div >
+                <div onClick={() => this._doc && this.props.addDocTab(this._doc, "add:right")} className="collectionSchemaView-cellContents-docButton">
+                    <FontAwesomeIcon icon="external-link-alt" size="lg" />
+                </div>
+            </div>;
+    }
+}
+
+@observer
+export class CollectionSchemaImageCell extends CollectionSchemaCell {
+
+    choosePath(url: URL) {
+        if (url.protocol === "data") return url.href;
+        if (url.href.indexOf(window.location.origin) === -1) return Utils.CorsProxy(url.href);
+        if (!/\.(png|jpg|jpeg|gif|webp)$/.test(url.href.toLowerCase())) return url.href;//Why is this here
+
+        const ext = path.extname(url.href);
+        return url.href.replace(ext, "_o" + path.extname(url.href));
+    }
+
+    render() {
+        const field = Cast(this._rowDoc[this.renderFieldKey], ImageField, null); // retrieve the primary image URL that is being rendered from the data doc
+        const alts = DocListCast(this._rowDoc[this.renderFieldKey + "-alternates"]); // retrieve alternate documents that may be rendered as alternate images
+        const altpaths = alts.map(doc => Cast(doc[Doc.LayoutFieldKey(doc)], ImageField, null)?.url).filter(url => url).map(url => this.choosePath(url)); // access the primary layout data of the alternate documents
+        const paths = field ? [this.choosePath(field.url), ...altpaths] : altpaths;
+        const url = paths.length ? paths : [Utils.CorsProxy("http://www.cs.brown.edu/~bcz/noImage.png")];
+
+        const aspect = Doc.NativeAspect(this._rowDoc);
+        let width = Math.min(75, this.props.rowProps.width);
+        const height = Math.min(75, width / aspect);
+        width = height * aspect;
+
+        const reference = React.createRef<HTMLDivElement>();
+        return <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
+            <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
+                <img src={url[0]}
+                    width={paths.length ? width : "20px"}
+                    height={paths.length ? height : "20px"} />
+            </div >
+        </div>;
+    }
+}
+
+
+@observer
+export class CollectionSchemaListCell extends CollectionSchemaCell {
+    _overlayDisposer?: () => void;
+
+    @computed get _field() { return this._rowDoc[this.renderFieldKey]; }
+    @computed get _optionsList() { return this._field as List<any>; }
+    @observable private _opened = false;
+    @observable private _text = "select an item";
+    @observable private _selectedNum = 0;
+
+    @action
+    onSetValue = (value: string) => {
+        // change if its a document
+        this._optionsList[this._selectedNum] = this._text = value;
+
+        (this._field as List<any>).splice(this._selectedNum, 1, value);
+    }
+
+    @action
+    onSelected = (element: string, index: number) => {
+        this._text = element;
+        this._selectedNum = index;
+    }
+
+    onFocus = () => {
+        this._overlayDisposer?.();
+        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
+    }
+
+    render() {
+        const link = false;
+        const reference = React.createRef<HTMLDivElement>();
+
+        if (this._optionsList?.length) {
+            const options = !this._opened ? (null) :
+                <div>
+                    {this._optionsList.map((element, index) => {
+                        const val = Field.toString(element);
+                        return <div className="collectionSchemaView-dropdownOption" key={index} style={{ padding: "6px" }} onPointerDown={(e) => this.onSelected(StrCast(element), index)} >
+                            {val}
+                        </div>;
+                    })}
+                </div>;
+
+            const plainText = <div style={{ padding: "5.9px" }}>{this._text}</div>;
+            const textarea = <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} style={{ padding: "5.9px" }} ref={this.dropRef} >
+                <EditableView
+                    editing={this._isEditing}
+                    isEditingCallback={this.isEditingCallback}
+                    display={"inline"}
+                    contents={this._text}
+                    height={"auto"}
+                    maxHeight={Number(MAX_ROW_HEIGHT)}
+                    GetValue={() => this._text}
+                    SetValue={action((value: string) => {
+                        // add special for params 
+                        this.onSetValue(value);
+                        return true;
+                    })}
+                />
+            </div >;
+
+            //☰
+            return (
+                <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
+                    <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
+                        <div className="collectionSchemaView-dropDownWrapper">
+                            <button type="button" className="collectionSchemaView-dropdownButton" style={{ right: "length", position: "relative" }}
+                                onClick={action(e => this._opened = !this._opened)} >
+                                <FontAwesomeIcon icon={this._opened ? "caret-up" : "caret-down"} size="sm" />
+                            </button>
+                            <div className="collectionSchemaView-dropdownText"> {link ? plainText : textarea} </div>
+                        </div>
+                        {options}
+                    </div >
+                </div>
+            );
+        }
+        return this.renderCellWithType("list");
+    }
+}
+
+
+@observer
+export class CollectionSchemaCheckboxCell extends CollectionSchemaCell {
+    @computed get _isChecked() { return BoolCast(this._rowDoc[this.renderFieldKey]); }
+
+    render() {
+        const reference = React.createRef<HTMLDivElement>();
+        return (
+            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
+                <input type="checkbox" checked={this._isChecked} onChange={e => this._rowDoc[this.renderFieldKey] = e.target.checked} />
+            </div>
+        );
+    }
+}
+
+
+@observer
+export class CollectionSchemaButtons extends CollectionSchemaCell {
+    render() {
+        return !this.props.Document._searchDoc || ![DocumentType.PDF, DocumentType.RTF].includes(StrCast(this._rowDoc.type) as DocumentType) ? <></> :
+            <div style={{ paddingTop: 8, paddingLeft: 3 }} >
+                <button style={{ padding: 2, left: 77 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, true)}>
+                    <FontAwesomeIcon icon="arrow-up" size="sm" />
+                </button>
+                <button style={{ padding: 2 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, false)} >
+                    <FontAwesomeIcon icon="arrow-down" size="sm" />
+                </button>
+            </div>;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/CollectionSchemaHeaders.tsx b/src/client/views/collections/CollectionSchemaHeaders.tsx
new file mode 100644
index 000000000..3b52e6408
--- /dev/null
+++ b/src/client/views/collections/CollectionSchemaHeaders.tsx
@@ -0,0 +1,518 @@
+import React = require("react");
+import { IconProp, library } from "@fortawesome/fontawesome-svg-core";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action, computed, observable, runInAction } from "mobx";
+import { observer } from "mobx-react";
+import { Doc, DocListCast, Opt } from "../../../fields/Doc";
+import { listSpec } from "../../../fields/Schema";
+import { PastelSchemaPalette, SchemaHeaderField } from "../../../fields/SchemaHeaderField";
+import { ScriptField } from "../../../fields/ScriptField";
+import { Cast, StrCast } from "../../../fields/Types";
+import { undoBatch } from "../../util/UndoManager";
+import { SearchBox } from "../search/SearchBox";
+import { ColumnType } from "./CollectionSchemaView";
+import "./CollectionSchemaView.scss";
+import { CollectionView } from "./CollectionView";
+
+const higflyout = require("@hig/flyout");
+export const { anchorPoints } = higflyout;
+export const Flyout = higflyout.default;
+
+
+export interface AddColumnHeaderProps {
+    createColumn: () => void;
+}
+
+@observer
+export class CollectionSchemaAddColumnHeader extends React.Component<AddColumnHeaderProps> {
+    render() {
+        return (
+            <button className="add-column" onClick={() => this.props.createColumn()}><FontAwesomeIcon icon="plus" size="sm" /></button>
+        );
+    }
+}
+
+
+export interface ColumnMenuProps {
+    columnField: SchemaHeaderField;
+    // keyValue: string;
+    possibleKeys: string[];
+    existingKeys: string[];
+    // keyType: ColumnType;
+    typeConst: boolean;
+    menuButtonContent: JSX.Element;
+    addNew: boolean;
+    onSelect: (oldKey: string, newKey: string, addnew: boolean) => void;
+    setIsEditing: (isEditing: boolean) => void;
+    deleteColumn: (column: string) => void;
+    onlyShowOptions: boolean;
+    setColumnType: (column: SchemaHeaderField, type: ColumnType) => void;
+    setColumnSort: (column: SchemaHeaderField, desc: boolean | undefined) => void;
+    anchorPoint?: any;
+    setColumnColor: (column: SchemaHeaderField, color: string) => void;
+}
+@observer
+export class CollectionSchemaColumnMenu extends React.Component<ColumnMenuProps> {
+    @observable private _isOpen: boolean = false;
+    @observable private _node: HTMLDivElement | null = null;
+
+    componentDidMount() { document.addEventListener("pointerdown", this.detectClick); }
+
+    componentWillUnmount() { document.removeEventListener("pointerdown", this.detectClick); }
+
+    @action
+    detectClick = (e: PointerEvent) => {
+        !this._node?.contains(e.target as Node) && this.props.setIsEditing(this._isOpen = false);
+    }
+
+    @action
+    toggleIsOpen = (): void => {
+        this.props.setIsEditing(this._isOpen = !this._isOpen);
+    }
+
+    changeColumnType = (type: ColumnType) => {
+        this.props.setColumnType(this.props.columnField, type);
+    }
+
+    changeColumnSort = (desc: boolean | undefined) => {
+        this.props.setColumnSort(this.props.columnField, desc);
+    }
+
+    changeColumnColor = (color: string) => {
+        this.props.setColumnColor(this.props.columnField, color);
+    }
+
+    @action
+    setNode = (node: HTMLDivElement): void => {
+        if (node) {
+            this._node = node;
+        }
+    }
+
+    renderTypes = () => {
+        if (this.props.typeConst) return (null);
+
+        const type = this.props.columnField.type;
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Column type:</label>
+                <div className="columnMenu-types">
+                    <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Any)}>
+                        <FontAwesomeIcon icon={"align-justify"} size="sm" />
+                        Any
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Number)}>
+                        <FontAwesomeIcon icon={"hashtag"} size="sm" />
+                        Number
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.String)}>
+                        <FontAwesomeIcon icon={"font"} size="sm" />
+                        Text
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Boolean)}>
+                        <FontAwesomeIcon icon={"check-square"} size="sm" />
+                        Checkbox
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.List)}>
+                        <FontAwesomeIcon icon={"list-ul"} size="sm" />
+                        List
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Doc)}>
+                        <FontAwesomeIcon icon={"file"} size="sm" />
+                        Document
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Image)}>
+                        <FontAwesomeIcon icon={"image"} size="sm" />
+                        Image
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Date)}>
+                        <FontAwesomeIcon icon={"calendar"} size="sm" />
+                        Date
+                    </div>
+                </div>
+            </div >
+        );
+    }
+
+    renderSorting = () => {
+        const sort = this.props.columnField.desc;
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Sort by:</label>
+                <div className="columnMenu-sort">
+                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.changeColumnSort(true)}>
+                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
+                        Sort descending
+                    </div>
+                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.changeColumnSort(false)}>
+                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
+                        Sort ascending
+                    </div>
+                    <div className="columnMenu-option" onClick={() => this.changeColumnSort(undefined)}>
+                        <FontAwesomeIcon icon="times" size="sm" />
+                        Clear sorting
+                    </div>
+                </div>
+            </div>
+        );
+    }
+
+    renderColors = () => {
+        const selected = this.props.columnField.color;
+
+        const pink = PastelSchemaPalette.get("pink2");
+        const purple = PastelSchemaPalette.get("purple2");
+        const blue = PastelSchemaPalette.get("bluegreen1");
+        const yellow = PastelSchemaPalette.get("yellow4");
+        const red = PastelSchemaPalette.get("red2");
+        const gray = "#f1efeb";
+
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Color:</label>
+                <div className="columnMenu-colors">
+                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.changeColumnColor(pink!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.changeColumnColor(purple!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.changeColumnColor(blue!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.changeColumnColor(yellow!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.changeColumnColor(red!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.changeColumnColor(gray)}></div>
+                </div>
+            </div>
+        );
+    }
+
+    renderContent = () => {
+        return (
+            <div className="collectionSchema-header-menuOptions">
+                {this.props.onlyShowOptions ? <></> :
+                    <>
+                        {this.renderTypes()}
+                        {this.renderSorting()}
+                        {this.renderColors()}
+                        <div className="collectionSchema-headerMenu-group">
+                            <button onClick={() => this.props.deleteColumn(this.props.columnField.heading)}>Delete Column</button>
+                        </div>
+                    </>
+                }
+            </div>
+        );
+    }
+
+    render() {
+        return (
+            <div className="collectionSchema-header-menu" ref={this.setNode}>
+                <Flyout anchorPoint={this.props.anchorPoint ? this.props.anchorPoint : anchorPoints.TOP_CENTER} content={this.renderContent()}>
+                    <div className="collectionSchema-header-toggler" onClick={() => this.toggleIsOpen()}>{this.props.menuButtonContent}</div>
+                </ Flyout >
+            </div>
+        );
+    }
+}
+
+
+export interface KeysDropdownProps {
+    keyValue: string;
+    possibleKeys: string[];
+    existingKeys: string[];
+    canAddNew: boolean;
+    addNew: boolean;
+    onSelect: (oldKey: string, newKey: string, addnew: boolean, filter?: string) => void;
+    setIsEditing: (isEditing: boolean) => void;
+    width?: string;
+    docs?: Doc[];
+    Document: Doc;
+    dataDoc: Doc | undefined;
+    fieldKey: string;
+    ContainingCollectionDoc: Doc | undefined;
+    ContainingCollectionView: Opt<CollectionView>;
+    active?: (outsideReaction?: boolean) => boolean;
+    openHeader: (column: any, screenx: number, screeny: number) => void;
+    col: SchemaHeaderField;
+    icon: IconProp;
+}
+@observer
+export class KeysDropdown extends React.Component<KeysDropdownProps> {
+    @observable private _key: string = this.props.keyValue;
+    @observable private _searchTerm: string = this.props.keyValue;
+    @observable private _isOpen: boolean = false;
+    @observable private _node: HTMLDivElement | null = null;
+    @observable private _inputRef: React.RefObject<HTMLInputElement> = React.createRef();
+
+    @action setSearchTerm = (value: string): void => { this._searchTerm = value; };
+    @action setKey = (key: string): void => { this._key = key; };
+    @action setIsOpen = (isOpen: boolean): void => { this._isOpen = isOpen; };
+
+    @action
+    onSelect = (key: string): void => {
+        this.props.onSelect(this._key, key, this.props.addNew);
+        this.setKey(key);
+        this._isOpen = false;
+        this.props.setIsEditing(false);
+    }
+
+    @action
+    setNode = (node: HTMLDivElement): void => {
+        if (node) {
+            this._node = node;
+        }
+    }
+
+    componentDidMount() {
+        document.addEventListener("pointerdown", this.detectClick);
+        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
+        if (filters?.some(filter => filter.split(":")[0] === this._key)) {
+            runInAction(() => this.closeResultsVisibility = "contents");
+        }
+    }
+
+    @action
+    detectClick = (e: PointerEvent): void => {
+        if (this._node && this._node.contains(e.target as Node)) {
+        } else {
+            this._isOpen = false;
+            this.props.setIsEditing(false);
+        }
+    }
+
+    private tempfilter: string = "";
+    @undoBatch
+    onKeyDown = (e: React.KeyboardEvent): void => {
+        if (e.key === "Enter") {
+            if (this._searchTerm.includes(":")) {
+                const colpos = this._searchTerm.indexOf(":");
+                const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
+                if (temp === "") {
+                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
+                    this.updateFilter();
+                }
+                else {
+                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
+                    this.tempfilter = temp;
+                    Doc.setDocFilter(this.props.Document, this._key, temp, "check");
+                    this.props.col.setColor("green");
+                    this.closeResultsVisibility = "contents";
+                }
+            }
+            else {
+                Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
+                this.updateFilter();
+                if (this.showKeys.length) {
+                    this.onSelect(this.showKeys[0]);
+                } else if (this._searchTerm !== "" && this.props.canAddNew) {
+                    this.setSearchTerm(this._searchTerm || this._key);
+                    this.onSelect(this._searchTerm);
+                }
+            }
+        }
+    }
+
+    onChange = (val: string): void => {
+        this.setSearchTerm(val);
+    }
+
+    @action
+    onFocus = (e: React.FocusEvent): void => {
+        this._isOpen = true;
+        this.props.setIsEditing(true);
+    }
+
+    @computed get showKeys() {
+        const whitelistKeys = ["context", "author", "*lastModified", "text", "data", "tags", "creationDate"];
+        const keyOptions = this._searchTerm === "" ? this.props.possibleKeys : this.props.possibleKeys.filter(key => key.toUpperCase().indexOf(this._searchTerm.toUpperCase()) > -1);
+        const showKeys = new Set<string>();
+        [...keyOptions, ...whitelistKeys].forEach(key => (!Doc.UserDoc().noviceMode ||
+            whitelistKeys.includes(key)
+            || ((!key.startsWith("_") && key[0] === key[0].toUpperCase()) || key[0] === "#")) ? showKeys.add(key) : null);
+        return Array.from(showKeys.keys()).filter(key => !this._searchTerm || key.includes(this._searchTerm));
+    }
+    @action
+    renderOptions = (): JSX.Element[] | JSX.Element => {
+        if (!this._isOpen) {
+            this.defaultMenuHeight = 0;
+            return <></>;
+        }
+        const options = this.showKeys.map(key => {
+            return <div key={key} className="key-option" style={{
+                border: "1px solid lightgray",
+                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
+            }}
+                onPointerDown={e => {
+                    e.stopPropagation();
+                }}
+                onClick={() => {
+                    this.onSelect(key);
+                    this.setSearchTerm("");
+                }}>{key}</div>;
+        });
+
+        // if search term does not already exist as a group type, give option to create new group type
+
+        if (this._key !== this._searchTerm.slice(0, this._key.length)) {
+            if (this._searchTerm !== "" && this.props.canAddNew) {
+                options.push(<div key={""} className="key-option" style={{
+                    border: "1px solid lightgray", width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
+                }}
+                    onClick={() => { this.onSelect(this._searchTerm); this.setSearchTerm(""); }}>
+                    Create "{this._searchTerm}" key</div>);
+            }
+        }
+
+        if (options.length === 0) {
+            this.defaultMenuHeight = 0;
+        }
+        else {
+            if (this.props.docs) {
+                const panesize = this.props.docs.length * 30;
+                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+            else {
+                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+        }
+        return options;
+    }
+
+    docSafe: Doc[] = [];
+
+    @action
+    renderFilterOptions = (): JSX.Element[] | JSX.Element => {
+        if (!this._isOpen || !this.props.dataDoc) {
+            this.defaultMenuHeight = 0;
+            return <></>;
+        }
+        const keyOptions: string[] = [];
+        const colpos = this._searchTerm.indexOf(":");
+        const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
+        if (this.docSafe.length === 0) {
+            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
+        }
+        const docs = this.docSafe;
+        docs.forEach((doc) => {
+            const key = StrCast(doc[this._key]);
+            if (keyOptions.includes(key) === false && key.includes(temp) && key !== "") {
+                keyOptions.push(key);
+            }
+        });
+
+        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
+        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
+            this.props.col.setColor("rgb(241, 239, 235)");
+            this.closeResultsVisibility = "none";
+        }
+        for (let i = 0; i < (filters?.length ?? 0) - 1; i++) {
+            if (filters![i] === this.props.col.heading && keyOptions.includes(filters![i].split(":")[1]) === false) {
+                keyOptions.push(filters![i + 1]);
+            }
+        }
+        const options = keyOptions.map(key => {
+            let bool = false;
+            if (filters !== undefined) {
+                const ind = filters.findIndex(filter => filter.split(":")[0] === key);
+                const fields = ind === -1 ? undefined : filters[ind].split(":");
+                bool = fields ? fields[1] === "check" : false;
+            }
+            return <div key={key} className="key-option" style={{
+                border: "1px solid lightgray", paddingLeft: 5, textAlign: "left",
+                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white", backgroundColor: "white",
+            }}
+            >
+                <input type="checkbox"
+                    onPointerDown={e => e.stopPropagation()}
+                    onClick={e => e.stopPropagation()}
+                    onChange={(e) => {
+                        e.target.checked === true ? Doc.setDocFilter(this.props.Document, this._key, key, "check") : Doc.setDocFilter(this.props.Document, this._key, key, "remove");
+                        e.target.checked === true ? this.closeResultsVisibility = "contents" : console.log("");
+                        e.target.checked === true ? this.props.col.setColor("green") : this.updateFilter();
+                        e.target.checked === true && SearchBox.Instance.filter === true ? Doc.setDocFilter(docs[0], this._key, key, "check") : Doc.setDocFilter(docs[0], this._key, key, "remove");
+                    }}
+                    checked={bool}
+                />
+                <span style={{ paddingLeft: 4 }}>
+                    {key}
+                </span>
+
+            </div>;
+        });
+        if (options.length === 0) {
+            this.defaultMenuHeight = 0;
+        }
+        else {
+            if (this.props.docs) {
+                const panesize = this.props.docs.length * 30;
+                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+            else {
+                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+
+        }
+        return options;
+    }
+
+    @observable defaultMenuHeight = 0;
+
+
+    updateFilter() {
+        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
+        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
+            this.props.col.setColor("rgb(241, 239, 235)");
+            this.closeResultsVisibility = "none";
+        }
+    }
+
+    @computed get scriptField() {
+        const scriptText = "setDocFilter(containingTreeView, heading, this.title, checked)";
+        const script = ScriptField.MakeScript(scriptText, { this: Doc.name, heading: "string", checked: "string", containingTreeView: Doc.name });
+        return script ? () => script : undefined;
+    }
+    filterBackground = () => "rgba(105, 105, 105, 0.432)";
+    @observable filterOpen: boolean | undefined = undefined;
+    closeResultsVisibility: string = "none";
+
+    removeFilters = (e: React.PointerEvent): void => {
+        const keyOptions: string[] = [];
+        if (this.docSafe.length === 0 && this.props.dataDoc) {
+            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
+        }
+        const docs = this.docSafe;
+        docs.forEach((doc) => {
+            const key = StrCast(doc[this._key]);
+            if (keyOptions.includes(key) === false) {
+                keyOptions.push(key);
+            }
+        });
+
+        Doc.setDocFilter(this.props.Document, this._key, "", "remove");
+        this.props.col.setColor("rgb(241, 239, 235)");
+        this.closeResultsVisibility = "none";
+    }
+    render() {
+        return (
+            <div style={{ display: "flex" }} ref={this.setNode}>
+                <FontAwesomeIcon onClick={e => { this.props.openHeader(this.props.col, e.clientX, e.clientY); e.stopPropagation(); }} icon={this.props.icon} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} />
+
+                {/* <FontAwesomeIcon icon={fa.faSearchMinus} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} onClick={e => {
+                    runInAction(() => { this._isOpen === undefined ? this._isOpen = true : this._isOpen = !this._isOpen })
+                }} /> */}
+
+                <div className="keys-dropdown" style={{ zIndex: 1, width: this.props.width, maxWidth: this.props.width }}>
+                    <input className="keys-search" style={{ width: "100%" }}
+                        ref={this._inputRef} type="text" value={this._searchTerm} placeholder="Column key" onKeyDown={this.onKeyDown}
+                        onChange={e => this.onChange(e.target.value)}
+                        onClick={(e) => { e.stopPropagation(); this._inputRef.current?.focus(); }}
+                        onFocus={this.onFocus} ></input>
+                    <div style={{ display: this.closeResultsVisibility }}>
+                        <FontAwesomeIcon onPointerDown={this.removeFilters} icon={"times-circle"} size="lg"
+                            style={{ cursor: "hand", color: "grey", padding: 2, left: -20, top: -1, height: 15, position: "relative" }} />
+                    </div>
+                    {!this._isOpen ? (null) : <div className="keys-options-wrapper" style={{
+                        width: this.props.width, maxWidth: this.props.width, height: "auto",
+                    }}>
+                        {this._searchTerm.includes(":") ? this.renderFilterOptions() : this.renderOptions()}
+                    </div>}
+                </div >
+            </div>
+        );
+    }
+}
diff --git a/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx b/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
new file mode 100644
index 000000000..881246bd4
--- /dev/null
+++ b/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
@@ -0,0 +1,258 @@
+import React = require("react");
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action } from "mobx";
+import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
+import { Doc } from "../../../fields/Doc";
+import { SchemaHeaderField } from "../../../fields/SchemaHeaderField";
+import { Cast, FieldValue, StrCast } from "../../../fields/Types";
+import { DocumentManager } from "../../util/DocumentManager";
+import { DragManager, dropActionType, SetupDrag } from "../../util/DragManager";
+import { SnappingManager } from "../../util/SnappingManager";
+import { Transform } from "../../util/Transform";
+import { undoBatch } from "../../util/UndoManager";
+import { ContextMenu } from "../ContextMenu";
+import "./CollectionSchemaView.scss";
+
+export interface MovableColumnProps {
+    columnRenderer: TableCellRenderer;
+    columnValue: SchemaHeaderField;
+    allColumns: SchemaHeaderField[];
+    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columns: SchemaHeaderField[]) => void;
+    ScreenToLocalTransform: () => Transform;
+}
+export class MovableColumn extends React.Component<MovableColumnProps> {
+    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
+    private _colDropDisposer?: DragManager.DragDropDisposer;
+    private _startDragPosition: { x: number, y: number } = { x: 0, y: 0 };
+    private _sensitivity: number = 16;
+    private _dragRef: React.RefObject<HTMLDivElement> = React.createRef();
+
+    onPointerEnter = (e: React.PointerEvent): void => {
+        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
+            this._header!.current!.className = "collectionSchema-col-wrapper";
+            document.addEventListener("pointermove", this.onDragMove, true);
+        }
+    }
+    onPointerLeave = (e: React.PointerEvent): void => {
+        this._header!.current!.className = "collectionSchema-col-wrapper";
+        document.removeEventListener("pointermove", this.onDragMove, true);
+        !e.buttons && document.removeEventListener("pointermove", this.onPointerMove);
+    }
+    onDragMove = (e: PointerEvent): void => {
+        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
+        const before = x[0] < bounds[0];
+        this._header!.current!.className = "collectionSchema-col-wrapper";
+        if (before) this._header!.current!.className += " col-before";
+        if (!before) this._header!.current!.className += " col-after";
+        e.stopPropagation();
+    }
+
+    createColDropTarget = (ele: HTMLDivElement) => {
+        this._colDropDisposer?.();
+        if (ele) {
+            this._colDropDisposer = DragManager.MakeDropTarget(ele, this.colDrop.bind(this));
+        }
+    }
+
+    colDrop = (e: Event, de: DragManager.DropEvent) => {
+        document.removeEventListener("pointermove", this.onDragMove, true);
+        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
+        const before = x[0] < bounds[0];
+        const colDragData = de.complete.columnDragData;
+        if (colDragData) {
+            e.stopPropagation();
+            this.props.reorderColumns(colDragData.colKey, this.props.columnValue, before, this.props.allColumns);
+            return true;
+        }
+        return false;
+    }
+
+    onPointerMove = (e: PointerEvent) => {
+        const onRowMove = (e: PointerEvent) => {
+            e.stopPropagation();
+            e.preventDefault();
+
+            document.removeEventListener("pointermove", onRowMove);
+            document.removeEventListener('pointerup', onRowUp);
+            const dragData = new DragManager.ColumnDragData(this.props.columnValue);
+            DragManager.StartColumnDrag(this._dragRef.current!, dragData, e.x, e.y);
+        };
+        const onRowUp = (): void => {
+            document.removeEventListener("pointermove", onRowMove);
+            document.removeEventListener('pointerup', onRowUp);
+        };
+        if (e.buttons === 1) {
+            const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX - this._startDragPosition.x, e.clientY - this._startDragPosition.y);
+            if (Math.abs(dx) + Math.abs(dy) > this._sensitivity) {
+                document.removeEventListener("pointermove", this.onPointerMove);
+                e.stopPropagation();
+
+                document.addEventListener("pointermove", onRowMove);
+                document.addEventListener("pointerup", onRowUp);
+            }
+        }
+    }
+
+    onPointerUp = (e: React.PointerEvent) => {
+        document.removeEventListener("pointermove", this.onPointerMove);
+    }
+
+    @action
+    onPointerDown = (e: React.PointerEvent, ref: React.RefObject<HTMLDivElement>) => {
+        this._dragRef = ref;
+        const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX, e.clientY);
+        if (!(e.target as any)?.tagName.includes("INPUT")) {
+            this._startDragPosition = { x: dx, y: dy };
+            document.addEventListener("pointermove", this.onPointerMove);
+        }
+    }
+
+
+    render() {
+        const reference = React.createRef<HTMLDivElement>();
+
+        return (
+            <div className="collectionSchema-col" ref={this.createColDropTarget}>
+                <div className="collectionSchema-col-wrapper" ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
+                    <div className="col-dragger" ref={reference} onPointerDown={e => this.onPointerDown(e, reference)} onPointerUp={this.onPointerUp}>
+                        {this.props.columnRenderer}
+                    </div>
+                </div>
+            </div>
+        );
+    }
+}
+
+export interface MovableRowProps {
+    rowInfo: RowInfo;
+    ScreenToLocalTransform: () => Transform;
+    addDoc: (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => boolean;
+    removeDoc: (doc: Doc | Doc[]) => boolean;
+    rowFocused: boolean;
+    textWrapRow: (doc: Doc) => void;
+    rowWrapped: boolean;
+    dropAction: string;
+    addDocTab: any;
+}
+
+export class MovableRow extends React.Component<MovableRowProps> {
+    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
+    private _rowDropDisposer?: DragManager.DragDropDisposer;
+
+    onPointerEnter = (e: React.PointerEvent): void => {
+        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
+            this._header!.current!.className = "collectionSchema-row-wrapper";
+            document.addEventListener("pointermove", this.onDragMove, true);
+        }
+    }
+    onPointerLeave = (e: React.PointerEvent): void => {
+        this._header!.current!.className = "collectionSchema-row-wrapper";
+        document.removeEventListener("pointermove", this.onDragMove, true);
+    }
+    onDragMove = (e: PointerEvent): void => {
+        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
+        const before = x[1] < bounds[1];
+        this._header!.current!.className = "collectionSchema-row-wrapper";
+        if (before) this._header!.current!.className += " row-above";
+        if (!before) this._header!.current!.className += " row-below";
+        e.stopPropagation();
+    }
+    componentWillUnmount() {
+
+        this._rowDropDisposer?.();
+    }
+
+    createRowDropTarget = (ele: HTMLDivElement) => {
+        this._rowDropDisposer?.();
+        if (ele) {
+            this._rowDropDisposer = DragManager.MakeDropTarget(ele, this.rowDrop.bind(this));
+        }
+    }
+
+    rowDrop = (e: Event, de: DragManager.DropEvent) => {
+        this.onPointerLeave(e as any);
+        const rowDoc = FieldValue(Cast(this.props.rowInfo.original, Doc));
+        if (!rowDoc) return false;
+
+        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
+        const before = x[1] < bounds[1];
+
+        const docDragData = de.complete.docDragData;
+        if (docDragData) {
+            e.stopPropagation();
+            if (docDragData.draggedDocuments[0] === rowDoc) return true;
+            const addDocument = (doc: Doc | Doc[]) => this.props.addDoc(doc, rowDoc, before);
+            const movedDocs = docDragData.draggedDocuments;
+            return (docDragData.dropAction || docDragData.userDropAction) ?
+                docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before) || added, false)
+                : (docDragData.moveDocument) ?
+                    movedDocs.reduce((added: boolean, d) => docDragData.moveDocument?.(d, rowDoc, addDocument) || added, false)
+                    : docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before), false);
+        }
+        return false;
+    }
+
+    onRowContextMenu = (e: React.MouseEvent): void => {
+        e.preventDefault();
+        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
+        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
+    }
+
+    @undoBatch
+    @action
+    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
+        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
+        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
+    }
+
+    @action
+    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
+        console.log("yes");
+        if (e.key === "Backspace" || e.key === "Delete") {
+            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
+        }
+    }
+
+    render() {
+        const { children = null, rowInfo } = this.props;
+
+        if (!rowInfo) {
+            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
+        }
+
+        const { original } = rowInfo;
+        const doc = FieldValue(Cast(original, Doc));
+
+        if (!doc) return (null);
+
+        const reference = React.createRef<HTMLDivElement>();
+        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
+
+        let className = "collectionSchema-row";
+        if (this.props.rowFocused) className += " row-focused";
+        if (this.props.rowWrapped) className += " row-wrapped";
+
+        return (
+            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
+                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
+                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
+                        <div className="row-dragger">
+                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
+                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
+                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
+                        </div>
+                        {children}
+                    </ReactTableDefaults.TrComponent>
+                </div>
+            </div>
+        );
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/CollectionSchemaView.scss b/src/client/views/collections/CollectionSchemaView.scss
new file mode 100644
index 000000000..2bdd280ec
--- /dev/null
+++ b/src/client/views/collections/CollectionSchemaView.scss
@@ -0,0 +1,641 @@
+@import "../globalCssVariables";
+
+.collectionSchemaView-container {
+    border-width: $COLLECTION_BORDER_WIDTH;
+    border-color: $intermediate-color;
+    border-style: solid;
+    border-radius: $border-radius;
+    box-sizing: border-box;
+    position: relative;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    margin-top: 0;
+    transition: top 0.5s;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: nowrap;
+    touch-action: none;
+
+    div {
+        touch-action: none;
+    }
+
+
+    .collectionSchemaView-tableContainer {
+        width: 100%;
+        height: 100%;
+    }
+
+    .collectionSchemaView-dividerDragger {
+        position: relative;
+        height: 100%;
+        width: $SCHEMA_DIVIDER_WIDTH;
+        z-index: 20;
+        right: 0;
+        top: 0;
+        background: gray;
+        cursor: col-resize;
+    }
+
+    // .documentView-node:first-child {
+    //     background: $light-color;
+    // }
+}
+
+.collectionSchemaView-searchContainer {
+    border-width: $COLLECTION_BORDER_WIDTH;
+    border-color: $intermediate-color;
+    border-style: solid;
+    border-radius: $border-radius;
+    box-sizing: border-box;
+    position: relative;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    margin-top: 0;
+    transition: top 0.5s;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: nowrap;
+    touch-action: none;
+    padding: 2px;
+
+    div {
+        touch-action: none;
+    }
+
+
+    .collectionSchemaView-tableContainer {
+        width: 100%;
+        height: 100%;
+    }
+
+    .collectionSchemaView-dividerDragger {
+        position: relative;
+        height: 100%;
+        width: 20px;
+        z-index: 20;
+        right: 0;
+        top: 0;
+        background: gray;
+        cursor: col-resize;
+    }
+
+    // .documentView-node:first-child {
+    //     background: $light-color;
+    // }
+}
+
+.ReactTable {
+    width: 100%;
+    background: white;
+    box-sizing: border-box;
+    border: none !important;
+    float: none !important;
+
+    .rt-table {
+        height: 100%;
+        display: -webkit-inline-box;
+        direction: ltr;
+        overflow: visible;
+    }
+    .rt-noData {
+        display: none;
+    }
+
+    .rt-thead {
+        width: 100%;
+        z-index: 100;
+        overflow-y: visible;
+
+        &.-header {
+            font-size: 12px;
+            height: 30px;
+            box-shadow: none;
+            z-index: 100;
+            overflow-y: visible;
+        }
+
+        .rt-resizable-header-content {
+            height: 100%;
+            overflow: visible;
+        }
+
+        .rt-th {
+            padding: 0;
+            border: solid lightgray;
+            border-width: 0 1px;
+            border-bottom: 2px solid lightgray;
+        }
+    }
+
+    .rt-th {
+        font-size: 13px;
+        text-align: center;
+
+        &:last-child {
+            overflow: visible;
+        }
+    }
+
+    .rt-tbody {
+        width: 100%;
+        direction: rtl;
+        overflow: visible;
+
+        .rt-td {
+            border-right: 1px solid rgba(0, 0, 0, 0.2);
+        }
+    }
+
+    .rt-tr-group {
+        direction: ltr;
+        flex: 0 1 auto;
+        min-height: 30px;
+        border: 0 !important;
+    }
+
+    .rt-tr {
+        width: 100%;
+        min-height: 30px;
+    }
+
+    .rt-td {
+        padding: 0;
+        font-size: 13px;
+        text-align: center;
+        white-space: nowrap;
+        display: flex;
+        align-items: center;
+
+        .imageBox-cont {
+            position: relative;
+            max-height: 100%;
+        }
+
+        .imageBox-cont img {
+            object-fit: contain;
+            max-width: 100%;
+            height: 100%;
+        }
+
+        .videoBox-cont {
+            object-fit: contain;
+            width: auto;
+            height: 100%;
+        }
+    }
+    .rt-td.rt-expandable {
+        display: flex;
+        align-items: center;
+        height: inherit;
+    }
+
+    .rt-resizer {
+        width: 8px;
+        right: -4px;
+    }
+
+    .rt-resizable-header {
+        padding: 0;
+        height: 30px;
+    }
+
+    .rt-resizable-header:last-child {
+        overflow: visible;
+
+        .rt-resizer {
+            width: 5px !important;
+        }
+    }
+}
+
+.documentView-node-topmost {
+    text-align: left;
+    transform-origin: center top;
+    display: inline-block;
+}
+
+.collectionSchema-col {
+    height: 100%;
+}
+
+
+.collectionSchema-header-menu {
+    height: auto;
+    z-index: 100;
+    position: absolute;
+    background: white;
+    padding: 5px;
+    position: fixed;
+    background: white;
+    border: black 1px solid;
+
+    .collectionSchema-header-toggler {
+        z-index: 100;
+        width: 100%;
+        height: 100%;
+        padding: 4px;
+        letter-spacing: 2px;
+        text-transform: uppercase;
+
+        svg {
+            margin-right: 4px;
+        }
+    }
+}
+
+.collectionSchemaView-header {
+    height: 100%;
+    color: gray;
+    z-index: 100;
+    overflow-y: visible;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+}
+
+button.add-column {
+    width: 28px;
+}
+
+.collectionSchema-header-menuOptions {
+    color: black;
+    width: 180px;
+    text-align: left;
+
+    .collectionSchema-headerMenu-group {
+        padding: 7px 0;
+        border-bottom: 1px solid lightgray;
+        cursor: pointer;
+
+        &:first-child {
+            padding-top: 0;
+        }
+
+        &:last-child {
+            border: none;
+            text-align: center;
+            padding: 12px 0 0 0;
+        }
+    }
+
+    label {
+        color: $main-accent;
+        font-weight: normal;
+        letter-spacing: 2px;
+        text-transform: uppercase;
+    }
+
+    input {
+        color: black;
+        width: 100%;
+    }
+
+    .columnMenu-option {
+        cursor: pointer;
+        padding: 3px;
+        background-color: white;
+        transition: background-color 0.2s;
+
+        &:hover {
+            background-color: $light-color-secondary;
+        }
+
+        &.active {
+            font-weight: bold;
+            border: 2px solid $light-color-secondary;
+        }
+
+        svg {
+            color: gray;
+            margin-right: 5px;
+            width: 10px;
+        }
+    }
+
+    .keys-dropdown {
+        position: relative;
+        //width: 100%;
+        background-color: white;
+
+        input {
+            border: 2px solid $light-color-secondary;
+            padding: 3px;
+            height: 28px;
+            font-weight: bold;
+            letter-spacing: "2px";
+            text-transform: "uppercase";
+
+            &:focus {
+                font-weight: normal;
+            }
+        }
+
+        .keys-options-wrapper {
+            width: 100%;
+            max-height: 150px;
+            overflow-y: scroll;
+            position: absolute;
+            top: 28px;
+            box-shadow: 0 10px 16px rgba(0, 0, 0, 0.1);
+            background-color: white;
+
+            .key-option {
+                background-color: white;
+                border: 1px solid lightgray;
+                padding: 2px 3px;
+
+                &:not(:first-child) {
+                    border-top: 0;
+                }
+
+                &:hover {
+                    background-color: $light-color-secondary;
+                }
+            }
+        }
+    }
+
+    .columnMenu-colors {
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+
+        .columnMenu-colorPicker {
+            cursor: pointer;
+            width: 20px;
+            height: 20px;
+            border-radius: 10px;
+
+            &.active {
+                border: 2px solid white;
+                box-shadow: 0 0 0 2px lightgray;
+            }
+        }
+    }
+}
+
+.collectionSchema-row {
+    height: 100%;
+    background-color: white;
+
+    &.row-focused .rt-td {
+        background-color: #bfffc0; //$light-color-secondary;
+    }
+
+    &.row-wrapped {
+        .rt-td {
+            white-space: normal;
+        }
+    }
+
+    .row-dragger {
+        display: flex;
+        justify-content: space-around;
+        //flex: 50 0 auto;
+        width: 0;
+        max-width: 50px;
+        //height: 100%;
+        min-height: 30px;
+        align-items: center;
+        color: lightgray;
+        background-color: white;
+        transition: color 0.1s ease;
+
+        .row-option {
+            // padding: 5px;
+            cursor: pointer;
+            position: absolute;
+            transition: color 0.1s ease;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            z-index: 2;
+
+            &:hover {
+                color: gray;
+            }
+        }
+    }
+
+    .collectionSchema-row-wrapper {
+
+        &.row-above {
+            border-top: 1px solid red;
+        }
+
+        &.row-below {
+            border-bottom: 1px solid red;
+        }
+
+        &.row-inside {
+            border: 1px solid red;
+        }
+
+        .row-dragging {
+            background-color: blue;
+        }
+    }
+}
+
+.collectionSchemaView-cellContainer {
+    width: 100%;
+    height: unset;
+}
+
+.collectionSchemaView-cellWrapper {
+    height: 100%;
+    padding: 4px;
+    text-align: left;
+    padding-left: 19px;
+
+    position: relative;
+
+    &:focus {
+        outline: none;
+    }
+
+    &.editing {
+        padding: 0;
+
+        input {
+            outline: 0;
+            border: none;
+            background-color: rgb(255, 217, 217);
+            width: 100%;
+            height: 100%;
+            padding: 2px 3px;
+            min-height: 26px;
+        }
+    }
+
+    &.focused {
+
+        &.inactive {
+            border: none;
+        }
+    }
+
+    p {
+        width: 100%;
+        height: 100%;
+    }
+
+    &:hover .collectionSchemaView-cellContents-docExpander {
+        display: block;
+    }
+
+
+    .collectionSchemaView-cellContents-document {
+        display: inline-block;
+    }
+
+    .collectionSchemaView-cellContents-docButton {
+        float: right;
+        width: "15px";
+        height: "15px";
+    }
+
+    .collectionSchemaView-dropdownWrapper {
+
+        border: grey;
+        border-style: solid;
+        border-width: 1px;
+        height: 30px;
+
+        .collectionSchemaView-dropdownButton {
+
+            //display: inline-block;
+            float: left;
+            height: 100%;
+
+
+        }
+
+        .collectionSchemaView-dropdownText {
+            display: inline-block;
+            //float: right;
+            height: 100%;
+            display: "flex";
+            font-size: 13;
+            justify-content: "center";
+            align-items: "center";
+        }
+
+    }
+
+    .collectionSchemaView-dropdownContainer {
+        position: absolute;
+        border: 1px solid rgba(0, 0, 0, 0.04);
+        box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14);
+
+        .collectionSchemaView-dropdownOption:hover {
+            background-color: rgba(0, 0, 0, 0.14);
+            cursor: pointer;
+        }
+    }
+}
+
+.collectionSchemaView-cellContents-docExpander {
+    height: 30px;
+    width: 30px;
+    display: none;
+    position: absolute;
+    top: 0;
+    right: 0;
+    background-color: lightgray;
+
+}
+
+.doc-drag-over {
+    background-color: red;
+}
+
+.collectionSchemaView-toolbar {
+    z-index: 100;
+}
+
+.collectionSchemaView-toolbar {
+    height: 30px;
+    display: flex;
+    justify-content: flex-end;
+    padding: 0 10px;
+    border-bottom: 2px solid gray;
+
+    .collectionSchemaView-toolbar-item {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+    }
+}
+
+#preview-schema-checkbox-div {
+    margin-left: 20px;
+    font-size: 12px;
+}
+
+.collectionSchemaView-table {
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    padding: 3px;
+}
+
+.rt-td.rt-expandable {
+    overflow: visible;
+    position: relative;
+    height:100%;
+    z-index: 1;
+}
+.reactTable-sub {
+    background-color: rgb(252, 252, 252);
+    width: 100%;
+
+    .rt-thead {
+        display: none;
+    }
+
+    .row-dragger {
+        background-color: rgb(252, 252, 252);
+    }
+
+    .rt-table {
+        background-color: rgb(252, 252, 252);
+    }
+
+    .collectionSchemaView-table {
+        width: 100%; 
+        border: solid 1px;
+        overflow: visible;
+        padding: 0px;
+    }
+}
+
+.collectionSchemaView-expander {
+    height: 100%;
+    min-height: 30px;
+    position: absolute;
+    color: gray;
+    width: 20;
+    height: auto;
+    left: 55;
+
+    svg {
+        position: absolute;
+        top: 50%;
+        left: 10;
+        transform: translate(-50%, -50%);
+    }
+}
+
+.collectionSchemaView-addRow {
+    color: gray;
+    letter-spacing: 2px;
+    text-transform: uppercase;
+    cursor: pointer;
+    font-size: 10.5px;
+    margin-left: 50px;
+    margin-top: 10px;
+}
\ No newline at end of file
diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx
new file mode 100644
index 000000000..b33c437a9
--- /dev/null
+++ b/src/client/views/collections/CollectionSchemaView.tsx
@@ -0,0 +1,575 @@
+import React = require("react");
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { action, computed, observable, untracked } from "mobx";
+import { observer } from "mobx-react";
+import Measure from "react-measure";
+import { Resize } from "react-table";
+import "react-table/react-table.css";
+import { Doc, Opt } from "../../../fields/Doc";
+import { List } from "../../../fields/List";
+import { listSpec } from "../../../fields/Schema";
+import { PastelSchemaPalette, SchemaHeaderField } from "../../../fields/SchemaHeaderField";
+import { Cast, NumCast } from "../../../fields/Types";
+import { TraceMobx } from "../../../fields/util";
+import { emptyFunction, emptyPath, returnFalse, setupMoveUpEvents, returnEmptyDoclist, returnTrue } from "../../../Utils";
+import { SelectionManager } from "../../util/SelectionManager";
+import { SnappingManager } from "../../util/SnappingManager";
+import { Transform } from "../../util/Transform";
+import { undoBatch } from "../../util/UndoManager";
+import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../views/globalCssVariables.scss';
+import { ContextMenu } from "../ContextMenu";
+import { ContextMenuProps } from "../ContextMenuItem";
+import '../DocumentDecorations.scss';
+import { DocumentView } from "../nodes/DocumentView";
+import { DefaultStyleProvider } from "../StyleProvider";
+import "./CollectionSchemaView.scss";
+import { CollectionSubView } from "./CollectionSubView";
+import { SchemaTable } from "./SchemaTable";
+import { DocUtils } from "../../documents/Documents";
+// bcz: need to add drag and drop of rows and columns.  This seems like it might work for rows: https://codesandbox.io/s/l94mn1q657
+
+export enum ColumnType {
+    Any,
+    Number,
+    String,
+    Boolean,
+    Doc,
+    Image,
+    List,
+    Date
+}
+// this map should be used for keys that should have a const type of value
+const columnTypes: Map<string, ColumnType> = new Map([
+    ["title", ColumnType.String],
+    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
+    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
+    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
+]);
+
+@observer
+export class CollectionSchemaView extends CollectionSubView(doc => doc) {
+    private _previewCont?: HTMLDivElement;
+
+    @observable _previewDoc: Doc | undefined = undefined;
+    @observable _focusedTable: Doc = this.props.Document;
+    @observable _col: any = "";
+    @observable _menuWidth = 0;
+    @observable _headerOpen = false;
+    @observable _headerIsEditing = false;
+    @observable _menuHeight = 0;
+    @observable _pointerX = 0;
+    @observable _pointerY = 0;
+    @observable _openTypes: boolean = false;
+
+    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
+    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
+    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
+    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
+    @computed get scale() { return this.props.ScreenToLocalTransform().Scale; }
+    @computed get columns() { return Cast(this.props.Document._schemaHeaders, listSpec(SchemaHeaderField), []); }
+    set columns(columns: SchemaHeaderField[]) { this.props.Document._schemaHeaders = new List<SchemaHeaderField>(columns); }
+
+    @computed get menuCoordinates() {
+        let searchx = 0;
+        let searchy = 0;
+        if (this.props.Document._searchDoc) {
+            const el = document.getElementsByClassName("collectionSchemaView-searchContainer")[0];
+            if (el !== undefined) {
+                const rect = el.getBoundingClientRect();
+                searchx = rect.x;
+                searchy = rect.y;
+            }
+        }
+        const x = Math.max(0, Math.min(document.body.clientWidth - this._menuWidth, this._pointerX)) - searchx;
+        const y = Math.max(0, Math.min(document.body.clientHeight - this._menuHeight, this._pointerY)) - searchy;
+        return this.props.ScreenToLocalTransform().transformPoint(x, y);
+    }
+
+    get documentKeys() {
+        const docs = this.childDocs;
+        const keys: { [key: string]: boolean } = {};
+        // bcz: ugh.  this is untracked since otherwise a large collection of documents will blast the server for all their fields.
+        //  then as each document's fields come back, we update the documents _proxies.  Each time we do this, the whole schema will be
+        //  invalidated and re-rendered.   This workaround will inquire all of the document fields before the options button is clicked.
+        //  then by the time the options button is clicked, all of the fields should be in place.  If a new field is added while this menu
+        //  is displayed (unlikely) it won't show up until something else changes.
+        //TODO Types
+        untracked(() => docs.map(doc => Doc.GetAllPrototypes(doc).map(proto => Object.keys(proto).forEach(key => keys[key] = false))));
+
+        this.columns.forEach(key => keys[key.heading] = true);
+        return Array.from(Object.keys(keys));
+    }
+
+    @action setHeaderIsEditing = (isEditing: boolean) => this._headerIsEditing = isEditing;
+
+    @undoBatch
+    setColumnType = action((columnField: SchemaHeaderField, type: ColumnType): void => {
+        this._openTypes = false;
+        if (columnTypes.get(columnField.heading)) return;
+
+        const columns = this.columns;
+        const index = columns.indexOf(columnField);
+        if (index > -1) {
+            columnField.setType(NumCast(type));
+            columns[index] = columnField;
+            this.columns = columns;
+        }
+    });
+
+    @undoBatch
+    setColumnColor = (columnField: SchemaHeaderField, color: string): void => {
+        const columns = this.columns;
+        const index = columns.indexOf(columnField);
+        if (index > -1) {
+            columnField.setColor(color);
+            columns[index] = columnField;
+            this.columns = columns; // need to set the columns to trigger rerender
+        }
+    }
+
+    @undoBatch
+    @action
+    setColumnSort = (columnField: SchemaHeaderField, descending: boolean | undefined) => {
+        const columns = this.columns;
+        columns.forEach(col => col.setDesc(undefined));
+
+        const index = columns.findIndex(c => c.heading === columnField.heading);
+        const column = columns[index];
+        column.setDesc(descending);
+        columns[index] = column;
+        this.columns = columns;
+    }
+
+    renderTypes = (col: any) => {
+        if (columnTypes.get(col.heading)) return (null);
+
+        const type = col.type;
+
+        const anyType = <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Any)}>
+            <FontAwesomeIcon icon={"align-justify"} size="sm" />
+                Any
+            </div>;
+
+        const numType = <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Number)}>
+            <FontAwesomeIcon icon={"hashtag"} size="sm" />
+                Number
+            </div>;
+
+        const textType = <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.String)}>
+            <FontAwesomeIcon icon={"font"} size="sm" />
+            Text
+            </div>;
+
+        const boolType = <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Boolean)}>
+            <FontAwesomeIcon icon={"check-square"} size="sm" />
+            Checkbox
+            </div>;
+
+        const listType = <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.List)}>
+            <FontAwesomeIcon icon={"list-ul"} size="sm" />
+            List
+            </div>;
+
+        const docType = <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Doc)}>
+            <FontAwesomeIcon icon={"file"} size="sm" />
+            Document
+            </div>;
+
+        const imageType = <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Image)}>
+            <FontAwesomeIcon icon={"image"} size="sm" />
+            Image
+            </div>;
+
+        const dateType = <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Date)}>
+            <FontAwesomeIcon icon={"calendar"} size="sm" />
+                Date
+                </div>;
+
+
+        const allColumnTypes = <div className="columnMenu-types">
+            {anyType}
+            {numType}
+            {textType}
+            {boolType}
+            {listType}
+            {docType}
+            {imageType}
+            {dateType}
+        </div>;
+
+        const justColType = type === ColumnType.Any ? anyType : type === ColumnType.Number ? numType :
+            type === ColumnType.String ? textType : type === ColumnType.Boolean ? boolType :
+                type === ColumnType.List ? listType : type === ColumnType.Doc ? docType :
+                    type === ColumnType.Date ? dateType : imageType;
+
+        return (
+            <div className="collectionSchema-headerMenu-group" onClick={action(() => this._openTypes = !this._openTypes)}>
+                <div>
+                    <label style={{ cursor: "pointer" }}>Column type:</label>
+                    <FontAwesomeIcon icon={"caret-down"} size="lg" style={{ float: "right", transform: `rotate(${this._openTypes ? "180deg" : 0})`, transition: "0.2s all ease" }} />
+                </div>
+                {this._openTypes ? allColumnTypes : justColType}
+            </div >
+        );
+    }
+
+    renderSorting = (col: any) => {
+        const sort = col.desc;
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Sort by:</label>
+                <div className="columnMenu-sort">
+                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.setColumnSort(col, true)}>
+                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
+                        Sort descending
+                    </div>
+                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.setColumnSort(col, false)}>
+                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
+                        Sort ascending
+                    </div>
+                    <div className="columnMenu-option" onClick={() => this.setColumnSort(col, undefined)}>
+                        <FontAwesomeIcon icon="times" size="sm" />
+                        Clear sorting
+                    </div>
+                </div>
+            </div>
+        );
+    }
+
+    renderColors = (col: any) => {
+        const selected = col.color;
+
+        const pink = PastelSchemaPalette.get("pink2");
+        const purple = PastelSchemaPalette.get("purple2");
+        const blue = PastelSchemaPalette.get("bluegreen1");
+        const yellow = PastelSchemaPalette.get("yellow4");
+        const red = PastelSchemaPalette.get("red2");
+        const gray = "#f1efeb";
+
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Color:</label>
+                <div className="columnMenu-colors">
+                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.setColumnColor(col, pink!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.setColumnColor(col, purple!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.setColumnColor(col, blue!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.setColumnColor(col, yellow!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.setColumnColor(col, red!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.setColumnColor(col, gray)}></div>
+                </div>
+            </div>
+        );
+    }
+
+    @undoBatch
+    @action
+    changeColumns = (oldKey: string, newKey: string, addNew: boolean, filter?: string) => {
+        const columns = this.columns;
+        if (columns === undefined) {
+            this.columns = new List<SchemaHeaderField>([new SchemaHeaderField(newKey, "f1efeb")]);
+        } else {
+            if (addNew) {
+                columns.push(new SchemaHeaderField(newKey, "f1efeb"));
+                this.columns = columns;
+            } else {
+                const index = columns.map(c => c.heading).indexOf(oldKey);
+                if (index > -1) {
+                    const column = columns[index];
+                    column.setHeading(newKey);
+                    columns[index] = column;
+                    this.columns = columns;
+                    if (filter) {
+                        Doc.setDocFilter(this.props.Document, newKey, filter, "match");
+                    }
+                    else {
+                        this.props.Document._docFilters = undefined;
+                    }
+                }
+            }
+        }
+    }
+
+    @action
+    openHeader = (col: any, screenx: number, screeny: number) => {
+        this._col = col;
+        this._headerOpen = true;
+        this._pointerX = screenx;
+        this._pointerY = screeny;
+    }
+
+    @action
+    closeHeader = () => { this._headerOpen = false; }
+
+    @undoBatch
+    @action
+    deleteColumn = (key: string) => {
+        const columns = this.columns;
+        if (columns === undefined) {
+            this.columns = new List<SchemaHeaderField>([]);
+        } else {
+            const index = columns.map(c => c.heading).indexOf(key);
+            if (index > -1) {
+                columns.splice(index, 1);
+                this.columns = columns;
+            }
+        }
+        this.closeHeader();
+    }
+
+    getPreviewTransform = (): Transform => {
+        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - NumCast(COLLECTION_BORDER_WIDTH) - this.tableWidth, - this.borderWidth);
+    }
+
+    @action
+    onHeaderClick = (e: React.PointerEvent) => {
+        e.stopPropagation();
+    }
+
+    @action
+    onWheel(e: React.WheelEvent) {
+        const scale = this.props.ScreenToLocalTransform().Scale;
+        this.props.isContentActive(true) && e.stopPropagation();
+    }
+
+    @computed get renderMenuContent() {
+        TraceMobx();
+        return <div className="collectionSchema-header-menuOptions">
+            {this.renderTypes(this._col)}
+            {this.renderColors(this._col)}
+            <div className="collectionSchema-headerMenu-group">
+                <button onClick={() => { this.deleteColumn(this._col.heading); }}
+                >Delete Column</button>
+            </div>
+        </div>;
+    }
+
+    private createTarget = (ele: HTMLDivElement) => {
+        this._previewCont = ele;
+        super.CreateDropTarget(ele);
+    }
+
+    isFocused = (doc: Doc, outsideReaction: boolean): boolean => this.props.isSelected(outsideReaction) && doc === this._focusedTable;
+
+    @action setFocused = (doc: Doc) => this._focusedTable = doc;
+
+    @action setPreviewDoc = (doc: Opt<Doc>) => {
+        SelectionManager.SelectSchemaView(this, doc);
+        this._previewDoc = doc;
+    }
+
+    //toggles preview side-panel of schema
+    @action
+    toggleExpander = () => {
+        this.props.Document.schemaPreviewWidth = this.previewWidth() === 0 ? Math.min(this.tableWidth / 3, 200) : 0;
+    }
+
+    onDividerDown = (e: React.PointerEvent) => {
+        setupMoveUpEvents(this, e, this.onDividerMove, emptyFunction, this.toggleExpander);
+    }
+    @action
+    onDividerMove = (e: PointerEvent, down: number[], delta: number[]) => {
+        const nativeWidth = this._previewCont!.getBoundingClientRect();
+        const minWidth = 40;
+        const maxWidth = 1000;
+        const movedWidth = this.props.ScreenToLocalTransform().transformDirection(nativeWidth.right - e.clientX, 0)[0];
+        const width = movedWidth < minWidth ? minWidth : movedWidth > maxWidth ? maxWidth : movedWidth;
+        this.props.Document.schemaPreviewWidth = width;
+        return false;
+    }
+
+    onPointerDown = (e: React.PointerEvent): void => {
+        if (e.button === 0 && !e.altKey && !e.ctrlKey && !e.metaKey) {
+            if (this.props.isSelected(true)) e.stopPropagation();
+            else this.props.select(false);
+        }
+    }
+
+    @computed
+    get previewDocument(): Doc | undefined { return this._previewDoc; }
+
+    @computed
+    get dividerDragger() {
+        return this.previewWidth() === 0 ? (null) :
+            <div className="collectionSchemaView-dividerDragger" onPointerDown={this.onDividerDown} >
+                <div className="collectionSchemaView-dividerDragger" />
+            </div>;
+    }
+
+    @computed
+    get previewPanel() {
+        return <div ref={this.createTarget} style={{ width: `${this.previewWidth()}px` }}>
+            {!this.previewDocument ? (null) :
+                <DocumentView
+                    Document={this.previewDocument}
+                    DataDoc={undefined}
+                    fitContentsToDoc={returnTrue}
+                    freezeDimensions={true}
+                    dontCenter={"y"}
+                    focus={DocUtils.DefaultFocus}
+                    renderDepth={this.props.renderDepth}
+                    rootSelected={this.rootSelected}
+                    PanelWidth={this.previewWidth}
+                    PanelHeight={this.previewHeight}
+                    isContentActive={returnTrue}
+                    isDocumentActive={returnFalse}
+                    ScreenToLocalTransform={this.getPreviewTransform}
+                    docFilters={this.docFilters}
+                    docRangeFilters={this.docRangeFilters}
+                    searchFilterDocs={this.searchFilterDocs}
+                    styleProvider={DefaultStyleProvider}
+                    layerProvider={undefined}
+                    docViewPath={returnEmptyDoclist}
+                    ContainingCollectionDoc={this.props.CollectionView?.props.Document}
+                    ContainingCollectionView={this.props.CollectionView}
+                    moveDocument={this.props.moveDocument}
+                    addDocument={this.props.addDocument}
+                    removeDocument={this.props.removeDocument}
+                    whenChildContentsActiveChanged={this.props.whenChildContentsActiveChanged}
+                    addDocTab={this.props.addDocTab}
+                    pinToPres={this.props.pinToPres}
+                    bringToFront={returnFalse}
+                />}
+        </div>;
+    }
+
+    @computed
+    get schemaTable() {
+        return <SchemaTable
+            Document={this.props.Document}
+            PanelHeight={this.props.PanelHeight}
+            PanelWidth={this.props.PanelWidth}
+            childDocs={this.childDocs}
+            CollectionView={this.props.CollectionView}
+            ContainingCollectionView={this.props.ContainingCollectionView}
+            ContainingCollectionDoc={this.props.ContainingCollectionDoc}
+            fieldKey={this.props.fieldKey}
+            renderDepth={this.props.renderDepth}
+            moveDocument={this.props.moveDocument}
+            ScreenToLocalTransform={this.props.ScreenToLocalTransform}
+            active={this.props.isContentActive}
+            onDrop={this.onExternalDrop}
+            addDocTab={this.props.addDocTab}
+            pinToPres={this.props.pinToPres}
+            isSelected={this.props.isSelected}
+            isFocused={this.isFocused}
+            setFocused={this.setFocused}
+            setPreviewDoc={this.setPreviewDoc}
+            deleteDocument={this.props.removeDocument}
+            addDocument={this.props.addDocument}
+            dataDoc={this.props.DataDoc}
+            columns={this.columns}
+            documentKeys={this.documentKeys}
+            headerIsEditing={this._headerIsEditing}
+            openHeader={this.openHeader}
+            onClick={this.onTableClick}
+            onPointerDown={emptyFunction}
+            onResizedChange={this.onResizedChange}
+            setColumns={this.setColumns}
+            reorderColumns={this.reorderColumns}
+            changeColumns={this.changeColumns}
+            setHeaderIsEditing={this.setHeaderIsEditing}
+            changeColumnSort={this.setColumnSort}
+        />;
+    }
+
+    @computed
+    public get schemaToolbar() {
+        return <div className="collectionSchemaView-toolbar">
+            <div className="collectionSchemaView-toolbar-item">
+                <div id="preview-schema-checkbox-div">
+                    <input type="checkbox" key={"Show Preview"} checked={this.previewWidth() !== 0} onChange={this.toggleExpander} />
+                    Show Preview
+                </div>
+            </div>
+        </div>;
+    }
+
+    onSpecificMenu = (e: React.MouseEvent) => {
+        if ((e.target as any)?.className?.includes?.("collectionSchemaView-cell") || (e.target instanceof HTMLSpanElement)) {
+            const cm = ContextMenu.Instance;
+            const options = cm.findByDescription("Options...");
+            const optionItems: ContextMenuProps[] = options && "subitems" in options ? options.subitems : [];
+            optionItems.push({ description: "remove", event: () => this._previewDoc && this.props.removeDocument?.(this._previewDoc), icon: "trash" });
+            !options && cm.addItem({ description: "Options...", subitems: optionItems, icon: "compass" });
+            cm.displayMenu(e.clientX, e.clientY);
+            (e.nativeEvent as any).SchemaHandled = true; // not sure why this is needed, but if you right-click quickly on a cell, the Document/Collection contextMenu handlers still fire without this.
+            e.stopPropagation();
+        }
+    }
+
+    @action
+    onTableClick = (e: React.MouseEvent): void => {
+        if (!(e.target as any)?.className?.includes?.("collectionSchemaView-cell") && !(e.target instanceof HTMLSpanElement)) {
+            this.setPreviewDoc(undefined);
+        } else {
+            e.stopPropagation();
+        }
+        this.setFocused(this.props.Document);
+        this.closeHeader();
+    }
+
+    onResizedChange = (newResized: Resize[], event: any) => {
+        const columns = this.columns;
+        newResized.forEach(resized => {
+            const index = columns.findIndex(c => c.heading === resized.id);
+            const column = columns[index];
+            column.setWidth(resized.value);
+            columns[index] = column;
+        });
+        this.columns = columns;
+    }
+
+    @action
+    setColumns = (columns: SchemaHeaderField[]) => this.columns = columns
+
+    @undoBatch
+    reorderColumns = (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => {
+        const columns = [...columnsValues];
+        const oldIndex = columns.indexOf(toMove);
+        const relIndex = columns.indexOf(relativeTo);
+        const newIndex = (oldIndex > relIndex && !before) ? relIndex + 1 : (oldIndex < relIndex && before) ? relIndex - 1 : relIndex;
+
+        if (oldIndex === newIndex) return;
+
+        columns.splice(newIndex, 0, columns.splice(oldIndex, 1)[0]);
+        this.columns = columns;
+    }
+
+    onZoomMenu = (e: React.WheelEvent) => this.props.isContentActive(true) && e.stopPropagation();
+
+    render() {
+        TraceMobx();
+        if (!this.props.isContentActive()) setTimeout(() => this.closeHeader(), 0);
+        const menuContent = this.renderMenuContent;
+        const menu = <div className="collectionSchema-header-menu"
+            onWheel={e => this.onZoomMenu(e)}
+            onPointerDown={e => this.onHeaderClick(e)}
+            style={{ transform: `translate(${(this.menuCoordinates[0])}px, ${(this.menuCoordinates[1])}px)` }}>
+            <Measure offset onResize={action((r: any) => {
+                const dim = this.props.ScreenToLocalTransform().inverse().transformDirection(r.offset.width, r.offset.height);
+                this._menuWidth = dim[0]; this._menuHeight = dim[1];
+            })}>
+                {({ measureRef }) => <div ref={measureRef}> {menuContent} </div>}
+            </Measure>
+        </div>;
+        return <div className={"collectionSchemaView" + (this.props.Document._searchDoc ? "-searchContainer" : "-container")}
+            style={{
+                overflow: this.props.scrollOverflow === true ? "scroll" : undefined, backgroundColor: "white",
+                pointerEvents: this.props.Document._searchDoc !== undefined && !this.props.isContentActive() && !SnappingManager.GetIsDragging() ? "none" : undefined,
+                width: name === "collectionSchemaView-searchContainer" ? "auto" : this.props.PanelWidth() || "100%", height: this.props.PanelHeight() || "100%", position: "relative",
+            }}  >
+            <div className="collectionSchemaView-tableContainer"
+                style={{ width: `calc(100% - ${this.previewWidth()}px)` }}
+                onContextMenu={this.onSpecificMenu}
+                onPointerDown={this.onPointerDown}
+                onWheel={e => this.props.isContentActive(true) && e.stopPropagation()}
+                onDrop={e => this.onExternalDrop(e, {})}
+                ref={this.createTarget}>
+                {this.schemaTable}
+            </div>
+            {this.dividerDragger}
+            {!this.previewWidth() ? (null) : this.previewPanel}
+            {this._headerOpen && this.props.isContentActive() ? menu : null}
+        </div>;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx
index e5b1721f9..fb60265e3 100644
--- a/src/client/views/collections/CollectionView.tsx
+++ b/src/client/views/collections/CollectionView.tsx
@@ -29,7 +29,7 @@ import CollectionMapView from './CollectionMapView';
 import { CollectionMulticolumnView } from './collectionMulticolumn/CollectionMulticolumnView';
 import { CollectionMultirowView } from './collectionMulticolumn/CollectionMultirowView';
 import { CollectionPileView } from './CollectionPileView';
-import { CollectionSchemaView } from "./schemaView/CollectionSchemaView";
+import { CollectionSchemaView } from "./CollectionSchemaView";
 import { CollectionStackingView } from './CollectionStackingView';
 import { SubCollectionViewProps } from './CollectionSubView';
 import { CollectionTimeView } from './CollectionTimeView';
diff --git a/src/client/views/collections/SchemaTable.tsx b/src/client/views/collections/SchemaTable.tsx
new file mode 100644
index 000000000..0c69ee030
--- /dev/null
+++ b/src/client/views/collections/SchemaTable.tsx
@@ -0,0 +1,599 @@
+import React = require("react");
+import { IconProp } from '@fortawesome/fontawesome-svg-core';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { action, computed, observable } from "mobx";
+import { observer } from "mobx-react";
+import ReactTable, { CellInfo, Column, ComponentPropsGetterR, Resize, SortingRule } from "react-table";
+import "react-table/react-table.css";
+import { DateField } from "../../../fields/DateField";
+import { AclPrivate, AclReadonly, DataSym, Doc, DocListCast, Field, Opt } from "../../../fields/Doc";
+import { Id } from "../../../fields/FieldSymbols";
+import { List } from "../../../fields/List";
+import { listSpec } from "../../../fields/Schema";
+import { SchemaHeaderField } from "../../../fields/SchemaHeaderField";
+import { ComputedField } from "../../../fields/ScriptField";
+import { Cast, FieldValue, NumCast, StrCast } from "../../../fields/Types";
+import { ImageField } from "../../../fields/URLField";
+import { GetEffectiveAcl } from "../../../fields/util";
+import { emptyFunction, emptyPath, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue } from "../../../Utils";
+import { Docs, DocumentOptions, DocUtils } from "../../documents/Documents";
+import { DocumentType } from "../../documents/DocumentTypes";
+import { CompileScript, Transformer, ts } from "../../util/Scripting";
+import { Transform } from "../../util/Transform";
+import { undoBatch } from "../../util/UndoManager";
+import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../views/globalCssVariables.scss';
+import { ContextMenu } from "../ContextMenu";
+import '../DocumentDecorations.scss';
+import { DocumentView } from "../nodes/DocumentView";
+import { DefaultStyleProvider } from "../StyleProvider";
+import { CellProps, CollectionSchemaButtons, CollectionSchemaCell, CollectionSchemaCheckboxCell, CollectionSchemaDateCell, CollectionSchemaDocCell, CollectionSchemaImageCell, CollectionSchemaListCell, CollectionSchemaNumberCell, CollectionSchemaStringCell } from "./CollectionSchemaCells";
+import { CollectionSchemaAddColumnHeader, KeysDropdown } from "./CollectionSchemaHeaders";
+import { MovableColumn, MovableRow } from "./CollectionSchemaMovableTableHOC";
+import "./CollectionSchemaView.scss";
+import { CollectionView } from "./CollectionView";
+
+
+enum ColumnType {
+    Any,
+    Number,
+    String,
+    Boolean,
+    Doc,
+    Image,
+    List,
+    Date
+}
+
+// this map should be used for keys that should have a const type of value
+const columnTypes: Map<string, ColumnType> = new Map([
+    ["title", ColumnType.String],
+    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
+    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
+    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
+]);
+
+export interface SchemaTableProps {
+    Document: Doc; // child doc
+    dataDoc?: Doc;
+    PanelHeight: () => number;
+    PanelWidth: () => number;
+    childDocs?: Doc[];
+    CollectionView: Opt<CollectionView>;
+    ContainingCollectionView: Opt<CollectionView>;
+    ContainingCollectionDoc: Opt<Doc>;
+    fieldKey: string;
+    renderDepth: number;
+    deleteDocument?: (document: Doc | Doc[]) => boolean;
+    addDocument?: (document: Doc | Doc[]) => boolean;
+    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (document: Doc | Doc[]) => boolean) => boolean;
+    ScreenToLocalTransform: () => Transform;
+    active: (outsideReaction: boolean | undefined) => boolean;
+    onDrop: (e: React.DragEvent<Element>, options: DocumentOptions, completed?: (() => void) | undefined) => void;
+    addDocTab: (document: Doc, where: string) => boolean;
+    pinToPres: (document: Doc) => void;
+    isSelected: (outsideReaction?: boolean) => boolean;
+    isFocused: (document: Doc, outsideReaction: boolean) => boolean;
+    setFocused: (document: Doc) => void;
+    setPreviewDoc: (document: Opt<Doc>) => void;
+    columns: SchemaHeaderField[];
+    documentKeys: any[];
+    headerIsEditing: boolean;
+    openHeader: (column: any, screenx: number, screeny: number) => void;
+    onClick: (e: React.MouseEvent) => void;
+    onPointerDown: (e: React.PointerEvent) => void;
+    onResizedChange: (newResized: Resize[], event: any) => void;
+    setColumns: (columns: SchemaHeaderField[]) => void;
+    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => void;
+    changeColumns: (oldKey: string, newKey: string, addNew: boolean) => void;
+    setHeaderIsEditing: (isEditing: boolean) => void;
+    changeColumnSort: (columnField: SchemaHeaderField, descending: boolean | undefined) => void;
+}
+
+@observer
+export class SchemaTable extends React.Component<SchemaTableProps> {
+    @observable _cellIsEditing: boolean = false;
+    @observable _focusedCell: { row: number, col: number } = { row: 0, col: 0 };
+    @observable _openCollections: Set<number> = new Set;
+
+    @observable _showDoc: Doc | undefined;
+    @observable _showDataDoc: any = "";
+    @observable _showDocPos: number[] = [];
+
+    @observable _showTitleDropdown: boolean = false;
+
+    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
+    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
+    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
+
+    @computed get childDocs() {
+        if (this.props.childDocs) return this.props.childDocs;
+
+        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
+        return DocListCast(doc[this.props.fieldKey]);
+    }
+    set childDocs(docs: Doc[]) {
+        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
+        doc[this.props.fieldKey] = new List<Doc>(docs);
+    }
+
+    @computed get textWrappedRows() {
+        return Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
+    }
+    set textWrappedRows(textWrappedRows: string[]) {
+        this.props.Document.textwrappedSchemaRows = new List<string>(textWrappedRows);
+    }
+
+    @computed get resized(): { id: string, value: number }[] {
+        return this.props.columns.reduce((resized, shf) => {
+            (shf.width > -1) && resized.push({ id: shf.heading, value: shf.width });
+            return resized;
+        }, [] as { id: string, value: number }[]);
+    }
+    @computed get sorted(): SortingRule[] {
+        return this.props.columns.reduce((sorted, shf) => {
+            shf.desc !== undefined && sorted.push({ id: shf.heading, desc: shf.desc });
+            return sorted;
+        }, [] as SortingRule[]);
+    }
+
+    @action
+    changeSorting = (col: any) => {
+        this.props.changeColumnSort(col, col.desc === true ? false : col.desc === false ? undefined : true);
+    }
+
+    @action
+    changeTitleMode = () => this._showTitleDropdown = !this._showTitleDropdown
+
+    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
+    @computed get tableColumns(): Column<Doc>[] {
+        const possibleKeys = this.props.documentKeys.filter(key => this.props.columns.findIndex(existingKey => existingKey.heading.toUpperCase() === key.toUpperCase()) === -1);
+        const columns: Column<Doc>[] = [];
+        const tableIsFocused = this.props.isFocused(this.props.Document, false);
+        const focusedRow = this._focusedCell.row;
+        const focusedCol = this._focusedCell.col;
+        const isEditable = !this.props.headerIsEditing;
+
+        columns.push({
+            expander: true, Header: "", width: 58,
+            Expander: (rowInfo) => {
+                return rowInfo.original.type !== DocumentType.COL ? (null) :
+                    <div className="collectionSchemaView-expander" onClick={action(() => (this._openCollections[rowInfo.isExpanded ? "delete" : "add"])(rowInfo.viewIndex))}>
+                        <FontAwesomeIcon icon={rowInfo.isExpanded ? "caret-down" : "caret-right"} size="lg" />
+                    </div>;
+            }
+        });
+        columns.push(...this.props.columns.map(col => {
+            const icon: IconProp = this.getColumnType(col) === ColumnType.Number ? "hashtag" : this.getColumnType(col) === ColumnType.String ? "font" :
+                this.getColumnType(col) === ColumnType.Boolean ? "check-square" : this.getColumnType(col) === ColumnType.Doc ? "file" :
+                    this.getColumnType(col) === ColumnType.Image ? "image" : this.getColumnType(col) === ColumnType.List ? "list-ul" :
+                        this.getColumnType(col) === ColumnType.Date ? "calendar" : "align-justify";
+
+            const keysDropdown = <KeysDropdown
+                keyValue={col.heading}
+                possibleKeys={possibleKeys}
+                existingKeys={this.props.columns.map(c => c.heading)}
+                canAddNew={true}
+                addNew={false}
+                onSelect={this.props.changeColumns}
+                setIsEditing={this.props.setHeaderIsEditing}
+                docs={this.props.childDocs}
+                Document={this.props.Document}
+                dataDoc={this.props.dataDoc}
+                fieldKey={this.props.fieldKey}
+                ContainingCollectionDoc={this.props.ContainingCollectionDoc}
+                ContainingCollectionView={this.props.ContainingCollectionView}
+                active={this.props.active}
+                openHeader={this.props.openHeader}
+                icon={icon}
+                col={col}
+                // try commenting this out
+                width={"100%"}
+            />;
+
+            const sortIcon = col.desc === undefined ? "caret-right" : col.desc === true ? "caret-down" : "caret-up";
+            const header = <div className="collectionSchemaView-menuOptions-wrapper" style={{ background: col.color, padding: "2px", display: "flex", cursor: "default", height: "100%", }}>
+                {keysDropdown}
+                <div onClick={e => this.changeSorting(col)} style={{ width: 21, padding: 1, display: "inline", zIndex: 1, background: "inherit", cursor: "hand" }}>
+                    <FontAwesomeIcon icon={sortIcon} size="lg" />
+                </div>
+            </div>;
+
+            return {
+                Header: <MovableColumn columnRenderer={header} columnValue={col} allColumns={this.props.columns} reorderColumns={this.props.reorderColumns} ScreenToLocalTransform={this.props.ScreenToLocalTransform} />,
+                accessor: (doc: Doc) => doc ? Field.toString(doc[col.heading] as Field) : 0,
+                id: col.heading,
+                Cell: (rowProps: CellInfo) => {
+                    const rowIndex = rowProps.index;
+                    const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
+                    const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
+
+                    const props: CellProps = {
+                        row: rowIndex,
+                        col: columnIndex,
+                        rowProps: rowProps,
+                        isFocused: isFocused,
+                        changeFocusedCellByIndex: this.changeFocusedCellByIndex,
+                        CollectionView: this.props.CollectionView,
+                        ContainingCollection: this.props.ContainingCollectionView,
+                        Document: this.props.Document,
+                        fieldKey: this.props.fieldKey,
+                        renderDepth: this.props.renderDepth,
+                        addDocTab: this.props.addDocTab,
+                        pinToPres: this.props.pinToPres,
+                        moveDocument: this.props.moveDocument,
+                        setIsEditing: this.setCellIsEditing,
+                        isEditable: isEditable,
+                        setPreviewDoc: this.props.setPreviewDoc,
+                        setComputed: this.setComputed,
+                        getField: this.getField,
+                        showDoc: this.showDoc,
+                    };
+
+
+                    switch (this.getColumnType(col, rowProps.original, rowProps.column.id)) {
+                        case ColumnType.Number: return <CollectionSchemaNumberCell {...props} />;
+                        case ColumnType.String: return <CollectionSchemaStringCell {...props} />;
+                        case ColumnType.Boolean: return <CollectionSchemaCheckboxCell {...props} />;
+                        case ColumnType.Doc: return <CollectionSchemaDocCell {...props} />;
+                        case ColumnType.Image: return <CollectionSchemaImageCell {...props} />;
+                        case ColumnType.List: return <CollectionSchemaListCell {...props} />;
+                        case ColumnType.Date: return <CollectionSchemaDateCell {...props} />;
+                        default:
+                            return <CollectionSchemaCell {...props} />;
+                    }
+                },
+                minWidth: 200,
+            };
+        }));
+        columns.push({
+            Header: <CollectionSchemaAddColumnHeader createColumn={this.createColumn} />,
+            accessor: (doc: Doc) => 0,
+            id: "add",
+            Cell: (rowProps: CellInfo) => {
+                const rowIndex = rowProps.index;
+                const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
+                const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
+                return <CollectionSchemaButtons  {...{
+                    row: rowProps.index,
+                    col: columnIndex,
+                    rowProps: rowProps,
+                    isFocused: isFocused,
+                    changeFocusedCellByIndex: this.changeFocusedCellByIndex,
+                    CollectionView: this.props.CollectionView,
+                    ContainingCollection: this.props.ContainingCollectionView,
+                    Document: this.props.Document,
+                    fieldKey: this.props.fieldKey,
+                    renderDepth: this.props.renderDepth,
+                    addDocTab: this.props.addDocTab,
+                    pinToPres: this.props.pinToPres,
+                    moveDocument: this.props.moveDocument,
+                    setIsEditing: this.setCellIsEditing,
+                    isEditable: isEditable,
+                    setPreviewDoc: this.props.setPreviewDoc,
+                    setComputed: this.setComputed,
+                    getField: this.getField,
+                    showDoc: this.showDoc,
+                }} />;
+            },
+            width: 28,
+            resizable: false
+        });
+        return columns;
+    }
+
+
+    constructor(props: SchemaTableProps) {
+        super(props);
+        if (this.props.Document._schemaHeaders === undefined) {
+            this.props.Document._schemaHeaders = new List<SchemaHeaderField>([new SchemaHeaderField("title", "#f1efeb"), new SchemaHeaderField("author", "#f1efeb"), new SchemaHeaderField("*lastModified", "#f1efeb", ColumnType.Date),
+            new SchemaHeaderField("text", "#f1efeb", ColumnType.String), new SchemaHeaderField("type", "#f1efeb"), new SchemaHeaderField("context", "#f1efeb", ColumnType.Doc)]);
+        }
+    }
+
+    componentDidMount() {
+        document.addEventListener("keydown", this.onKeyDown);
+    }
+
+    componentWillUnmount() {
+        document.removeEventListener("keydown", this.onKeyDown);
+    }
+
+    tableAddDoc = (doc: Doc, relativeTo?: Doc, before?: boolean) => {
+        const tableDoc = this.props.Document[DataSym];
+        const effectiveAcl = GetEffectiveAcl(tableDoc);
+
+        if (effectiveAcl !== AclPrivate && effectiveAcl !== AclReadonly) {
+            doc.context = this.props.Document;
+            tableDoc[this.props.fieldKey + "-lastModified"] = new DateField(new Date(Date.now()));
+            return Doc.AddDocToList(this.props.Document, this.props.fieldKey, doc, relativeTo, before);
+        }
+        return false;
+    }
+
+    private getTrProps: ComponentPropsGetterR = (state, rowInfo) => {
+        return !rowInfo ? {} : {
+            ScreenToLocalTransform: this.props.ScreenToLocalTransform,
+            addDoc: this.tableAddDoc,
+            removeDoc: this.props.deleteDocument,
+            rowInfo,
+            rowFocused: !this.props.headerIsEditing && rowInfo.index === this._focusedCell.row && this.props.isFocused(this.props.Document, true),
+            textWrapRow: this.toggleTextWrapRow,
+            rowWrapped: this.textWrappedRows.findIndex(id => rowInfo.original[Id] === id) > -1,
+            dropAction: StrCast(this.props.Document.childDropAction),
+            addDocTab: this.props.addDocTab
+        };
+    }
+
+    private getTdProps: ComponentPropsGetterR = (state, rowInfo, column, instance) => {
+        if (!rowInfo || column) return {};
+
+        const row = rowInfo.index;
+        //@ts-ignore
+        const col = this.columns.map(c => c.heading).indexOf(column!.id);
+        const isFocused = this._focusedCell.row === row && this._focusedCell.col === col && this.props.isFocused(this.props.Document, true);
+        // TODO: editing border doesn't work :(
+        return {
+            style: { border: !this.props.headerIsEditing && isFocused ? "2px solid rgb(255, 160, 160)" : "1px solid #f1efeb" }
+        };
+    }
+
+    @action setCellIsEditing = (isEditing: boolean) => this._cellIsEditing = isEditing;
+
+    @action
+    onKeyDown = (e: KeyboardEvent): void => {
+        if (!this._cellIsEditing && !this.props.headerIsEditing && this.props.isFocused(this.props.Document, true)) {// && this.props.isSelected(true)) {
+            const direction = e.key === "Tab" ? "tab" : e.which === 39 ? "right" : e.which === 37 ? "left" : e.which === 38 ? "up" : e.which === 40 ? "down" : "";
+            this._focusedCell = this.changeFocusedCellByDirection(direction, this._focusedCell.row, this._focusedCell.col);
+
+            if (direction) {
+                const pdoc = FieldValue(this.childDocs[this._focusedCell.row]);
+                pdoc && this.props.setPreviewDoc(pdoc);
+                e.stopPropagation();
+            }
+        } else if (e.keyCode === 27) {
+            this.props.setPreviewDoc(undefined);
+            e.stopPropagation(); // stopPropagation for left/right arrows 
+        }
+    }
+
+    changeFocusedCellByDirection = (direction: string, curRow: number, curCol: number) => {
+        switch (direction) {
+            case "tab": return { row: (curRow + 1 === this.childDocs.length ? 0 : curRow + 1), col: curCol + 1 === this.props.columns.length ? 0 : curCol + 1 };
+            case "right": return { row: curRow, col: curCol + 1 === this.props.columns.length ? curCol : curCol + 1 };
+            case "left": return { row: curRow, col: curCol === 0 ? curCol : curCol - 1 };
+            case "up": return { row: curRow === 0 ? curRow : curRow - 1, col: curCol };
+            case "down": return { row: curRow + 1 === this.childDocs.length ? curRow : curRow + 1, col: curCol };
+        }
+        return this._focusedCell;
+    }
+
+    @action
+    changeFocusedCellByIndex = (row: number, col: number): void => {
+        if (this._focusedCell.row !== row || this._focusedCell.col !== col) {
+            this._focusedCell = { row: row, col: col };
+        }
+        this.props.setFocused(this.props.Document);
+    }
+
+    @undoBatch
+    createRow = action(() => {
+        this.props.addDocument?.(Docs.Create.TextDocument("", { title: "", _width: 100, _height: 30 }));
+        this._focusedCell = { row: this.childDocs.length, col: this._focusedCell.col };
+    });
+
+    @undoBatch
+    @action
+    createColumn = () => {
+        let index = 0;
+        let found = this.props.columns.findIndex(col => col.heading.toUpperCase() === "New field".toUpperCase()) > -1;
+        while (found) {
+            index++;
+            found = this.props.columns.findIndex(col => col.heading.toUpperCase() === ("New field (" + index + ")").toUpperCase()) > -1;
+        }
+        this.props.columns.push(new SchemaHeaderField(`New field ${index ? "(" + index + ")" : ""}`, "#f1efeb"));
+    }
+
+    @action
+    getColumnType = (column: SchemaHeaderField, doc?: Doc, field?: string): ColumnType => {
+        if (doc && field && column.type === ColumnType.Any) {
+            const val = doc[CollectionSchemaCell.resolvedFieldKey(field, doc)];
+            if (val instanceof ImageField) return ColumnType.Image;
+            if (val instanceof Doc) return ColumnType.Doc;
+            if (val instanceof DateField) return ColumnType.Date;
+            if (val instanceof List) return ColumnType.List;
+        }
+        if (column.type && column.type !== 0) {
+            return column.type;
+        }
+        if (columnTypes.get(column.heading)) {
+            return column.type = columnTypes.get(column.heading)!;
+        }
+        return column.type = ColumnType.Any;
+    }
+
+    @undoBatch
+    @action
+    toggleTextwrap = async () => {
+        const textwrappedRows = Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
+        if (textwrappedRows.length) {
+            this.props.Document.textwrappedSchemaRows = new List<string>([]);
+        } else {
+            const docs = DocListCast(this.props.Document[this.props.fieldKey]);
+            const allRows = docs instanceof Doc ? [docs[Id]] : docs.map(doc => doc[Id]);
+            this.props.Document.textwrappedSchemaRows = new List<string>(allRows);
+        }
+    }
+
+    @action
+    toggleTextWrapRow = (doc: Doc): void => {
+        const textWrapped = this.textWrappedRows;
+        const index = textWrapped.findIndex(id => doc[Id] === id);
+
+        index > -1 ? textWrapped.splice(index, 1) : textWrapped.push(doc[Id]);
+
+        this.textWrappedRows = textWrapped;
+    }
+
+    @computed
+    get reactTable() {
+        const children = this.childDocs;
+        const hasCollectionChild = children.reduce((found, doc) => found || doc.type === DocumentType.COL, false);
+        const expanded: { [name: string]: any } = {};
+        Array.from(this._openCollections.keys()).map(col => expanded[col.toString()] = true);
+        const rerender = [...this.textWrappedRows]; // TODO: get component to rerender on text wrap change without needign to console.log :((((
+
+        return <ReactTable
+            style={{ position: "relative" }}
+            data={children}
+            page={0}
+            pageSize={children.length}
+            showPagination={false}
+            columns={this.tableColumns}
+            getTrProps={this.getTrProps}
+            getTdProps={this.getTdProps}
+            sortable={false}
+            TrComponent={MovableRow}
+            sorted={this.sorted}
+            expanded={expanded}
+            resized={this.resized}
+            onResizedChange={this.props.onResizedChange}
+            SubComponent={!hasCollectionChild ? undefined : row => (row.original.type !== DocumentType.COL) ? (null) :
+                <div className="reactTable-sub"><SchemaTable {...this.props} Document={row.original} dataDoc={undefined} childDocs={undefined} /></div>}
+
+        />;
+    }
+
+    onContextMenu = (e: React.MouseEvent): void => {
+        ContextMenu.Instance.addItem({ description: "Toggle text wrapping", event: this.toggleTextwrap, icon: "table" });
+    }
+
+    getField = (row: number, col?: number) => {
+        const docs = this.childDocs;
+
+        row = row % docs.length;
+        while (row < 0) row += docs.length;
+        const columns = this.props.columns;
+        const doc = docs[row];
+        if (col === undefined) {
+            return doc;
+        }
+        if (col >= 0 && col < columns.length) {
+            const column = this.props.columns[col].heading;
+            return doc[column];
+        }
+        return undefined;
+    }
+
+    createTransformer = (row: number, col: number): Transformer => {
+        const self = this;
+        const captures: { [name: string]: Field } = {};
+
+        const transformer: ts.TransformerFactory<ts.SourceFile> = context => {
+            return root => {
+                function visit(node: ts.Node) {
+                    node = ts.visitEachChild(node, visit, context);
+                    if (ts.isIdentifier(node)) {
+                        const isntPropAccess = !ts.isPropertyAccessExpression(node.parent) || node.parent.expression === node;
+                        const isntPropAssign = !ts.isPropertyAssignment(node.parent) || node.parent.name !== node;
+                        if (isntPropAccess && isntPropAssign) {
+                            if (node.text === "$r") {
+                                return ts.createNumericLiteral(row.toString());
+                            } else if (node.text === "$c") {
+                                return ts.createNumericLiteral(col.toString());
+                            } else if (node.text === "$") {
+                                if (ts.isCallExpression(node.parent)) {
+                                    // captures.doc = self.props.Document;
+                                    // captures.key = self.props.fieldKey;
+                                }
+                            }
+                        }
+                    }
+
+                    return node;
+                }
+                return ts.visitNode(root, visit);
+            };
+        };
+
+        // const getVars = () => {
+        //     return { capturedVariables: captures };
+        // };
+
+        return { transformer, /*getVars*/ };
+    }
+
+    setComputed = (script: string, doc: Doc, field: string, row: number, col: number): boolean => {
+        script =
+            `const $ = (row:number, col?:number) => {
+                const rval = (doc as any)[key][row + ${row}];
+                return col === undefined ? rval : rval[(doc as any)._schemaHeaders[col + ${col}].heading];
+            }
+            return ${script}`;
+        const compiled = CompileScript(script, { params: { this: Doc.name }, capturedVariables: { doc: this.props.Document, key: this.props.fieldKey }, typecheck: false, transformer: this.createTransformer(row, col) });
+        if (compiled.compiled) {
+            doc[field] = new ComputedField(compiled);
+            return true;
+        }
+        return false;
+    }
+
+    @action
+    showDoc = (doc: Doc | undefined, dataDoc?: Doc, screenX?: number, screenY?: number) => {
+        this._showDoc = doc;
+        if (dataDoc && screenX && screenY) {
+            this._showDocPos = this.props.ScreenToLocalTransform().transformPoint(screenX, screenY);
+        }
+    }
+
+    onOpenClick = () => {
+        this._showDoc && this.props.addDocTab(this._showDoc, "add:right");
+    }
+
+    getPreviewTransform = (): Transform => {
+        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - 4 - this.tableWidth, - this.borderWidth);
+    }
+
+    render() {
+        const preview = "";
+        return <div className="collectionSchemaView-table"
+            onPointerDown={this.props.onPointerDown} onClick={this.props.onClick} onWheel={e => this.props.active(true) && e.stopPropagation()}
+            onDrop={e => this.props.onDrop(e, {})} onContextMenu={this.onContextMenu} >
+            {this.reactTable}
+            {this.props.Document._chromeHidden ? undefined : <div className="collectionSchemaView-addRow" onClick={this.createRow}>+ new</div>}
+            {!this._showDoc ? (null) :
+                <div className="collectionSchemaView-documentPreview" ref="overlay"
+                    style={{
+                        position: "absolute", width: 150, height: 150,
+                        background: "dimGray", display: "block", top: 0, left: 0,
+                        transform: `translate(${this._showDocPos[0]}px, ${this._showDocPos[1] - 180}px)`
+                    }} >
+                    <DocumentView
+                        Document={this._showDoc}
+                        DataDoc={this._showDataDoc}
+                        styleProvider={DefaultStyleProvider}
+                        layerProvider={undefined}
+                        docViewPath={returnEmptyDoclist}
+                        freezeDimensions={true}
+                        focus={DocUtils.DefaultFocus}
+                        renderDepth={this.props.renderDepth}
+                        rootSelected={returnFalse}
+                        isContentActive={returnTrue}
+                        isDocumentActive={returnFalse}
+                        PanelWidth={() => 150}
+                        PanelHeight={() => 150}
+                        ScreenToLocalTransform={this.getPreviewTransform}
+                        docFilters={returnEmptyFilter}
+                        docRangeFilters={returnEmptyFilter}
+                        searchFilterDocs={returnEmptyDoclist}
+                        ContainingCollectionDoc={this.props.CollectionView?.props.Document}
+                        ContainingCollectionView={this.props.CollectionView}
+                        moveDocument={this.props.moveDocument}
+                        whenChildContentsActiveChanged={emptyFunction}
+                        addDocTab={this.props.addDocTab}
+                        pinToPres={this.props.pinToPres}
+                        bringToFront={returnFalse}>
+                    </DocumentView>
+                </div>}
+        </div>;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaCells.tsx b/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
deleted file mode 100644
index f75179cea..000000000
--- a/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
+++ /dev/null
@@ -1,585 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action, computed, observable } from "mobx";
-import { observer } from "mobx-react";
-import DatePicker from "react-datepicker";
-import "react-datepicker/dist/react-datepicker.css";
-import { CellInfo } from "react-table";
-import "react-table/react-table.css";
-import { DateField } from "../../../../fields/DateField";
-import { Doc, DocListCast, Field, Opt } from "../../../../fields/Doc";
-import { Id } from "../../../../fields/FieldSymbols";
-import { List } from "../../../../fields/List";
-import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
-import { ComputedField } from "../../../../fields/ScriptField";
-import { BoolCast, Cast, DateCast, FieldValue, NumCast, StrCast } from "../../../../fields/Types";
-import { ImageField } from "../../../../fields/URLField";
-import { Utils, emptyFunction } from "../../../../Utils";
-import { Docs } from "../../../documents/Documents";
-import { DocumentType } from "../../../documents/DocumentTypes";
-import { DocumentManager } from "../../../util/DocumentManager";
-import { DragManager } from "../../../util/DragManager";
-import { KeyCodes } from "../../../util/KeyCodes";
-import { CompileScript } from "../../../util/Scripting";
-import { SearchUtil } from "../../../util/SearchUtil";
-import { SnappingManager } from "../../../util/SnappingManager";
-import { undoBatch } from "../../../util/UndoManager";
-import '../../../views/DocumentDecorations.scss';
-import { EditableView } from "../../EditableView";
-import { MAX_ROW_HEIGHT } from '../../globalCssVariables.scss';
-import { DocumentIconContainer } from "../../nodes/DocumentIcon";
-import { OverlayView } from "../../OverlayView";
-import "./CollectionSchemaView.scss";
-import { CollectionView } from "../CollectionView";
-const path = require('path');
-
-// intialize cell properties
-export interface CellProps {
-    row: number;
-    col: number;
-    rowProps: CellInfo;
-    CollectionView: Opt<CollectionView>;
-    ContainingCollection: Opt<CollectionView>;
-    Document: Doc;
-    fieldKey: string;
-    renderDepth: number;
-    addDocTab: (document: Doc, where: string) => boolean;
-    pinToPres: (document: Doc) => void;
-    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined,
-        addDocument: (document: Doc | Doc[]) => boolean) => boolean;
-    isFocused: boolean;
-    changeFocusedCellByIndex: (row: number, col: number) => void;
-    setIsEditing: (isEditing: boolean) => void;
-    isEditable: boolean;
-    setPreviewDoc: (doc: Doc) => void;
-    setComputed: (script: string, doc: Doc, field: string, row: number, col: number) => boolean;
-    getField: (row: number, col?: number) => void;
-    showDoc: (doc: Doc | undefined, dataDoc?: any, screenX?: number, screenY?: number) => void;
-}
-
-@observer
-export class CollectionSchemaCell extends React.Component<CellProps> {
-    public static resolvedFieldKey(column: string, rowDoc: Doc) {
-        const fieldKey = column;
-        if (fieldKey.startsWith("*")) {
-            const rootKey = fieldKey.substring(1);
-            const allKeys = [...Array.from(Object.keys(rowDoc)), ...Array.from(Object.keys(Doc.GetProto(rowDoc)))];
-            const matchedKeys = allKeys.filter(key => key.includes(rootKey));
-            if (matchedKeys.length) return matchedKeys[0];
-        }
-        return fieldKey;
-    }
-    @observable protected _isEditing: boolean = false;
-    protected _focusRef = React.createRef<HTMLDivElement>();
-    protected _rowDoc = this.props.rowProps.original;
-    protected _rowDataDoc = Doc.GetProto(this.props.rowProps.original);
-    protected _dropDisposer?: DragManager.DragDropDisposer;
-    @observable contents: string = "";
-
-    componentDidMount() { document.addEventListener("keydown", this.onKeyDown); }
-    componentWillUnmount() { document.removeEventListener("keydown", this.onKeyDown); }
-
-    @action
-    onKeyDown = (e: KeyboardEvent): void => {
-        if (this.props.isFocused && this.props.isEditable && e.keyCode === KeyCodes.ENTER) {
-            document.removeEventListener("keydown", this.onKeyDown);
-            this._isEditing = true;
-            this.props.setIsEditing(true);
-        }
-    }
-
-    @action
-    isEditingCallback = (isEditing: boolean): void => {
-        document.removeEventListener("keydown", this.onKeyDown);
-        isEditing && document.addEventListener("keydown", this.onKeyDown);
-        this._isEditing = isEditing;
-        this.props.setIsEditing(isEditing);
-        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
-    }
-
-    @action
-    onPointerDown = async (e: React.PointerEvent): Promise<void> => {
-        this.onItemDown(e);
-        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
-        this.props.setPreviewDoc(this.props.rowProps.original);
-
-        let url: string;
-        if (url = StrCast(this.props.rowProps.row.href)) {
-            try {
-                new URL(url);
-                const temp = window.open(url)!;
-                temp.blur();
-                window.focus();
-            } catch { }
-        }
-
-        const doc = Cast(this._rowDoc[this.renderFieldKey], Doc, null);
-        doc && this.props.setPreviewDoc(doc);
-    }
-
-    @undoBatch
-    applyToDoc = (doc: Doc, row: number, col: number, run: (args?: { [name: string]: any }) => any) => {
-        const res = run({ this: doc, $r: row, $c: col, $: (r: number = 0, c: number = 0) => this.props.getField(r + row, c + col) });
-        if (!res.success) return false;
-        doc[this.renderFieldKey] = res.result;
-        return true;
-    }
-
-    private drop = (e: Event, de: DragManager.DropEvent) => {
-        if (de.complete.docDragData) {
-            if (de.complete.docDragData.draggedDocuments.length === 1) {
-                this._rowDataDoc[this.renderFieldKey] = de.complete.docDragData.draggedDocuments[0];
-            }
-            else {
-                const coll = Docs.Create.SchemaDocument([new SchemaHeaderField("title", "#f1efeb")], de.complete.docDragData.draggedDocuments, {});
-                this._rowDataDoc[this.renderFieldKey] = coll;
-            }
-            e.stopPropagation();
-        }
-    }
-
-    protected dropRef = (ele: HTMLElement | null) => {
-        this._dropDisposer?.();
-        ele && (this._dropDisposer = DragManager.MakeDropTarget(ele, this.drop.bind(this)));
-    }
-
-    returnHighlights(contents: string, positions?: number[]) {
-        if (positions) {
-            const results = [];
-            StrCast(this.props.Document._searchString);
-            const length = StrCast(this.props.Document._searchString).length;
-            const color = contents ? "black" : "grey";
-
-            results.push(<span key="-1" style={{ color }}>{contents?.slice(0, positions[0])}</span>);
-            positions.forEach((num, cur) => {
-                results.push(<span key={"start" + cur} style={{ backgroundColor: "#FFFF00", color }}>{contents?.slice(num, num + length)}</span>);
-                let end = 0;
-                cur === positions.length - 1 ? end = contents.length : end = positions[cur + 1];
-                results.push(<span key={"end" + cur} style={{ color }}>{contents?.slice(num + length, end)}</span>);
-            }
-            );
-            return results;
-        }
-        return <span style={{ color: contents ? "black" : "grey" }}>{contents ? contents?.valueOf() : "undefined"}</span>;
-    }
-
-    @computed get renderFieldKey() { return CollectionSchemaCell.resolvedFieldKey(this.props.rowProps.column.id!, this.props.rowProps.original); }
-    onItemDown = async (e: React.PointerEvent) => {
-        if (this.props.Document._searchDoc) {
-            const aliasdoc = await SearchUtil.GetAliasesOfDocument(this._rowDataDoc);
-            const targetContext = aliasdoc.length <= 0 ? undefined : Cast(aliasdoc[0].context, Doc, null);
-            DocumentManager.Instance.jumpToDocument(this._rowDoc, false, emptyFunction, targetContext,
-                undefined, undefined, undefined, () => this.props.setPreviewDoc(this._rowDoc));
-        }
-    }
-    renderCellWithType(type: string | undefined) {
-        const dragRef: React.RefObject<HTMLDivElement> = React.createRef();
-
-        const fieldKey = this.renderFieldKey;
-        const field = this._rowDoc[fieldKey];
-
-        const onPointerEnter = (e: React.PointerEvent): void => {
-            if (e.buttons === 1 && SnappingManager.GetIsDragging() && (type === "document" || type === undefined)) {
-                dragRef.current!.className = "collectionSchemaView-cellContainer doc-drag-over";
-            }
-        };
-        const onPointerLeave = (e: React.PointerEvent): void => {
-            dragRef.current!.className = "collectionSchemaView-cellContainer";
-        };
-
-        let contents = Field.toString(field as Field);
-        contents = contents === "" ? "--" : contents;
-
-        let className = "collectionSchemaView-cellWrapper";
-        if (this._isEditing) className += " editing";
-        if (this.props.isFocused && this.props.isEditable) className += " focused";
-        if (this.props.isFocused && !this.props.isEditable) className += " inactive";
-
-        const positions = [];
-        if (StrCast(this.props.Document._searchString).toLowerCase() !== "") {
-            let term = (field instanceof Promise) ? "...promise pending..." : contents.toLowerCase();
-            const search = StrCast(this.props.Document._searchString).toLowerCase();
-            let start = term.indexOf(search);
-            let tally = 0;
-            if (start !== -1) {
-                positions.push(start);
-            }
-            while (start < contents?.length && start !== -1) {
-                term = term.slice(start + search.length + 1);
-                tally += start + search.length + 1;
-                start = term.indexOf(search);
-                positions.push(tally + start);
-            }
-            if (positions.length > 1) {
-                positions.pop();
-            }
-        }
-        const placeholder = type === "number" ? "0" : contents === "" ? "--" : "undefined";
-        return (
-            <div className="collectionSchemaView-cellContainer" style={{ cursor: field instanceof Doc ? "grab" : "auto" }}
-                ref={dragRef} onPointerDown={this.onPointerDown} onClick={action(e => this._isEditing = true)} onPointerEnter={onPointerEnter} onPointerLeave={onPointerLeave}>
-                <div className={className} ref={this._focusRef} tabIndex={-1}>
-                    <div className="collectionSchemaView-cellContents" ref={type === undefined || type === "document" ? this.dropRef : null}>
-                        {!this.props.Document._searchDoc ?
-                            <EditableView
-                                editing={this._isEditing}
-                                isEditingCallback={this.isEditingCallback}
-                                display={"inline"}
-                                contents={contents}
-                                height={"auto"}
-                                maxHeight={Number(MAX_ROW_HEIGHT)}
-                                placeholder={placeholder}
-                                GetValue={() => {
-                                    const cfield = ComputedField.WithoutComputed(() => FieldValue(field));
-                                    const cscript = cfield instanceof ComputedField ? cfield.script.originalScript : undefined;
-                                    const cfinalScript = cscript?.split("return")[cscript.split("return").length - 1];
-                                    return cscript ? (cfinalScript?.endsWith(";") ? `:=${cfinalScript?.substring(0, cfinalScript.length - 2)}` : cfinalScript) :
-                                        Field.IsField(cfield) ? Field.toScriptString(cfield) : "";
-                                }}
-                                SetValue={action((value: string) => {
-                                    // sets what is displayed after the user makes an input
-                                    let retVal = false;
-                                    if (value.startsWith(":=") || value.startsWith("=:=")) {
-                                        // decides how to compute a value when given either of the above strings
-                                        const script = value.substring(value.startsWith("=:=") ? 3 : 2);
-                                        retVal = this.props.setComputed(script, value.startsWith(":=") ? this._rowDataDoc : this._rowDoc, this.renderFieldKey, this.props.row, this.props.col);
-                                    } else {
-                                        // check if the input is a number
-                                        let inputIsNum = true;
-                                        for (let s of value) {
-                                            if (isNaN(parseInt(s)) && !(s == ".") && !(s == ",")) {
-                                                inputIsNum = false;
-                                            }
-                                        }
-                                        // check if the input is a boolean
-                                        let inputIsBool: boolean = value == "false" || value == "true";
-                                        // what to do in the case 
-                                        if (!inputIsNum && !inputIsBool && !value.startsWith("=")) {
-                                            // if it's not a number, it's a string, and should be processed as such
-                                            // strips the string of quotes when it is edited to prevent quotes form being added to the text automatically 
-                                            // after each edit
-                                            let valueSansQuotes = value;
-                                            if (this._isEditing) {
-                                                const vsqLength = valueSansQuotes.length;
-                                                // get rid of outer quotes
-                                                valueSansQuotes = valueSansQuotes.substring(value.startsWith("\"") ? 1 : 0,
-                                                    valueSansQuotes.charAt(vsqLength - 1) == "\"" ? vsqLength - 1 : vsqLength);
-                                            }
-                                            let inputAsString = '"';
-                                            // escape any quotes in the string
-                                            for (const i of valueSansQuotes) {
-                                                if (i == '"') {
-                                                    inputAsString += '\\"';
-                                                } else {
-                                                    inputAsString += i;
-                                                }
-                                            }
-                                            // add a closing quote
-                                            inputAsString += '"';
-                                            //two options here: we can strip off outer quotes or we can figure out what's going on with the script
-                                            const script = CompileScript(inputAsString, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            const changeMade = inputAsString.length !== value.length || inputAsString.length - 2 !== value.length
-                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
-                                            // handle numbers and expressions
-                                        } else if (inputIsNum || value.startsWith("=")) {
-                                            //TODO: make accept numbers
-                                            const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
-                                            // if commas are not stripped, the parser only considers the numbers after the last comma
-                                            let inputSansCommas = "";
-                                            for (let s of inputscript) {
-                                                if (!(s == ",")) {
-                                                    inputSansCommas += s;
-                                                }
-                                            }
-                                            const script = CompileScript(inputSansCommas, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
-                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
-                                            // handle booleans
-                                        } else if (inputIsBool) {
-                                            const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
-                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
-                                        }
-                                    }
-                                    if (retVal) {
-                                        this._isEditing = false; // need to set this here. otherwise, the assignment of the field will invalidate & cause render() to be called with the wrong value for 'editing'
-                                        this.props.setIsEditing(false);
-                                    }
-                                    return retVal;
-                                })}
-                                OnFillDown={async (value: string) => {
-                                    const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                    script.compiled && DocListCast(this.props.Document[this.props.fieldKey]).
-                                        forEach((doc, i) => value.startsWith(":=") ?
-                                            this.props.setComputed(value.substring(2), Doc.GetProto(doc), this.renderFieldKey, i, this.props.col) :
-                                            this.applyToDoc(Doc.GetProto(doc), i, this.props.col, script.run));
-                                }}
-                            />
-                            :
-                            this.returnHighlights(contents, positions)
-                        }
-                    </div >
-                </div>
-            </div>
-        );
-    }
-
-    render() { return this.renderCellWithType(undefined); }
-}
-
-@observer
-export class CollectionSchemaNumberCell extends CollectionSchemaCell { render() { return this.renderCellWithType("number"); } }
-
-@observer
-export class CollectionSchemaBooleanCell extends CollectionSchemaCell { render() { return this.renderCellWithType("boolean"); } }
-
-@observer
-export class CollectionSchemaStringCell extends CollectionSchemaCell { render() { return this.renderCellWithType("string"); } }
-
-@observer
-export class CollectionSchemaDateCell extends CollectionSchemaCell {
-    @computed get _date(): Opt<DateField> { return this._rowDoc[this.renderFieldKey] instanceof DateField ? DateCast(this._rowDoc[this.renderFieldKey]) : undefined; }
-
-    @action
-    handleChange = (date: any) => {
-        // const script = CompileScript(date.toString(), { requiredType: "Date", addReturn: true, params: { this: Doc.name } });
-        // if (script.compiled) {
-        //     this.applyToDoc(this._document, this.props.row, this.props.col, script.run);
-        // } else {
-        // ^ DateCast is always undefined for some reason, but that is what the field should be set to
-        this._rowDoc[this.renderFieldKey] = new DateField(date as Date);
-        //}
-    }
-
-    render() {
-        return !this.props.isFocused ? <span onPointerDown={this.onPointerDown}>{this._date ? Field.toString(this._date as Field) : "--"}</span> :
-            <DatePicker
-                selected={this._date?.date || new Date}
-                onSelect={date => this.handleChange(date)}
-                onChange={date => this.handleChange(date)}
-            />;
-    }
-}
-
-@observer
-export class CollectionSchemaDocCell extends CollectionSchemaCell {
-
-    _overlayDisposer?: () => void;
-
-    @computed get _doc() { return FieldValue(Cast(this._rowDoc[this.renderFieldKey], Doc)); }
-
-    @action
-    onSetValue = (value: string) => {
-        this._doc && (Doc.GetProto(this._doc).title = value);
-
-        const script = CompileScript(value, {
-            addReturn: true,
-            typecheck: true,
-            transformer: DocumentIconContainer.getTransformer()
-        });
-
-        const results = script.compiled && script.run();
-        if (results && results.success) {
-            this._rowDoc[this.renderFieldKey] = results.result;
-            return true;
-        }
-        return false;
-    }
-
-    componentWillUnmount() { this.onBlur(); }
-
-    onBlur = () => { this._overlayDisposer?.(); };
-    onFocus = () => {
-        this.onBlur();
-        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
-    }
-
-    @action
-    isEditingCallback = (isEditing: boolean): void => {
-        document.removeEventListener("keydown", this.onKeyDown);
-        isEditing && document.addEventListener("keydown", this.onKeyDown);
-        this._isEditing = isEditing;
-        this.props.setIsEditing(isEditing);
-        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
-    }
-
-    render() {
-        return !this._doc ? this.renderCellWithType("document") :
-            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1}
-                onPointerDown={this.onPointerDown}
-            >
-                <div className="collectionSchemaView-cellContents-document"
-                    style={{ padding: "5.9px" }}
-                    ref={this.dropRef}
-                    onFocus={this.onFocus}
-                    onBlur={this.onBlur}
-                >
-                    <EditableView
-                        editing={this._isEditing}
-                        isEditingCallback={this.isEditingCallback}
-                        display={"inline"}
-                        contents={this._doc.title || "--"}
-                        height={"auto"}
-                        maxHeight={Number(MAX_ROW_HEIGHT)}
-                        GetValue={() => StrCast(this._doc?.title)}
-                        SetValue={action((value: string) => {
-                            this.onSetValue(value);
-                            return true;
-                        })}
-                    />
-                </div >
-                <div onClick={() => this._doc && this.props.addDocTab(this._doc, "add:right")} className="collectionSchemaView-cellContents-docButton">
-                    <FontAwesomeIcon icon="external-link-alt" size="lg" />
-                </div>
-            </div>;
-    }
-}
-
-@observer
-export class CollectionSchemaImageCell extends CollectionSchemaCell {
-
-    choosePath(url: URL) {
-        if (url.protocol === "data") return url.href;
-        if (url.href.indexOf(window.location.origin) === -1) return Utils.CorsProxy(url.href);
-        if (!/\.(png|jpg|jpeg|gif|webp)$/.test(url.href.toLowerCase())) return url.href;//Why is this here
-
-        const ext = path.extname(url.href);
-        return url.href.replace(ext, "_o" + path.extname(url.href));
-    }
-
-    render() {
-        const field = Cast(this._rowDoc[this.renderFieldKey], ImageField, null); // retrieve the primary image URL that is being rendered from the data doc
-        const alts = DocListCast(this._rowDoc[this.renderFieldKey + "-alternates"]); // retrieve alternate documents that may be rendered as alternate images
-        const altpaths = alts.map(doc => Cast(doc[Doc.LayoutFieldKey(doc)], ImageField, null)?.url).filter(url => url).map(url => this.choosePath(url)); // access the primary layout data of the alternate documents
-        const paths = field ? [this.choosePath(field.url), ...altpaths] : altpaths;
-        const url = paths.length ? paths : [Utils.CorsProxy("http://www.cs.brown.edu/~bcz/noImage.png")];
-
-        const aspect = Doc.NativeAspect(this._rowDoc);
-        let width = Math.min(75, this.props.rowProps.width);
-        const height = Math.min(75, width / aspect);
-        width = height * aspect;
-
-        const reference = React.createRef<HTMLDivElement>();
-        return <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-            <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
-                <img src={url[0]}
-                    width={paths.length ? width : "20px"}
-                    height={paths.length ? height : "20px"} />
-            </div >
-        </div>;
-    }
-}
-
-
-@observer
-export class CollectionSchemaListCell extends CollectionSchemaCell {
-    _overlayDisposer?: () => void;
-
-    @computed get _field() { return this._rowDoc[this.renderFieldKey]; }
-    @computed get _optionsList() { return this._field as List<any>; }
-    @observable private _opened = false;
-    @observable private _text = "select an item";
-    @observable private _selectedNum = 0;
-
-    @action
-    onSetValue = (value: string) => {
-        // change if its a document
-        this._optionsList[this._selectedNum] = this._text = value;
-
-        (this._field as List<any>).splice(this._selectedNum, 1, value);
-    }
-
-    @action
-    onSelected = (element: string, index: number) => {
-        this._text = element;
-        this._selectedNum = index;
-    }
-
-    onFocus = () => {
-        this._overlayDisposer?.();
-        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
-    }
-
-    render() {
-        const link = false;
-        const reference = React.createRef<HTMLDivElement>();
-
-        if (this._optionsList?.length) {
-            const options = !this._opened ? (null) :
-                <div>
-                    {this._optionsList.map((element, index) => {
-                        const val = Field.toString(element);
-                        return <div className="collectionSchemaView-dropdownOption" key={index} style={{ padding: "6px" }} onPointerDown={(e) => this.onSelected(StrCast(element), index)} >
-                            {val}
-                        </div>;
-                    })}
-                </div>;
-
-            const plainText = <div style={{ padding: "5.9px" }}>{this._text}</div>;
-            const textarea = <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} style={{ padding: "5.9px" }} ref={this.dropRef} >
-                <EditableView
-                    editing={this._isEditing}
-                    isEditingCallback={this.isEditingCallback}
-                    display={"inline"}
-                    contents={this._text}
-                    height={"auto"}
-                    maxHeight={Number(MAX_ROW_HEIGHT)}
-                    GetValue={() => this._text}
-                    SetValue={action((value: string) => {
-                        // add special for params 
-                        this.onSetValue(value);
-                        return true;
-                    })}
-                />
-            </div >;
-
-            //☰
-            return (
-                <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-                    <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
-                        <div className="collectionSchemaView-dropDownWrapper">
-                            <button type="button" className="collectionSchemaView-dropdownButton" style={{ right: "length", position: "relative" }}
-                                onClick={action(e => this._opened = !this._opened)} >
-                                <FontAwesomeIcon icon={this._opened ? "caret-up" : "caret-down"} size="sm" />
-                            </button>
-                            <div className="collectionSchemaView-dropdownText"> {link ? plainText : textarea} </div>
-                        </div>
-                        {options}
-                    </div >
-                </div>
-            );
-        }
-        return this.renderCellWithType("list");
-    }
-}
-
-
-@observer
-export class CollectionSchemaCheckboxCell extends CollectionSchemaCell {
-    @computed get _isChecked() { return BoolCast(this._rowDoc[this.renderFieldKey]); }
-
-    render() {
-        const reference = React.createRef<HTMLDivElement>();
-        return (
-            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-                <input type="checkbox" checked={this._isChecked} onChange={e => this._rowDoc[this.renderFieldKey] = e.target.checked} />
-            </div>
-        );
-    }
-}
-
-
-@observer
-export class CollectionSchemaButtons extends CollectionSchemaCell {
-    render() {
-        return !this.props.Document._searchDoc || ![DocumentType.PDF, DocumentType.RTF].includes(StrCast(this._rowDoc.type) as DocumentType) ? <></> :
-            <div style={{ paddingTop: 8, paddingLeft: 3 }} >
-                <button style={{ padding: 2, left: 77 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, true)}>
-                    <FontAwesomeIcon icon="arrow-up" size="sm" />
-                </button>
-                <button style={{ padding: 2 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, false)} >
-                    <FontAwesomeIcon icon="arrow-down" size="sm" />
-                </button>
-            </div>;
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx b/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
deleted file mode 100644
index b2115b22e..000000000
--- a/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
+++ /dev/null
@@ -1,518 +0,0 @@
-import React = require("react");
-import { IconProp, library } from "@fortawesome/fontawesome-svg-core";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action, computed, observable, runInAction } from "mobx";
-import { observer } from "mobx-react";
-import { Doc, DocListCast, Opt } from "../../../../fields/Doc";
-import { listSpec } from "../../../../fields/Schema";
-import { PastelSchemaPalette, SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
-import { ScriptField } from "../../../../fields/ScriptField";
-import { Cast, StrCast } from "../../../../fields/Types";
-import { undoBatch } from "../../../util/UndoManager";
-import { SearchBox } from "../../search/SearchBox";
-import { ColumnType } from "./CollectionSchemaView";
-import "./CollectionSchemaView.scss";
-import { CollectionView } from "../CollectionView";
-
-const higflyout = require("@hig/flyout");
-export const { anchorPoints } = higflyout;
-export const Flyout = higflyout.default;
-
-
-export interface AddColumnHeaderProps {
-    createColumn: () => void;
-}
-
-@observer
-export class CollectionSchemaAddColumnHeader extends React.Component<AddColumnHeaderProps> {
-    render() {
-        return (
-            <button className="add-column" onClick={() => this.props.createColumn()}><FontAwesomeIcon icon="plus" size="sm" /></button>
-        );
-    }
-}
-
-
-export interface ColumnMenuProps {
-    columnField: SchemaHeaderField;
-    // keyValue: string;
-    possibleKeys: string[];
-    existingKeys: string[];
-    // keyType: ColumnType;
-    typeConst: boolean;
-    menuButtonContent: JSX.Element;
-    addNew: boolean;
-    onSelect: (oldKey: string, newKey: string, addnew: boolean) => void;
-    setIsEditing: (isEditing: boolean) => void;
-    deleteColumn: (column: string) => void;
-    onlyShowOptions: boolean;
-    setColumnType: (column: SchemaHeaderField, type: ColumnType) => void;
-    setColumnSort: (column: SchemaHeaderField, desc: boolean | undefined) => void;
-    anchorPoint?: any;
-    setColumnColor: (column: SchemaHeaderField, color: string) => void;
-}
-@observer
-export class CollectionSchemaColumnMenu extends React.Component<ColumnMenuProps> {
-    @observable private _isOpen: boolean = false;
-    @observable private _node: HTMLDivElement | null = null;
-
-    componentDidMount() { document.addEventListener("pointerdown", this.detectClick); }
-
-    componentWillUnmount() { document.removeEventListener("pointerdown", this.detectClick); }
-
-    @action
-    detectClick = (e: PointerEvent) => {
-        !this._node?.contains(e.target as Node) && this.props.setIsEditing(this._isOpen = false);
-    }
-
-    @action
-    toggleIsOpen = (): void => {
-        this.props.setIsEditing(this._isOpen = !this._isOpen);
-    }
-
-    changeColumnType = (type: ColumnType) => {
-        this.props.setColumnType(this.props.columnField, type);
-    }
-
-    changeColumnSort = (desc: boolean | undefined) => {
-        this.props.setColumnSort(this.props.columnField, desc);
-    }
-
-    changeColumnColor = (color: string) => {
-        this.props.setColumnColor(this.props.columnField, color);
-    }
-
-    @action
-    setNode = (node: HTMLDivElement): void => {
-        if (node) {
-            this._node = node;
-        }
-    }
-
-    renderTypes = () => {
-        if (this.props.typeConst) return (null);
-
-        const type = this.props.columnField.type;
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Column type:</label>
-                <div className="columnMenu-types">
-                    <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Any)}>
-                        <FontAwesomeIcon icon={"align-justify"} size="sm" />
-                        Any
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Number)}>
-                        <FontAwesomeIcon icon={"hashtag"} size="sm" />
-                        Number
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.String)}>
-                        <FontAwesomeIcon icon={"font"} size="sm" />
-                        Text
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Boolean)}>
-                        <FontAwesomeIcon icon={"check-square"} size="sm" />
-                        Checkbox
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.List)}>
-                        <FontAwesomeIcon icon={"list-ul"} size="sm" />
-                        List
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Doc)}>
-                        <FontAwesomeIcon icon={"file"} size="sm" />
-                        Document
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Image)}>
-                        <FontAwesomeIcon icon={"image"} size="sm" />
-                        Image
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Date)}>
-                        <FontAwesomeIcon icon={"calendar"} size="sm" />
-                        Date
-                    </div>
-                </div>
-            </div >
-        );
-    }
-
-    renderSorting = () => {
-        const sort = this.props.columnField.desc;
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Sort by:</label>
-                <div className="columnMenu-sort">
-                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.changeColumnSort(true)}>
-                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
-                        Sort descending
-                    </div>
-                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.changeColumnSort(false)}>
-                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
-                        Sort ascending
-                    </div>
-                    <div className="columnMenu-option" onClick={() => this.changeColumnSort(undefined)}>
-                        <FontAwesomeIcon icon="times" size="sm" />
-                        Clear sorting
-                    </div>
-                </div>
-            </div>
-        );
-    }
-
-    renderColors = () => {
-        const selected = this.props.columnField.color;
-
-        const pink = PastelSchemaPalette.get("pink2");
-        const purple = PastelSchemaPalette.get("purple2");
-        const blue = PastelSchemaPalette.get("bluegreen1");
-        const yellow = PastelSchemaPalette.get("yellow4");
-        const red = PastelSchemaPalette.get("red2");
-        const gray = "#f1efeb";
-
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Color:</label>
-                <div className="columnMenu-colors">
-                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.changeColumnColor(pink!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.changeColumnColor(purple!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.changeColumnColor(blue!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.changeColumnColor(yellow!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.changeColumnColor(red!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.changeColumnColor(gray)}></div>
-                </div>
-            </div>
-        );
-    }
-
-    renderContent = () => {
-        return (
-            <div className="collectionSchema-header-menuOptions">
-                {this.props.onlyShowOptions ? <></> :
-                    <>
-                        {this.renderTypes()}
-                        {this.renderSorting()}
-                        {this.renderColors()}
-                        <div className="collectionSchema-headerMenu-group">
-                            <button onClick={() => this.props.deleteColumn(this.props.columnField.heading)}>Delete Column</button>
-                        </div>
-                    </>
-                }
-            </div>
-        );
-    }
-
-    render() {
-        return (
-            <div className="collectionSchema-header-menu" ref={this.setNode}>
-                <Flyout anchorPoint={this.props.anchorPoint ? this.props.anchorPoint : anchorPoints.TOP_CENTER} content={this.renderContent()}>
-                    <div className="collectionSchema-header-toggler" onClick={() => this.toggleIsOpen()}>{this.props.menuButtonContent}</div>
-                </ Flyout >
-            </div>
-        );
-    }
-}
-
-
-export interface KeysDropdownProps {
-    keyValue: string;
-    possibleKeys: string[];
-    existingKeys: string[];
-    canAddNew: boolean;
-    addNew: boolean;
-    onSelect: (oldKey: string, newKey: string, addnew: boolean, filter?: string) => void;
-    setIsEditing: (isEditing: boolean) => void;
-    width?: string;
-    docs?: Doc[];
-    Document: Doc;
-    dataDoc: Doc | undefined;
-    fieldKey: string;
-    ContainingCollectionDoc: Doc | undefined;
-    ContainingCollectionView: Opt<CollectionView>;
-    active?: (outsideReaction?: boolean) => boolean;
-    openHeader: (column: any, screenx: number, screeny: number) => void;
-    col: SchemaHeaderField;
-    icon: IconProp;
-}
-@observer
-export class KeysDropdown extends React.Component<KeysDropdownProps> {
-    @observable private _key: string = this.props.keyValue;
-    @observable private _searchTerm: string = this.props.keyValue;
-    @observable private _isOpen: boolean = false;
-    @observable private _node: HTMLDivElement | null = null;
-    @observable private _inputRef: React.RefObject<HTMLInputElement> = React.createRef();
-
-    @action setSearchTerm = (value: string): void => { this._searchTerm = value; };
-    @action setKey = (key: string): void => { this._key = key; };
-    @action setIsOpen = (isOpen: boolean): void => { this._isOpen = isOpen; };
-
-    @action
-    onSelect = (key: string): void => {
-        this.props.onSelect(this._key, key, this.props.addNew);
-        this.setKey(key);
-        this._isOpen = false;
-        this.props.setIsEditing(false);
-    }
-
-    @action
-    setNode = (node: HTMLDivElement): void => {
-        if (node) {
-            this._node = node;
-        }
-    }
-
-    componentDidMount() {
-        document.addEventListener("pointerdown", this.detectClick);
-        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
-        if (filters?.some(filter => filter.split(":")[0] === this._key)) {
-            runInAction(() => this.closeResultsVisibility = "contents");
-        }
-    }
-
-    @action
-    detectClick = (e: PointerEvent): void => {
-        if (this._node && this._node.contains(e.target as Node)) {
-        } else {
-            this._isOpen = false;
-            this.props.setIsEditing(false);
-        }
-    }
-
-    private tempfilter: string = "";
-    @undoBatch
-    onKeyDown = (e: React.KeyboardEvent): void => {
-        if (e.key === "Enter") {
-            if (this._searchTerm.includes(":")) {
-                const colpos = this._searchTerm.indexOf(":");
-                const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
-                if (temp === "") {
-                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
-                    this.updateFilter();
-                }
-                else {
-                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
-                    this.tempfilter = temp;
-                    Doc.setDocFilter(this.props.Document, this._key, temp, "check");
-                    this.props.col.setColor("green");
-                    this.closeResultsVisibility = "contents";
-                }
-            }
-            else {
-                Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
-                this.updateFilter();
-                if (this.showKeys.length) {
-                    this.onSelect(this.showKeys[0]);
-                } else if (this._searchTerm !== "" && this.props.canAddNew) {
-                    this.setSearchTerm(this._searchTerm || this._key);
-                    this.onSelect(this._searchTerm);
-                }
-            }
-        }
-    }
-
-    onChange = (val: string): void => {
-        this.setSearchTerm(val);
-    }
-
-    @action
-    onFocus = (e: React.FocusEvent): void => {
-        this._isOpen = true;
-        this.props.setIsEditing(true);
-    }
-
-    @computed get showKeys() {
-        const whitelistKeys = ["context", "author", "*lastModified", "text", "data", "tags", "creationDate"];
-        const keyOptions = this._searchTerm === "" ? this.props.possibleKeys : this.props.possibleKeys.filter(key => key.toUpperCase().indexOf(this._searchTerm.toUpperCase()) > -1);
-        const showKeys = new Set<string>();
-        [...keyOptions, ...whitelistKeys].forEach(key => (!Doc.UserDoc().noviceMode ||
-            whitelistKeys.includes(key)
-            || ((!key.startsWith("_") && key[0] === key[0].toUpperCase()) || key[0] === "#")) ? showKeys.add(key) : null);
-        return Array.from(showKeys.keys()).filter(key => !this._searchTerm || key.includes(this._searchTerm));
-    }
-    @action
-    renderOptions = (): JSX.Element[] | JSX.Element => {
-        if (!this._isOpen) {
-            this.defaultMenuHeight = 0;
-            return <></>;
-        }
-        const options = this.showKeys.map(key => {
-            return <div key={key} className="key-option" style={{
-                border: "1px solid lightgray",
-                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
-            }}
-                onPointerDown={e => {
-                    e.stopPropagation();
-                }}
-                onClick={() => {
-                    this.onSelect(key);
-                    this.setSearchTerm("");
-                }}>{key}</div>;
-        });
-
-        // if search term does not already exist as a group type, give option to create new group type
-
-        if (this._key !== this._searchTerm.slice(0, this._key.length)) {
-            if (this._searchTerm !== "" && this.props.canAddNew) {
-                options.push(<div key={""} className="key-option" style={{
-                    border: "1px solid lightgray", width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
-                }}
-                    onClick={() => { this.onSelect(this._searchTerm); this.setSearchTerm(""); }}>
-                    Create "{this._searchTerm}" key</div>);
-            }
-        }
-
-        if (options.length === 0) {
-            this.defaultMenuHeight = 0;
-        }
-        else {
-            if (this.props.docs) {
-                const panesize = this.props.docs.length * 30;
-                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-            else {
-                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-        }
-        return options;
-    }
-
-    docSafe: Doc[] = [];
-
-    @action
-    renderFilterOptions = (): JSX.Element[] | JSX.Element => {
-        if (!this._isOpen || !this.props.dataDoc) {
-            this.defaultMenuHeight = 0;
-            return <></>;
-        }
-        const keyOptions: string[] = [];
-        const colpos = this._searchTerm.indexOf(":");
-        const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
-        if (this.docSafe.length === 0) {
-            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
-        }
-        const docs = this.docSafe;
-        docs.forEach((doc) => {
-            const key = StrCast(doc[this._key]);
-            if (keyOptions.includes(key) === false && key.includes(temp) && key !== "") {
-                keyOptions.push(key);
-            }
-        });
-
-        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
-        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
-            this.props.col.setColor("rgb(241, 239, 235)");
-            this.closeResultsVisibility = "none";
-        }
-        for (let i = 0; i < (filters?.length ?? 0) - 1; i++) {
-            if (filters![i] === this.props.col.heading && keyOptions.includes(filters![i].split(":")[1]) === false) {
-                keyOptions.push(filters![i + 1]);
-            }
-        }
-        const options = keyOptions.map(key => {
-            let bool = false;
-            if (filters !== undefined) {
-                const ind = filters.findIndex(filter => filter.split(":")[0] === key);
-                const fields = ind === -1 ? undefined : filters[ind].split(":");
-                bool = fields ? fields[1] === "check" : false;
-            }
-            return <div key={key} className="key-option" style={{
-                border: "1px solid lightgray", paddingLeft: 5, textAlign: "left",
-                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white", backgroundColor: "white",
-            }}
-            >
-                <input type="checkbox"
-                    onPointerDown={e => e.stopPropagation()}
-                    onClick={e => e.stopPropagation()}
-                    onChange={(e) => {
-                        e.target.checked === true ? Doc.setDocFilter(this.props.Document, this._key, key, "check") : Doc.setDocFilter(this.props.Document, this._key, key, "remove");
-                        e.target.checked === true ? this.closeResultsVisibility = "contents" : console.log("");
-                        e.target.checked === true ? this.props.col.setColor("green") : this.updateFilter();
-                        e.target.checked === true && SearchBox.Instance.filter === true ? Doc.setDocFilter(docs[0], this._key, key, "check") : Doc.setDocFilter(docs[0], this._key, key, "remove");
-                    }}
-                    checked={bool}
-                />
-                <span style={{ paddingLeft: 4 }}>
-                    {key}
-                </span>
-
-            </div>;
-        });
-        if (options.length === 0) {
-            this.defaultMenuHeight = 0;
-        }
-        else {
-            if (this.props.docs) {
-                const panesize = this.props.docs.length * 30;
-                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-            else {
-                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-
-        }
-        return options;
-    }
-
-    @observable defaultMenuHeight = 0;
-
-
-    updateFilter() {
-        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
-        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
-            this.props.col.setColor("rgb(241, 239, 235)");
-            this.closeResultsVisibility = "none";
-        }
-    }
-
-    @computed get scriptField() {
-        const scriptText = "setDocFilter(containingTreeView, heading, this.title, checked)";
-        const script = ScriptField.MakeScript(scriptText, { this: Doc.name, heading: "string", checked: "string", containingTreeView: Doc.name });
-        return script ? () => script : undefined;
-    }
-    filterBackground = () => "rgba(105, 105, 105, 0.432)";
-    @observable filterOpen: boolean | undefined = undefined;
-    closeResultsVisibility: string = "none";
-
-    removeFilters = (e: React.PointerEvent): void => {
-        const keyOptions: string[] = [];
-        if (this.docSafe.length === 0 && this.props.dataDoc) {
-            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
-        }
-        const docs = this.docSafe;
-        docs.forEach((doc) => {
-            const key = StrCast(doc[this._key]);
-            if (keyOptions.includes(key) === false) {
-                keyOptions.push(key);
-            }
-        });
-
-        Doc.setDocFilter(this.props.Document, this._key, "", "remove");
-        this.props.col.setColor("rgb(241, 239, 235)");
-        this.closeResultsVisibility = "none";
-    }
-    render() {
-        return (
-            <div style={{ display: "flex" }} ref={this.setNode}>
-                <FontAwesomeIcon onClick={e => { this.props.openHeader(this.props.col, e.clientX, e.clientY); e.stopPropagation(); }} icon={this.props.icon} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} />
-
-                {/* <FontAwesomeIcon icon={fa.faSearchMinus} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} onClick={e => {
-                    runInAction(() => { this._isOpen === undefined ? this._isOpen = true : this._isOpen = !this._isOpen })
-                }} /> */}
-
-                <div className="keys-dropdown" style={{ zIndex: 1, width: this.props.width, maxWidth: this.props.width }}>
-                    <input className="keys-search" style={{ width: "100%" }}
-                        ref={this._inputRef} type="text" value={this._searchTerm} placeholder="Column key" onKeyDown={this.onKeyDown}
-                        onChange={e => this.onChange(e.target.value)}
-                        onClick={(e) => { e.stopPropagation(); this._inputRef.current?.focus(); }}
-                        onFocus={this.onFocus} ></input>
-                    <div style={{ display: this.closeResultsVisibility }}>
-                        <FontAwesomeIcon onPointerDown={this.removeFilters} icon={"times-circle"} size="lg"
-                            style={{ cursor: "hand", color: "grey", padding: 2, left: -20, top: -1, height: 15, position: "relative" }} />
-                    </div>
-                    {!this._isOpen ? (null) : <div className="keys-options-wrapper" style={{
-                        width: this.props.width, maxWidth: this.props.width, height: "auto",
-                    }}>
-                        {this._searchTerm.includes(":") ? this.renderFilterOptions() : this.renderOptions()}
-                    </div>}
-                </div >
-            </div>
-        );
-    }
-}
diff --git a/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx b/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
deleted file mode 100644
index 456c38c68..000000000
--- a/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
+++ /dev/null
@@ -1,128 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action } from "mobx";
-import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
-import { Doc } from "../../../../fields/Doc";
-import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
-import { Cast, FieldValue, StrCast } from "../../../../fields/Types";
-import { DocumentManager } from "../../../util/DocumentManager";
-import { DragManager, dropActionType, SetupDrag } from "../../../util/DragManager";
-import { SnappingManager } from "../../../util/SnappingManager";
-import { Transform } from "../../../util/Transform";
-import { undoBatch } from "../../../util/UndoManager";
-import { ContextMenu } from "../../ContextMenu";
-import "./CollectionSchemaView.scss";
-
-export interface MovableColumnProps {
-    columnRenderer: TableCellRenderer;
-    columnValue: SchemaHeaderField;
-    allColumns: SchemaHeaderField[];
-    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columns: SchemaHeaderField[]) => void;
-    ScreenToLocalTransform: () => Transform;
-}
-export class MovableColumn extends React.Component<MovableColumnProps> {
-    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
-    private _colDropDisposer?: DragManager.DragDropDisposer;
-    private _startDragPosition: { x: number, y: number } = { x: 0, y: 0 };
-    private _sensitivity: number = 16;
-    private _dragRef: React.RefObject<HTMLDivElement> = React.createRef();
-
-    onPointerEnter = (e: React.PointerEvent): void => {
-        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
-            this._header!.current!.className = "collectionSchema-col-wrapper";
-            document.addEventListener("pointermove", this.onDragMove, true);
-        }
-    }
-    onPointerLeave = (e: React.PointerEvent): void => {
-        this._header!.current!.className = "collectionSchema-col-wrapper";
-        document.removeEventListener("pointermove", this.onDragMove, true);
-        !e.buttons && document.removeEventListener("pointermove", this.onPointerMove);
-    }
-    onDragMove = (e: PointerEvent): void => {
-        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
-        const before = x[0] < bounds[0];
-        this._header!.current!.className = "collectionSchema-col-wrapper";
-        if (before) this._header!.current!.className += " col-before";
-        if (!before) this._header!.current!.className += " col-after";
-        e.stopPropagation();
-    }
-
-    createColDropTarget = (ele: HTMLDivElement) => {
-        this._colDropDisposer?.();
-        if (ele) {
-            this._colDropDisposer = DragManager.MakeDropTarget(ele, this.colDrop.bind(this));
-        }
-    }
-
-    colDrop = (e: Event, de: DragManager.DropEvent) => {
-        document.removeEventListener("pointermove", this.onDragMove, true);
-        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
-        const before = x[0] < bounds[0];
-        const colDragData = de.complete.columnDragData;
-        if (colDragData) {
-            e.stopPropagation();
-            this.props.reorderColumns(colDragData.colKey, this.props.columnValue, before, this.props.allColumns);
-            return true;
-        }
-        return false;
-    }
-
-    onPointerMove = (e: PointerEvent) => {
-        const onRowMove = (e: PointerEvent) => {
-            e.stopPropagation();
-            e.preventDefault();
-
-            document.removeEventListener("pointermove", onRowMove);
-            document.removeEventListener('pointerup', onRowUp);
-            const dragData = new DragManager.ColumnDragData(this.props.columnValue);
-            DragManager.StartColumnDrag(this._dragRef.current!, dragData, e.x, e.y);
-        };
-        const onRowUp = (): void => {
-            document.removeEventListener("pointermove", onRowMove);
-            document.removeEventListener('pointerup', onRowUp);
-        };
-        if (e.buttons === 1) {
-            const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX - this._startDragPosition.x, e.clientY - this._startDragPosition.y);
-            if (Math.abs(dx) + Math.abs(dy) > this._sensitivity) {
-                document.removeEventListener("pointermove", this.onPointerMove);
-                e.stopPropagation();
-
-                document.addEventListener("pointermove", onRowMove);
-                document.addEventListener("pointerup", onRowUp);
-            }
-        }
-    }
-
-    onPointerUp = (e: React.PointerEvent) => {
-        document.removeEventListener("pointermove", this.onPointerMove);
-    }
-
-    @action
-    onPointerDown = (e: React.PointerEvent, ref: React.RefObject<HTMLDivElement>) => {
-        this._dragRef = ref;
-        const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX, e.clientY);
-        if (!(e.target as any)?.tagName.includes("INPUT")) {
-            this._startDragPosition = { x: dx, y: dy };
-            document.addEventListener("pointermove", this.onPointerMove);
-        }
-    }
-
-
-    render() {
-        const reference = React.createRef<HTMLDivElement>();
-
-        return (
-            <div className="collectionSchema-col" ref={this.createColDropTarget}>
-                <div className="collectionSchema-col-wrapper" ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
-                    <div className="col-dragger" ref={reference} onPointerDown={e => this.onPointerDown(e, reference)} onPointerUp={this.onPointerUp}>
-                        {this.props.columnRenderer}
-                    </div>
-                </div>
-            </div>
-        );
-    }
-}
diff --git a/src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx b/src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx
deleted file mode 100644
index f48906ba5..000000000
--- a/src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx
+++ /dev/null
@@ -1,147 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action } from "mobx";
-import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
-import { Doc } from "../../../../fields/Doc";
-import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
-import { Cast, FieldValue, StrCast } from "../../../../fields/Types";
-import { DocumentManager } from "../../../util/DocumentManager";
-import { DragManager, dropActionType, SetupDrag } from "../../../util/DragManager";
-import { SnappingManager } from "../../../util/SnappingManager";
-import { Transform } from "../../../util/Transform";
-import { undoBatch } from "../../../util/UndoManager";
-import { ContextMenu } from "../../ContextMenu";
-import "./CollectionSchemaView.scss";
-
-export interface MovableRowProps {
-    rowInfo: RowInfo;
-    ScreenToLocalTransform: () => Transform;
-    addDoc: (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => boolean;
-    removeDoc: (doc: Doc | Doc[]) => boolean;
-    rowFocused: boolean;
-    textWrapRow: (doc: Doc) => void;
-    rowWrapped: boolean;
-    dropAction: string;
-    addDocTab: any;
-}
-
-export class MovableRow extends React.Component<MovableRowProps> {
-    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
-    private _rowDropDisposer?: DragManager.DragDropDisposer;
-
-    // Event listeners are only necessary when the user is hovering over the table
-    // Create one when the mouse starts hovering...
-    onPointerEnter = (e: React.PointerEvent): void => {
-        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
-            this._header!.current!.className = "collectionSchema-row-wrapper";
-            document.addEventListener("pointermove", this.onDragMove, true);
-        }
-    }
-    // ... and delete it when the mouse leaves
-    onPointerLeave = (e: React.PointerEvent): void => {
-        this._header!.current!.className = "collectionSchema-row-wrapper";
-        document.removeEventListener("pointermove", this.onDragMove, true);
-    }
-    // The method for the event listener, reorders columns when dragged to their new locations.
-    onDragMove = (e: PointerEvent): void => {
-        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
-        const before = x[1] < bounds[1];
-        this._header!.current!.className = "collectionSchema-row-wrapper";
-        if (before) this._header!.current!.className += " row-above";
-        if (!before) this._header!.current!.className += " row-below";
-        e.stopPropagation();
-    }
-    componentWillUnmount() {
-
-        this._rowDropDisposer?.();
-    }
-    //
-    createRowDropTarget = (ele: HTMLDivElement) => {
-        this._rowDropDisposer?.();
-        if (ele) {
-            this._rowDropDisposer = DragManager.MakeDropTarget(ele, this.rowDrop.bind(this));
-        }
-    }
-    // Controls what hppens when a row is dragged and dropped
-    rowDrop = (e: Event, de: DragManager.DropEvent) => {
-        this.onPointerLeave(e as any);
-        const rowDoc = FieldValue(Cast(this.props.rowInfo.original, Doc));
-        if (!rowDoc) return false;
-
-        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
-        const before = x[1] < bounds[1];
-
-        const docDragData = de.complete.docDragData;
-        if (docDragData) {
-            e.stopPropagation();
-            if (docDragData.draggedDocuments[0] === rowDoc) return true;
-            const addDocument = (doc: Doc | Doc[]) => this.props.addDoc(doc, rowDoc, before);
-            const movedDocs = docDragData.draggedDocuments;
-            return (docDragData.dropAction || docDragData.userDropAction) ?
-                docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before) || added, false)
-                : (docDragData.moveDocument) ?
-                    movedDocs.reduce((added: boolean, d) => docDragData.moveDocument?.(d, rowDoc, addDocument) || added, false)
-                    : docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before), false);
-        }
-        return false;
-    }
-
-    onRowContextMenu = (e: React.MouseEvent): void => {
-        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
-        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
-    }
-
-    @undoBatch
-    @action
-    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
-        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
-        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
-    }
-
-    @action
-    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
-        console.log("yes");
-        if (e.key === "Backspace" || e.key === "Delete") {
-            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
-        }
-    }
-
-    render() {
-        const { children = null, rowInfo } = this.props;
-
-        if (!rowInfo) {
-            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
-        }
-
-        const { original } = rowInfo;
-        const doc = FieldValue(Cast(original, Doc));
-
-        if (!doc) return (null);
-
-        const reference = React.createRef<HTMLDivElement>();
-        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
-
-        let className = "collectionSchema-row";
-        if (this.props.rowFocused) className += " row-focused";
-        if (this.props.rowWrapped) className += " row-wrapped";
-
-        return (
-            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
-                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
-                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
-                        <div className="row-dragger">
-                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
-                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
-                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
-                        </div>
-                        {children}
-                    </ReactTableDefaults.TrComponent>
-                </div>
-            </div>
-        );
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaView.scss b/src/client/views/collections/schemaView/CollectionSchemaView.scss
deleted file mode 100644
index b57fee0e4..000000000
--- a/src/client/views/collections/schemaView/CollectionSchemaView.scss
+++ /dev/null
@@ -1,552 +0,0 @@
-@import "../../globalCssVariables";
-.collectionSchemaView-container {
-    border-width: $COLLECTION_BORDER_WIDTH;
-    border-color: $intermediate-color;
-    border-style: solid;
-    border-radius: $border-radius;
-    box-sizing: border-box;
-    position: relative;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    margin-top: 0;
-    transition: top 0.5s;
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: nowrap;
-    touch-action: none;
-    div {
-        touch-action: none;
-    }
-    .collectionSchemaView-tableContainer {
-        width: 100%;
-        height: 100%;
-    }
-    .collectionSchemaView-dividerDragger {
-        position: relative;
-        height: 100%;
-        width: $SCHEMA_DIVIDER_WIDTH;
-        z-index: 20;
-        right: 0;
-        top: 0;
-        background: gray;
-        cursor: col-resize;
-    }
-    // .documentView-node:first-child {
-    //     background: $light-color;
-    // }
-}
-
-.collectionSchemaView-searchContainer {
-    border-width: $COLLECTION_BORDER_WIDTH;
-    border-color: $intermediate-color;
-    border-style: solid;
-    border-radius: $border-radius;
-    box-sizing: border-box;
-    position: relative;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    margin-top: 0;
-    transition: top 0.5s;
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: nowrap;
-    touch-action: none;
-    padding: 2px;
-    div {
-        touch-action: none;
-    }
-    .collectionSchemaView-tableContainer {
-        width: 100%;
-        height: 100%;
-    }
-    .collectionSchemaView-dividerDragger {
-        position: relative;
-        height: 100%;
-        width: 20px;
-        z-index: 20;
-        right: 0;
-        top: 0;
-        background: gray;
-        cursor: col-resize;
-    }
-    // .documentView-node:first-child {
-    //     background: $light-color;
-    // }
-}
-
-.ReactTable {
-    width: 100%;
-    background: white;
-    box-sizing: border-box;
-    border: none !important;
-    float: none !important;
-    .rt-table {
-        height: 100%;
-        display: -webkit-inline-box;
-        direction: ltr;
-        overflow: visible;
-    }
-    .rt-noData {
-        display: none;
-    }
-    .rt-thead {
-        width: 100%;
-        z-index: 100;
-        overflow-y: visible;
-        &.-header {
-            font-size: 12px;
-            height: 30px;
-            box-shadow: none;
-            z-index: 100;
-            overflow-y: visible;
-        }
-        .rt-resizable-header-content {
-            height: 100%;
-            overflow: visible;
-        }
-        .rt-th {
-            padding: 0;
-            border: solid lightgray;
-            border-width: 0 1px;
-            border-bottom: 2px solid lightgray;
-        }
-    }
-    .rt-th {
-        font-size: 13px;
-        text-align: center;
-        &:last-child {
-            overflow: visible;
-        }
-    }
-    .rt-tbody {
-        width: 100%;
-        direction: rtl;
-        overflow: visible;
-        .rt-td {
-            border-right: 1px solid rgba(0, 0, 0, 0.2);
-        }
-    }
-    .rt-tr-group {
-        direction: ltr;
-        flex: 0 1 auto;
-        min-height: 30px;
-        border: 0 !important;
-    }
-    .rt-tr {
-        width: 100%;
-        min-height: 30px;
-    }
-    .rt-td {
-        padding: 0;
-        font-size: 13px;
-        text-align: center;
-        white-space: nowrap;
-        display: flex;
-        align-items: center;
-        .imageBox-cont {
-            position: relative;
-            max-height: 100%;
-        }
-        .imageBox-cont img {
-            object-fit: contain;
-            max-width: 100%;
-            height: 100%;
-        }
-        .videoBox-cont {
-            object-fit: contain;
-            width: auto;
-            height: 100%;
-        }
-    }
-    .rt-td.rt-expandable {
-        display: flex;
-        align-items: center;
-        height: inherit;
-    }
-    .rt-resizer {
-        width: 8px;
-        right: -4px;
-    }
-    .rt-resizable-header {
-        padding: 0;
-        height: 30px;
-    }
-    .rt-resizable-header:last-child {
-        overflow: visible;
-        .rt-resizer {
-            width: 5px !important;
-        }
-    }
-}
-
-.documentView-node-topmost {
-    text-align: left;
-    transform-origin: center top;
-    display: inline-block;
-}
-
-.collectionSchema-col {
-    height: 100%;
-}
-
-.collectionSchema-header-menu {
-    height: auto;
-    z-index: 100;
-    position: absolute;
-    background: white;
-    padding: 5px;
-    position: fixed;
-    background: white;
-    border: black 1px solid;
-    .collectionSchema-header-toggler {
-        z-index: 100;
-        width: 100%;
-        height: 100%;
-        padding: 4px;
-        letter-spacing: 2px;
-        text-transform: uppercase;
-        svg {
-            margin-right: 4px;
-        }
-    }
-}
-
-.collectionSchemaView-header {
-    height: 100%;
-    color: gray;
-    z-index: 100;
-    overflow-y: visible;
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: wrap;
-}
-
-button.add-column {
-    width: 28px;
-}
-
-.collectionSchema-header-menuOptions {
-    color: black;
-    width: 180px;
-    text-align: left;
-    .collectionSchema-headerMenu-group {
-        padding: 7px 0;
-        border-bottom: 1px solid lightgray;
-        cursor: pointer;
-        &:first-child {
-            padding-top: 0;
-        }
-        &:last-child {
-            border: none;
-            text-align: center;
-            padding: 12px 0 0 0;
-        }
-    }
-    label {
-        color: $main-accent;
-        font-weight: normal;
-        letter-spacing: 2px;
-        text-transform: uppercase;
-    }
-    input {
-        color: black;
-        width: 100%;
-    }
-    .columnMenu-option {
-        cursor: pointer;
-        padding: 3px;
-        background-color: white;
-        transition: background-color 0.2s;
-        &:hover {
-            background-color: $light-color-secondary;
-        }
-        &.active {
-            font-weight: bold;
-            border: 2px solid $light-color-secondary;
-        }
-        svg {
-            color: gray;
-            margin-right: 5px;
-            width: 10px;
-        }
-    }
-    .keys-dropdown {
-        position: relative;
-        //width: 100%;
-        background-color: white;
-        input {
-            border: 2px solid $light-color-secondary;
-            padding: 3px;
-            height: 28px;
-            font-weight: bold;
-            letter-spacing: "2px";
-            text-transform: "uppercase";
-            &:focus {
-                font-weight: normal;
-            }
-        }
-        .keys-options-wrapper {
-            width: 100%;
-            max-height: 150px;
-            overflow-y: scroll;
-            position: absolute;
-            top: 28px;
-            box-shadow: 0 10px 16px rgba(0, 0, 0, 0.1);
-            background-color: white;
-            .key-option {
-                background-color: white;
-                border: 1px solid lightgray;
-                padding: 2px 3px;
-                &:not(:first-child) {
-                    border-top: 0;
-                }
-                &:hover {
-                    background-color: $light-color-secondary;
-                }
-            }
-        }
-    }
-    .columnMenu-colors {
-        display: flex;
-        justify-content: space-between;
-        flex-wrap: wrap;
-        .columnMenu-colorPicker {
-            cursor: pointer;
-            width: 20px;
-            height: 20px;
-            border-radius: 10px;
-            &.active {
-                border: 2px solid white;
-                box-shadow: 0 0 0 2px lightgray;
-            }
-        }
-    }
-}
-
-.collectionSchema-row {
-    height: 100%;
-    background-color: white;
-    &.row-focused .rt-td {
-        background-color: #bfffc0; //$light-color-secondary;
-    }
-    &.row-wrapped {
-        .rt-td {
-            white-space: normal;
-        }
-    }
-    .row-dragger {
-        display: flex;
-        justify-content: space-around;
-        //flex: 50 0 auto;
-        width: 0;
-        max-width: 50px;
-        //height: 100%;
-        min-height: 30px;
-        align-items: center;
-        color: lightgray;
-        background-color: white;
-        transition: color 0.1s ease;
-        .row-option {
-            // padding: 5px;
-            cursor: pointer;
-            position: absolute;
-            transition: color 0.1s ease;
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-            z-index: 2;
-            &:hover {
-                color: gray;
-            }
-        }
-    }
-    .collectionSchema-row-wrapper {
-        &.row-above {
-            border-top: 1px solid red;
-        }
-        &.row-below {
-            border-bottom: 1px solid red;
-        }
-        &.row-inside {
-            border: 1px solid red;
-        }
-        .row-dragging {
-            background-color: blue;
-        }
-    }
-}
-
-.collectionSchemaView-cellContainer {
-    width: 100%;
-    height: unset;
-}
-
-.collectionSchemaView-cellWrapper {
-    height: 100%;
-    padding: 4px;
-    text-align: left;
-    padding-left: 19px;
-    position: relative;
-    &:focus {
-        outline: none;
-    }
-    &.editing {
-        padding: 0;
-        input {
-            outline: 0;
-            border: none;
-            background-color: rgb(255, 217, 217);
-            width: 100%;
-            height: 100%;
-            padding: 2px 3px;
-            min-height: 26px;
-        }
-    }
-    &.focused {
-        &.inactive {
-            border: none;
-        }
-    }
-    p {
-        width: 100%;
-        height: 100%;
-    }
-    &:hover .collectionSchemaView-cellContents-docExpander {
-        display: block;
-    }
-    .collectionSchemaView-cellContents-document {
-        display: inline-block;
-    }
-    .collectionSchemaView-cellContents-docButton {
-        float: right;
-        width: "15px";
-        height: "15px";
-    }
-    .collectionSchemaView-dropdownWrapper {
-        border: grey;
-        border-style: solid;
-        border-width: 1px;
-        height: 30px;
-        .collectionSchemaView-dropdownButton {
-            //display: inline-block;
-            float: left;
-            height: 100%;
-        }
-        .collectionSchemaView-dropdownText {
-            display: inline-block;
-            //float: right;
-            height: 100%;
-            display: "flex";
-            font-size: 13;
-            justify-content: "center";
-            align-items: "center";
-        }
-    }
-    .collectionSchemaView-dropdownContainer {
-        position: absolute;
-        border: 1px solid rgba(0, 0, 0, 0.04);
-        box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14);
-        .collectionSchemaView-dropdownOption:hover {
-            background-color: rgba(0, 0, 0, 0.14);
-            cursor: pointer;
-        }
-    }
-}
-
-.collectionSchemaView-cellContents-docExpander {
-    height: 30px;
-    width: 30px;
-    display: none;
-    position: absolute;
-    top: 0;
-    right: 0;
-    background-color: lightgray;
-}
-
-.doc-drag-over {
-    background-color: red;
-}
-
-.collectionSchemaView-toolbar {
-    z-index: 100;
-}
-
-.collectionSchemaView-toolbar {
-    height: 30px;
-    display: flex;
-    justify-content: flex-end;
-    padding: 0 10px;
-    border-bottom: 2px solid gray;
-    .collectionSchemaView-toolbar-item {
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-    }
-}
-
-#preview-schema-checkbox-div {
-    margin-left: 20px;
-    font-size: 12px;
-}
-
-.collectionSchemaView-table {
-    width: 100%;
-    height: 100%;
-    overflow: auto;
-    padding: 3px;
-}
-
-.rt-td.rt-expandable {
-    overflow: visible;
-    position: relative;
-    height: 100%;
-    z-index: 1;
-}
-
-.reactTable-sub {
-    background-color: rgb(252, 252, 252);
-    width: 100%;
-    .rt-thead {
-        display: none;
-    }
-    .row-dragger {
-        background-color: rgb(252, 252, 252);
-    }
-    .rt-table {
-        background-color: rgb(252, 252, 252);
-    }
-    .collectionSchemaView-table {
-        width: 100%;
-        border: solid 1px;
-        overflow: visible;
-        padding: 0px;
-    }
-}
-
-.collectionSchemaView-expander {
-    height: 100%;
-    min-height: 30px;
-    position: absolute;
-    color: gray;
-    width: 20;
-    height: auto;
-    left: 55;
-    svg {
-        position: absolute;
-        top: 50%;
-        left: 10;
-        transform: translate(-50%, -50%);
-    }
-}
-
-.collectionSchemaView-addRow {
-    color: gray;
-    letter-spacing: 2px;
-    text-transform: uppercase;
-    cursor: pointer;
-    font-size: 10.5px;
-    margin-left: 50px;
-    margin-top: 10px;
-}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaView.tsx b/src/client/views/collections/schemaView/CollectionSchemaView.tsx
deleted file mode 100644
index ef28f75c8..000000000
--- a/src/client/views/collections/schemaView/CollectionSchemaView.tsx
+++ /dev/null
@@ -1,575 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { action, computed, observable, untracked } from "mobx";
-import { observer } from "mobx-react";
-import Measure from "react-measure";
-import { Resize } from "react-table";
-import "react-table/react-table.css";
-import { Doc, Opt } from "../../../../fields/Doc";
-import { List } from "../../../../fields/List";
-import { listSpec } from "../../../../fields/Schema";
-import { PastelSchemaPalette, SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
-import { Cast, NumCast } from "../../../../fields/Types";
-import { TraceMobx } from "../../../../fields/util";
-import { emptyFunction, emptyPath, returnFalse, setupMoveUpEvents, returnEmptyDoclist, returnTrue } from "../../../../Utils";
-import { SelectionManager } from "../../../util/SelectionManager";
-import { SnappingManager } from "../../../util/SnappingManager";
-import { Transform } from "../../../util/Transform";
-import { undoBatch } from "../../../util/UndoManager";
-import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../globalCssVariables.scss';
-import { ContextMenu } from "../../ContextMenu";
-import { ContextMenuProps } from "../../ContextMenuItem";
-import '../../../views/DocumentDecorations.scss';
-import { DocumentView } from "../../nodes/DocumentView";
-import { DefaultStyleProvider } from "../../StyleProvider";
-import "./CollectionSchemaView.scss";
-import { CollectionSubView } from "../CollectionSubView";
-import { SchemaTable } from "./SchemaTable";
-import { DocUtils } from "../../../documents/Documents";
-// bcz: need to add drag and drop of rows and columns.  This seems like it might work for rows: https://codesandbox.io/s/l94mn1q657
-
-export enum ColumnType {
-    Any,
-    Number,
-    String,
-    Boolean,
-    Doc,
-    Image,
-    List,
-    Date
-}
-// this map should be used for keys that should have a const type of value
-const columnTypes: Map<string, ColumnType> = new Map([
-    ["title", ColumnType.String],
-    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
-    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
-    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
-]);
-
-@observer
-export class CollectionSchemaView extends CollectionSubView(doc => doc) {
-    private _previewCont?: HTMLDivElement;
-
-    @observable _previewDoc: Doc | undefined = undefined;
-    @observable _focusedTable: Doc = this.props.Document;
-    @observable _col: any = "";
-    @observable _menuWidth = 0;
-    @observable _headerOpen = false;
-    @observable _headerIsEditing = false;
-    @observable _menuHeight = 0;
-    @observable _pointerX = 0;
-    @observable _pointerY = 0;
-    @observable _openTypes: boolean = false;
-
-    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
-    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
-    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
-    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
-    @computed get scale() { return this.props.ScreenToLocalTransform().Scale; }
-    @computed get columns() { return Cast(this.props.Document._schemaHeaders, listSpec(SchemaHeaderField), []); }
-    set columns(columns: SchemaHeaderField[]) { this.props.Document._schemaHeaders = new List<SchemaHeaderField>(columns); }
-
-    @computed get menuCoordinates() {
-        let searchx = 0;
-        let searchy = 0;
-        if (this.props.Document._searchDoc) {
-            const el = document.getElementsByClassName("collectionSchemaView-searchContainer")[0];
-            if (el !== undefined) {
-                const rect = el.getBoundingClientRect();
-                searchx = rect.x;
-                searchy = rect.y;
-            }
-        }
-        const x = Math.max(0, Math.min(document.body.clientWidth - this._menuWidth, this._pointerX)) - searchx;
-        const y = Math.max(0, Math.min(document.body.clientHeight - this._menuHeight, this._pointerY)) - searchy;
-        return this.props.ScreenToLocalTransform().transformPoint(x, y);
-    }
-
-    get documentKeys() {
-        const docs = this.childDocs;
-        const keys: { [key: string]: boolean } = {};
-        // bcz: ugh.  this is untracked since otherwise a large collection of documents will blast the server for all their fields.
-        //  then as each document's fields come back, we update the documents _proxies.  Each time we do this, the whole schema will be
-        //  invalidated and re-rendered.   This workaround will inquire all of the document fields before the options button is clicked.
-        //  then by the time the options button is clicked, all of the fields should be in place.  If a new field is added while this menu
-        //  is displayed (unlikely) it won't show up until something else changes.
-        //TODO Types
-        untracked(() => docs.map(doc => Doc.GetAllPrototypes(doc).map(proto => Object.keys(proto).forEach(key => keys[key] = false))));
-
-        this.columns.forEach(key => keys[key.heading] = true);
-        return Array.from(Object.keys(keys));
-    }
-
-    @action setHeaderIsEditing = (isEditing: boolean) => this._headerIsEditing = isEditing;
-
-    @undoBatch
-    setColumnType = action((columnField: SchemaHeaderField, type: ColumnType): void => {
-        this._openTypes = false;
-        if (columnTypes.get(columnField.heading)) return;
-
-        const columns = this.columns;
-        const index = columns.indexOf(columnField);
-        if (index > -1) {
-            columnField.setType(NumCast(type));
-            columns[index] = columnField;
-            this.columns = columns;
-        }
-    });
-
-    @undoBatch
-    setColumnColor = (columnField: SchemaHeaderField, color: string): void => {
-        const columns = this.columns;
-        const index = columns.indexOf(columnField);
-        if (index > -1) {
-            columnField.setColor(color);
-            columns[index] = columnField;
-            this.columns = columns; // need to set the columns to trigger rerender
-        }
-    }
-
-    @undoBatch
-    @action
-    setColumnSort = (columnField: SchemaHeaderField, descending: boolean | undefined) => {
-        const columns = this.columns;
-        columns.forEach(col => col.setDesc(undefined));
-
-        const index = columns.findIndex(c => c.heading === columnField.heading);
-        const column = columns[index];
-        column.setDesc(descending);
-        columns[index] = column;
-        this.columns = columns;
-    }
-
-    renderTypes = (col: any) => {
-        if (columnTypes.get(col.heading)) return (null);
-
-        const type = col.type;
-
-        const anyType = <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Any)}>
-            <FontAwesomeIcon icon={"align-justify"} size="sm" />
-                Any
-            </div>;
-
-        const numType = <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Number)}>
-            <FontAwesomeIcon icon={"hashtag"} size="sm" />
-                Number
-            </div>;
-
-        const textType = <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.String)}>
-            <FontAwesomeIcon icon={"font"} size="sm" />
-            Text
-            </div>;
-
-        const boolType = <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Boolean)}>
-            <FontAwesomeIcon icon={"check-square"} size="sm" />
-            Checkbox
-            </div>;
-
-        const listType = <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.List)}>
-            <FontAwesomeIcon icon={"list-ul"} size="sm" />
-            List
-            </div>;
-
-        const docType = <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Doc)}>
-            <FontAwesomeIcon icon={"file"} size="sm" />
-            Document
-            </div>;
-
-        const imageType = <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Image)}>
-            <FontAwesomeIcon icon={"image"} size="sm" />
-            Image
-            </div>;
-
-        const dateType = <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Date)}>
-            <FontAwesomeIcon icon={"calendar"} size="sm" />
-                Date
-                </div>;
-
-
-        const allColumnTypes = <div className="columnMenu-types">
-            {anyType}
-            {numType}
-            {textType}
-            {boolType}
-            {listType}
-            {docType}
-            {imageType}
-            {dateType}
-        </div>;
-
-        const justColType = type === ColumnType.Any ? anyType : type === ColumnType.Number ? numType :
-            type === ColumnType.String ? textType : type === ColumnType.Boolean ? boolType :
-                type === ColumnType.List ? listType : type === ColumnType.Doc ? docType :
-                    type === ColumnType.Date ? dateType : imageType;
-
-        return (
-            <div className="collectionSchema-headerMenu-group" onClick={action(() => this._openTypes = !this._openTypes)}>
-                <div>
-                    <label style={{ cursor: "pointer" }}>Column type:</label>
-                    <FontAwesomeIcon icon={"caret-down"} size="lg" style={{ float: "right", transform: `rotate(${this._openTypes ? "180deg" : 0})`, transition: "0.2s all ease" }} />
-                </div>
-                {this._openTypes ? allColumnTypes : justColType}
-            </div >
-        );
-    }
-
-    renderSorting = (col: any) => {
-        const sort = col.desc;
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Sort by:</label>
-                <div className="columnMenu-sort">
-                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.setColumnSort(col, true)}>
-                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
-                        Sort descending
-                    </div>
-                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.setColumnSort(col, false)}>
-                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
-                        Sort ascending
-                    </div>
-                    <div className="columnMenu-option" onClick={() => this.setColumnSort(col, undefined)}>
-                        <FontAwesomeIcon icon="times" size="sm" />
-                        Clear sorting
-                    </div>
-                </div>
-            </div>
-        );
-    }
-
-    renderColors = (col: any) => {
-        const selected = col.color;
-
-        const pink = PastelSchemaPalette.get("pink2");
-        const purple = PastelSchemaPalette.get("purple2");
-        const blue = PastelSchemaPalette.get("bluegreen1");
-        const yellow = PastelSchemaPalette.get("yellow4");
-        const red = PastelSchemaPalette.get("red2");
-        const gray = "#f1efeb";
-
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Color:</label>
-                <div className="columnMenu-colors">
-                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.setColumnColor(col, pink!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.setColumnColor(col, purple!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.setColumnColor(col, blue!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.setColumnColor(col, yellow!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.setColumnColor(col, red!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.setColumnColor(col, gray)}></div>
-                </div>
-            </div>
-        );
-    }
-
-    @undoBatch
-    @action
-    changeColumns = (oldKey: string, newKey: string, addNew: boolean, filter?: string) => {
-        const columns = this.columns;
-        if (columns === undefined) {
-            this.columns = new List<SchemaHeaderField>([new SchemaHeaderField(newKey, "f1efeb")]);
-        } else {
-            if (addNew) {
-                columns.push(new SchemaHeaderField(newKey, "f1efeb"));
-                this.columns = columns;
-            } else {
-                const index = columns.map(c => c.heading).indexOf(oldKey);
-                if (index > -1) {
-                    const column = columns[index];
-                    column.setHeading(newKey);
-                    columns[index] = column;
-                    this.columns = columns;
-                    if (filter) {
-                        Doc.setDocFilter(this.props.Document, newKey, filter, "match");
-                    }
-                    else {
-                        this.props.Document._docFilters = undefined;
-                    }
-                }
-            }
-        }
-    }
-
-    @action
-    openHeader = (col: any, screenx: number, screeny: number) => {
-        this._col = col;
-        this._headerOpen = true;
-        this._pointerX = screenx;
-        this._pointerY = screeny;
-    }
-
-    @action
-    closeHeader = () => { this._headerOpen = false; }
-
-    @undoBatch
-    @action
-    deleteColumn = (key: string) => {
-        const columns = this.columns;
-        if (columns === undefined) {
-            this.columns = new List<SchemaHeaderField>([]);
-        } else {
-            const index = columns.map(c => c.heading).indexOf(key);
-            if (index > -1) {
-                columns.splice(index, 1);
-                this.columns = columns;
-            }
-        }
-        this.closeHeader();
-    }
-
-    getPreviewTransform = (): Transform => {
-        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - NumCast(COLLECTION_BORDER_WIDTH) - this.tableWidth, - this.borderWidth);
-    }
-
-    @action
-    onHeaderClick = (e: React.PointerEvent) => {
-        e.stopPropagation();
-    }
-
-    @action
-    onWheel(e: React.WheelEvent) {
-        const scale = this.props.ScreenToLocalTransform().Scale;
-        this.props.isContentActive(true) && e.stopPropagation();
-    }
-
-    @computed get renderMenuContent() {
-        TraceMobx();
-        return <div className="collectionSchema-header-menuOptions">
-            {this.renderTypes(this._col)}
-            {this.renderColors(this._col)}
-            <div className="collectionSchema-headerMenu-group">
-                <button onClick={() => { this.deleteColumn(this._col.heading); }}
-                >Delete Column</button>
-            </div>
-        </div>;
-    }
-
-    private createTarget = (ele: HTMLDivElement) => {
-        this._previewCont = ele;
-        super.CreateDropTarget(ele);
-    }
-
-    isFocused = (doc: Doc, outsideReaction: boolean): boolean => this.props.isSelected(outsideReaction) && doc === this._focusedTable;
-
-    @action setFocused = (doc: Doc) => this._focusedTable = doc;
-
-    @action setPreviewDoc = (doc: Opt<Doc>) => {
-        SelectionManager.SelectSchemaView(this, doc);
-        this._previewDoc = doc;
-    }
-
-    //toggles preview side-panel of schema
-    @action
-    toggleExpander = () => {
-        this.props.Document.schemaPreviewWidth = this.previewWidth() === 0 ? Math.min(this.tableWidth / 3, 200) : 0;
-    }
-
-    onDividerDown = (e: React.PointerEvent) => {
-        setupMoveUpEvents(this, e, this.onDividerMove, emptyFunction, this.toggleExpander);
-    }
-    @action
-    onDividerMove = (e: PointerEvent, down: number[], delta: number[]) => {
-        const nativeWidth = this._previewCont!.getBoundingClientRect();
-        const minWidth = 40;
-        const maxWidth = 1000;
-        const movedWidth = this.props.ScreenToLocalTransform().transformDirection(nativeWidth.right - e.clientX, 0)[0];
-        const width = movedWidth < minWidth ? minWidth : movedWidth > maxWidth ? maxWidth : movedWidth;
-        this.props.Document.schemaPreviewWidth = width;
-        return false;
-    }
-
-    onPointerDown = (e: React.PointerEvent): void => {
-        if (e.button === 0 && !e.altKey && !e.ctrlKey && !e.metaKey) {
-            if (this.props.isSelected(true)) e.stopPropagation();
-            else this.props.select(false);
-        }
-    }
-
-    @computed
-    get previewDocument(): Doc | undefined { return this._previewDoc; }
-
-    @computed
-    get dividerDragger() {
-        return this.previewWidth() === 0 ? (null) :
-            <div className="collectionSchemaView-dividerDragger" onPointerDown={this.onDividerDown} >
-                <div className="collectionSchemaView-dividerDragger" />
-            </div>;
-    }
-
-    @computed
-    get previewPanel() {
-        return <div ref={this.createTarget} style={{ width: `${this.previewWidth()}px` }}>
-            {!this.previewDocument ? (null) :
-                <DocumentView
-                    Document={this.previewDocument}
-                    DataDoc={undefined}
-                    fitContentsToDoc={returnTrue}
-                    freezeDimensions={true}
-                    dontCenter={"y"}
-                    focus={DocUtils.DefaultFocus}
-                    renderDepth={this.props.renderDepth}
-                    rootSelected={this.rootSelected}
-                    PanelWidth={this.previewWidth}
-                    PanelHeight={this.previewHeight}
-                    isContentActive={returnTrue}
-                    isDocumentActive={returnFalse}
-                    ScreenToLocalTransform={this.getPreviewTransform}
-                    docFilters={this.docFilters}
-                    docRangeFilters={this.docRangeFilters}
-                    searchFilterDocs={this.searchFilterDocs}
-                    styleProvider={DefaultStyleProvider}
-                    layerProvider={undefined}
-                    docViewPath={returnEmptyDoclist}
-                    ContainingCollectionDoc={this.props.CollectionView?.props.Document}
-                    ContainingCollectionView={this.props.CollectionView}
-                    moveDocument={this.props.moveDocument}
-                    addDocument={this.props.addDocument}
-                    removeDocument={this.props.removeDocument}
-                    whenChildContentsActiveChanged={this.props.whenChildContentsActiveChanged}
-                    addDocTab={this.props.addDocTab}
-                    pinToPres={this.props.pinToPres}
-                    bringToFront={returnFalse}
-                />}
-        </div>;
-    }
-
-    @computed
-    get schemaTable() {
-        return <SchemaTable
-            Document={this.props.Document}
-            PanelHeight={this.props.PanelHeight}
-            PanelWidth={this.props.PanelWidth}
-            childDocs={this.childDocs}
-            CollectionView={this.props.CollectionView}
-            ContainingCollectionView={this.props.ContainingCollectionView}
-            ContainingCollectionDoc={this.props.ContainingCollectionDoc}
-            fieldKey={this.props.fieldKey}
-            renderDepth={this.props.renderDepth}
-            moveDocument={this.props.moveDocument}
-            ScreenToLocalTransform={this.props.ScreenToLocalTransform}
-            active={this.props.isContentActive}
-            onDrop={this.onExternalDrop}
-            addDocTab={this.props.addDocTab}
-            pinToPres={this.props.pinToPres}
-            isSelected={this.props.isSelected}
-            isFocused={this.isFocused}
-            setFocused={this.setFocused}
-            setPreviewDoc={this.setPreviewDoc}
-            deleteDocument={this.props.removeDocument}
-            addDocument={this.props.addDocument}
-            dataDoc={this.props.DataDoc}
-            columns={this.columns}
-            documentKeys={this.documentKeys}
-            headerIsEditing={this._headerIsEditing}
-            openHeader={this.openHeader}
-            onClick={this.onTableClick}
-            onPointerDown={emptyFunction}
-            onResizedChange={this.onResizedChange}
-            setColumns={this.setColumns}
-            reorderColumns={this.reorderColumns}
-            changeColumns={this.changeColumns}
-            setHeaderIsEditing={this.setHeaderIsEditing}
-            changeColumnSort={this.setColumnSort}
-        />;
-    }
-
-    @computed
-    public get schemaToolbar() {
-        return <div className="collectionSchemaView-toolbar">
-            <div className="collectionSchemaView-toolbar-item">
-                <div id="preview-schema-checkbox-div">
-                    <input type="checkbox" key={"Show Preview"} checked={this.previewWidth() !== 0} onChange={this.toggleExpander} />
-                    Show Preview
-                </div>
-            </div>
-        </div>;
-    }
-
-    onSpecificMenu = (e: React.MouseEvent) => {
-        if ((e.target as any)?.className?.includes?.("collectionSchemaView-cell") || (e.target instanceof HTMLSpanElement)) {
-            const cm = ContextMenu.Instance;
-            const options = cm.findByDescription("Options...");
-            const optionItems: ContextMenuProps[] = options && "subitems" in options ? options.subitems : [];
-            optionItems.push({ description: "remove", event: () => this._previewDoc && this.props.removeDocument?.(this._previewDoc), icon: "trash" });
-            !options && cm.addItem({ description: "Options...", subitems: optionItems, icon: "compass" });
-            cm.displayMenu(e.clientX, e.clientY);
-            (e.nativeEvent as any).SchemaHandled = true; // not sure why this is needed, but if you right-click quickly on a cell, the Document/Collection contextMenu handlers still fire without this.
-            e.stopPropagation();
-        }
-    }
-
-    @action
-    onTableClick = (e: React.MouseEvent): void => {
-        if (!(e.target as any)?.className?.includes?.("collectionSchemaView-cell") && !(e.target instanceof HTMLSpanElement)) {
-            this.setPreviewDoc(undefined);
-        } else {
-            e.stopPropagation();
-        }
-        this.setFocused(this.props.Document);
-        this.closeHeader();
-    }
-
-    onResizedChange = (newResized: Resize[], event: any) => {
-        const columns = this.columns;
-        newResized.forEach(resized => {
-            const index = columns.findIndex(c => c.heading === resized.id);
-            const column = columns[index];
-            column.setWidth(resized.value);
-            columns[index] = column;
-        });
-        this.columns = columns;
-    }
-
-    @action
-    setColumns = (columns: SchemaHeaderField[]) => this.columns = columns
-
-    @undoBatch
-    reorderColumns = (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => {
-        const columns = [...columnsValues];
-        const oldIndex = columns.indexOf(toMove);
-        const relIndex = columns.indexOf(relativeTo);
-        const newIndex = (oldIndex > relIndex && !before) ? relIndex + 1 : (oldIndex < relIndex && before) ? relIndex - 1 : relIndex;
-
-        if (oldIndex === newIndex) return;
-
-        columns.splice(newIndex, 0, columns.splice(oldIndex, 1)[0]);
-        this.columns = columns;
-    }
-
-    onZoomMenu = (e: React.WheelEvent) => this.props.isContentActive(true) && e.stopPropagation();
-
-    render() {
-        TraceMobx();
-        if (!this.props.isContentActive()) setTimeout(() => this.closeHeader(), 0);
-        const menuContent = this.renderMenuContent;
-        const menu = <div className="collectionSchema-header-menu"
-            onWheel={e => this.onZoomMenu(e)}
-            onPointerDown={e => this.onHeaderClick(e)}
-            style={{ transform: `translate(${(this.menuCoordinates[0])}px, ${(this.menuCoordinates[1])}px)` }}>
-            <Measure offset onResize={action((r: any) => {
-                const dim = this.props.ScreenToLocalTransform().inverse().transformDirection(r.offset.width, r.offset.height);
-                this._menuWidth = dim[0]; this._menuHeight = dim[1];
-            })}>
-                {({ measureRef }) => <div ref={measureRef}> {menuContent} </div>}
-            </Measure>
-        </div>;
-        return <div className={"collectionSchemaView" + (this.props.Document._searchDoc ? "-searchContainer" : "-container")}
-            style={{
-                overflow: this.props.scrollOverflow === true ? "scroll" : undefined, backgroundColor: "white",
-                pointerEvents: this.props.Document._searchDoc !== undefined && !this.props.isContentActive() && !SnappingManager.GetIsDragging() ? "none" : undefined,
-                width: name === "collectionSchemaView-searchContainer" ? "auto" : this.props.PanelWidth() || "100%", height: this.props.PanelHeight() || "100%", position: "relative",
-            }}  >
-            <div className="collectionSchemaView-tableContainer"
-                style={{ width: `calc(100% - ${this.previewWidth()}px)` }}
-                onContextMenu={this.onSpecificMenu}
-                onPointerDown={this.onPointerDown}
-                onWheel={e => this.props.isContentActive(true) && e.stopPropagation()}
-                onDrop={e => this.onExternalDrop(e, {})}
-                ref={this.createTarget}>
-                {this.schemaTable}
-            </div>
-            {this.dividerDragger}
-            {!this.previewWidth() ? (null) : this.previewPanel}
-            {this._headerOpen && this.props.isContentActive() ? menu : null}
-        </div>;
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/SchemaTable.tsx b/src/client/views/collections/schemaView/SchemaTable.tsx
deleted file mode 100644
index 0d5c9e077..000000000
--- a/src/client/views/collections/schemaView/SchemaTable.tsx
+++ /dev/null
@@ -1,601 +0,0 @@
-import React = require("react");
-import { IconProp } from '@fortawesome/fontawesome-svg-core';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { action, computed, observable } from "mobx";
-import { observer } from "mobx-react";
-import ReactTable, { CellInfo, Column, ComponentPropsGetterR, Resize, SortingRule } from "react-table";
-import "react-table/react-table.css";
-import { DateField } from "../../../../fields/DateField";
-import { AclPrivate, AclReadonly, DataSym, Doc, DocListCast, Field, Opt } from "../../../../fields/Doc";
-import { Id } from "../../../../fields/FieldSymbols";
-import { List } from "../../../../fields/List";
-import { listSpec } from "../../../../fields/Schema";
-import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
-import { ComputedField } from "../../../../fields/ScriptField";
-import { Cast, FieldValue, NumCast, StrCast } from "../../../../fields/Types";
-import { ImageField } from "../../../../fields/URLField";
-import { GetEffectiveAcl } from "../../../../fields/util";
-import { emptyFunction, emptyPath, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue } from "../../../../Utils";
-import { Docs, DocumentOptions, DocUtils } from "../../../documents/Documents";
-import { DocumentType } from "../../../documents/DocumentTypes";
-import { CompileScript, Transformer, ts } from "../../../util/Scripting";
-import { Transform } from "../../../util/Transform";
-import { undoBatch } from "../../../util/UndoManager";
-import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../globalCssVariables.scss';
-import { ContextMenu } from "../../ContextMenu";
-import '../../../views/DocumentDecorations.scss';
-import { DocumentView } from "../../nodes/DocumentView";
-import { DefaultStyleProvider } from "../../StyleProvider";
-import { CellProps, CollectionSchemaButtons, CollectionSchemaCell, CollectionSchemaCheckboxCell, CollectionSchemaDateCell, CollectionSchemaDocCell, CollectionSchemaImageCell, CollectionSchemaListCell, CollectionSchemaNumberCell, CollectionSchemaStringCell } from "./CollectionSchemaCells";
-import { CollectionSchemaAddColumnHeader, KeysDropdown } from "./CollectionSchemaHeaders";
-import { MovableColumn } from "./CollectionSchemaMovableColumn";
-import { MovableRow } from "./CollectionSchemaMovableRow";
-import "./CollectionSchemaView.scss";
-import { CollectionView } from "../CollectionView";
-
-
-enum ColumnType {
-    Any,
-    Number,
-    String,
-    Boolean,
-    Doc,
-    Image,
-    List,
-    Date
-}
-
-// this map should be used for keys that should have a const type of value
-const columnTypes: Map<string, ColumnType> = new Map([
-    ["title", ColumnType.String],
-    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
-    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
-    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
-]);
-
-export interface SchemaTableProps {
-    Document: Doc; // child doc
-    dataDoc?: Doc;
-    PanelHeight: () => number;
-    PanelWidth: () => number;
-    childDocs?: Doc[];
-    CollectionView: Opt<CollectionView>;
-    ContainingCollectionView: Opt<CollectionView>;
-    ContainingCollectionDoc: Opt<Doc>;
-    fieldKey: string;
-    renderDepth: number;
-    deleteDocument?: (document: Doc | Doc[]) => boolean;
-    addDocument?: (document: Doc | Doc[]) => boolean;
-    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (document: Doc | Doc[]) => boolean) => boolean;
-    ScreenToLocalTransform: () => Transform;
-    active: (outsideReaction: boolean | undefined) => boolean;
-    onDrop: (e: React.DragEvent<Element>, options: DocumentOptions, completed?: (() => void) | undefined) => void;
-    addDocTab: (document: Doc, where: string) => boolean;
-    pinToPres: (document: Doc) => void;
-    isSelected: (outsideReaction?: boolean) => boolean;
-    isFocused: (document: Doc, outsideReaction: boolean) => boolean;
-    setFocused: (document: Doc) => void;
-    setPreviewDoc: (document: Opt<Doc>) => void;
-    columns: SchemaHeaderField[];
-    documentKeys: any[];
-    headerIsEditing: boolean;
-    openHeader: (column: any, screenx: number, screeny: number) => void;
-    onClick: (e: React.MouseEvent) => void;
-    onPointerDown: (e: React.PointerEvent) => void;
-    onResizedChange: (newResized: Resize[], event: any) => void;
-    setColumns: (columns: SchemaHeaderField[]) => void;
-    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => void;
-    changeColumns: (oldKey: string, newKey: string, addNew: boolean) => void;
-    setHeaderIsEditing: (isEditing: boolean) => void;
-    changeColumnSort: (columnField: SchemaHeaderField, descending: boolean | undefined) => void;
-}
-
-@observer
-export class SchemaTable extends React.Component<SchemaTableProps> {
-    @observable _cellIsEditing: boolean = false;
-    @observable _focusedCell: { row: number, col: number } = { row: 0, col: 0 };
-    @observable _openCollections: Set<number> = new Set;
-
-    @observable _showDoc: Doc | undefined;
-    @observable _showDataDoc: any = "";
-    @observable _showDocPos: number[] = [];
-
-    @observable _showTitleDropdown: boolean = false;
-
-    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
-    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
-    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
-
-    @computed get childDocs() {
-        if (this.props.childDocs) return this.props.childDocs;
-
-        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
-        return DocListCast(doc[this.props.fieldKey]);
-    }
-    set childDocs(docs: Doc[]) {
-        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
-        doc[this.props.fieldKey] = new List<Doc>(docs);
-    }
-
-    @computed get textWrappedRows() {
-        return Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
-    }
-    set textWrappedRows(textWrappedRows: string[]) {
-        this.props.Document.textwrappedSchemaRows = new List<string>(textWrappedRows);
-    }
-
-    @computed get resized(): { id: string, value: number }[] {
-        return this.props.columns.reduce((resized, shf) => {
-            (shf.width > -1) && resized.push({ id: shf.heading, value: shf.width });
-            return resized;
-        }, [] as { id: string, value: number }[]);
-    }
-    @computed get sorted(): SortingRule[] {
-        return this.props.columns.reduce((sorted, shf) => {
-            shf.desc !== undefined && sorted.push({ id: shf.heading, desc: shf.desc });
-            return sorted;
-        }, [] as SortingRule[]);
-    }
-
-    @action
-    changeSorting = (col: any) => {
-        this.props.changeColumnSort(col, col.desc === true ? false : col.desc === false ? undefined : true);
-    }
-
-    @action
-    changeTitleMode = () => this._showTitleDropdown = !this._showTitleDropdown
-
-    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
-    @computed get tableColumns(): Column<Doc>[] {
-        const possibleKeys = this.props.documentKeys.filter(key => this.props.columns.findIndex(existingKey => existingKey.heading.toUpperCase() === key.toUpperCase()) === -1);
-        const columns: Column<Doc>[] = [];
-        const tableIsFocused = this.props.isFocused(this.props.Document, false);
-        const focusedRow = this._focusedCell.row;
-        const focusedCol = this._focusedCell.col;
-        const isEditable = !this.props.headerIsEditing;
-
-        columns.push({
-            expander: true, Header: "", width: 58,
-            Expander: (rowInfo) => {
-                return rowInfo.original.type !== DocumentType.COL ? (null) :
-                    <div className="collectionSchemaView-expander" onClick={action(() => (this._openCollections[rowInfo.isExpanded ? "delete" : "add"])(rowInfo.viewIndex))}>
-                        <FontAwesomeIcon icon={rowInfo.isExpanded ? "caret-down" : "caret-right"} size="lg" />
-                    </div>;
-            }
-        });
-        columns.push(...this.props.columns.map(col => {
-            const icon: IconProp = this.getColumnType(col) === ColumnType.Number ? "hashtag" : this.getColumnType(col) === ColumnType.String ? "font" :
-                this.getColumnType(col) === ColumnType.Boolean ? "check-square" : this.getColumnType(col) === ColumnType.Doc ? "file" :
-                    this.getColumnType(col) === ColumnType.Image ? "image" : this.getColumnType(col) === ColumnType.List ? "list-ul" :
-                        this.getColumnType(col) === ColumnType.Date ? "calendar" : "align-justify";
-
-            const keysDropdown = <KeysDropdown
-                keyValue={col.heading}
-                possibleKeys={possibleKeys}
-                existingKeys={this.props.columns.map(c => c.heading)}
-                canAddNew={true}
-                addNew={false}
-                onSelect={this.props.changeColumns}
-                setIsEditing={this.props.setHeaderIsEditing}
-                docs={this.props.childDocs}
-                Document={this.props.Document}
-                dataDoc={this.props.dataDoc}
-                fieldKey={this.props.fieldKey}
-                ContainingCollectionDoc={this.props.ContainingCollectionDoc}
-                ContainingCollectionView={this.props.ContainingCollectionView}
-                active={this.props.active}
-                openHeader={this.props.openHeader}
-                icon={icon}
-                col={col}
-                // try commenting this out
-                width={"100%"}
-            />;
-
-            const sortIcon = col.desc === undefined ? "caret-right" : col.desc === true ? "caret-down" : "caret-up";
-            const header = <div className="collectionSchemaView-menuOptions-wrapper" style={{ background: col.color, padding: "2px", display: "flex", cursor: "default", height: "100%", }}>
-                {keysDropdown}
-                <div onClick={e => this.changeSorting(col)} style={{ width: 21, padding: 1, display: "inline", zIndex: 1, background: "inherit", cursor: "hand" }}>
-                    <FontAwesomeIcon icon={sortIcon} size="lg" />
-                </div>
-            </div>;
-
-            return {
-                Header: <MovableColumn columnRenderer={header} columnValue={col} allColumns={this.props.columns} reorderColumns={this.props.reorderColumns} ScreenToLocalTransform={this.props.ScreenToLocalTransform} />,
-                accessor: (doc: Doc) => doc ? Field.toString(doc[col.heading] as Field) : 0,
-                id: col.heading,
-                Cell: (rowProps: CellInfo) => {
-                    const rowIndex = rowProps.index;
-                    const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
-                    const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
-
-                    const props: CellProps = {
-                        row: rowIndex,
-                        col: columnIndex,
-                        rowProps: rowProps,
-                        isFocused: isFocused,
-                        changeFocusedCellByIndex: this.changeFocusedCellByIndex,
-                        CollectionView: this.props.CollectionView,
-                        ContainingCollection: this.props.ContainingCollectionView,
-                        Document: this.props.Document,
-                        fieldKey: this.props.fieldKey,
-                        renderDepth: this.props.renderDepth,
-                        addDocTab: this.props.addDocTab,
-                        pinToPres: this.props.pinToPres,
-                        moveDocument: this.props.moveDocument,
-                        setIsEditing: this.setCellIsEditing,
-                        isEditable: isEditable,
-                        setPreviewDoc: this.props.setPreviewDoc,
-                        setComputed: this.setComputed,
-                        getField: this.getField,
-                        showDoc: this.showDoc,
-                    };
-
-
-                    switch (this.getColumnType(col, rowProps.original, rowProps.column.id)) {
-                        case ColumnType.Number: return <CollectionSchemaNumberCell {...props} />;
-                        case ColumnType.String: return <CollectionSchemaStringCell {...props} />;
-                        case ColumnType.Boolean: return <CollectionSchemaCheckboxCell {...props} />;
-                        case ColumnType.Doc: return <CollectionSchemaDocCell {...props} />;
-                        case ColumnType.Image: return <CollectionSchemaImageCell {...props} />;
-                        case ColumnType.List: return <CollectionSchemaListCell {...props} />;
-                        case ColumnType.Date: return <CollectionSchemaDateCell {...props} />;
-                        default:
-                            return <CollectionSchemaCell {...props} />;
-                    }
-                },
-                minWidth: 200,
-            };
-        }));
-        columns.push({
-            Header: <CollectionSchemaAddColumnHeader createColumn={this.createColumn} />,
-            accessor: (doc: Doc) => 0,
-            id: "add",
-            Cell: (rowProps: CellInfo) => {
-                const rowIndex = rowProps.index;
-                const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
-                const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
-                return <CollectionSchemaButtons  {...{
-                    row: rowProps.index,
-                    col: columnIndex,
-                    rowProps: rowProps,
-                    isFocused: isFocused,
-                    changeFocusedCellByIndex: this.changeFocusedCellByIndex,
-                    CollectionView: this.props.CollectionView,
-                    ContainingCollection: this.props.ContainingCollectionView,
-                    Document: this.props.Document,
-                    fieldKey: this.props.fieldKey,
-                    renderDepth: this.props.renderDepth,
-                    addDocTab: this.props.addDocTab,
-                    pinToPres: this.props.pinToPres,
-                    moveDocument: this.props.moveDocument,
-                    setIsEditing: this.setCellIsEditing,
-                    isEditable: isEditable,
-                    setPreviewDoc: this.props.setPreviewDoc,
-                    setComputed: this.setComputed,
-                    getField: this.getField,
-                    showDoc: this.showDoc,
-                }} />;
-            },
-            width: 28,
-            resizable: false
-        });
-        return columns;
-    }
-
-
-    constructor(props: SchemaTableProps) {
-        super(props);
-        if (this.props.Document._schemaHeaders === undefined) {
-            this.props.Document._schemaHeaders = new List<SchemaHeaderField>([new SchemaHeaderField("title", "#f1efeb"), new SchemaHeaderField("author", "#f1efeb"), new SchemaHeaderField("*lastModified", "#f1efeb", ColumnType.Date),
-            new SchemaHeaderField("text", "#f1efeb", ColumnType.String), new SchemaHeaderField("type", "#f1efeb"), new SchemaHeaderField("context", "#f1efeb", ColumnType.Doc)]);
-        }
-    }
-
-    componentDidMount() {
-        document.addEventListener("keydown", this.onKeyDown);
-    }
-
-    componentWillUnmount() {
-        document.removeEventListener("keydown", this.onKeyDown);
-    }
-
-    tableAddDoc = (doc: Doc, relativeTo?: Doc, before?: boolean) => {
-        const tableDoc = this.props.Document[DataSym];
-        const effectiveAcl = GetEffectiveAcl(tableDoc);
-
-        if (effectiveAcl !== AclPrivate && effectiveAcl !== AclReadonly) {
-            doc.context = this.props.Document;
-            tableDoc[this.props.fieldKey + "-lastModified"] = new DateField(new Date(Date.now()));
-            return Doc.AddDocToList(this.props.Document, this.props.fieldKey, doc, relativeTo, before);
-        }
-        return false;
-    }
-
-    private getTrProps: ComponentPropsGetterR = (state, rowInfo) => {
-        return !rowInfo ? {} : {
-            ScreenToLocalTransform: this.props.ScreenToLocalTransform,
-            addDoc: this.tableAddDoc,
-            removeDoc: this.props.deleteDocument,
-            rowInfo,
-            rowFocused: !this.props.headerIsEditing && rowInfo.index === this._focusedCell.row && this.props.isFocused(this.props.Document, true),
-            textWrapRow: this.toggleTextWrapRow,
-            rowWrapped: this.textWrappedRows.findIndex(id => rowInfo.original[Id] === id) > -1,
-            dropAction: StrCast(this.props.Document.childDropAction),
-            addDocTab: this.props.addDocTab
-        };
-    }
-
-    private getTdProps: ComponentPropsGetterR = (state, rowInfo, column, instance) => {
-        if (!rowInfo || column) return {};
-
-        const row = rowInfo.index;
-        //@ts-ignore
-        const col = this.columns.map(c => c.heading).indexOf(column!.id);
-        const isFocused = this._focusedCell.row === row && this._focusedCell.col === col && this.props.isFocused(this.props.Document, true);
-        // TODO: editing border doesn't work :(
-        return {
-            style: { border: !this.props.headerIsEditing && isFocused ? "2px solid rgb(255, 160, 160)" : "1px solid #f1efeb" }
-        };
-    }
-
-    @action setCellIsEditing = (isEditing: boolean) => this._cellIsEditing = isEditing;
-
-    @action
-    onKeyDown = (e: KeyboardEvent): void => {
-        if (!this._cellIsEditing && !this.props.headerIsEditing && this.props.isFocused(this.props.Document, true)) {// && this.props.isSelected(true)) {
-            const direction = e.key === "Tab" ? "tab" : e.which === 39 ? "right" : e.which === 37 ? "left" : e.which === 38 ? "up" : e.which === 40 ? "down" : "";
-            this._focusedCell = this.changeFocusedCellByDirection(direction, this._focusedCell.row, this._focusedCell.col);
-
-            if (direction) {
-                const pdoc = FieldValue(this.childDocs[this._focusedCell.row]);
-                pdoc && this.props.setPreviewDoc(pdoc);
-                e.stopPropagation();
-            }
-        } else if (e.keyCode === 27) {
-            this.props.setPreviewDoc(undefined);
-            e.stopPropagation(); // stopPropagation for left/right arrows 
-        }
-    }
-
-    changeFocusedCellByDirection = (direction: string, curRow: number, curCol: number) => {
-        switch (direction) {
-            case "tab": return { row: (curRow + 1 === this.childDocs.length ? 0 : curRow + 1), col: curCol + 1 === this.props.columns.length ? 0 : curCol + 1 };
-            case "right": return { row: curRow, col: curCol + 1 === this.props.columns.length ? curCol : curCol + 1 };
-            case "left": return { row: curRow, col: curCol === 0 ? curCol : curCol - 1 };
-            case "up": return { row: curRow === 0 ? curRow : curRow - 1, col: curCol };
-            case "down": return { row: curRow + 1 === this.childDocs.length ? curRow : curRow + 1, col: curCol };
-        }
-        return this._focusedCell;
-    }
-
-    @action
-    changeFocusedCellByIndex = (row: number, col: number): void => {
-        if (this._focusedCell.row !== row || this._focusedCell.col !== col) {
-            this._focusedCell = { row: row, col: col };
-        }
-        this.props.setFocused(this.props.Document);
-    }
-
-    @undoBatch
-    createRow = action(() => {
-        this.props.addDocument?.(Docs.Create.TextDocument("", { title: "", _width: 100, _height: 30 }));
-        this._focusedCell = { row: this.childDocs.length, col: this._focusedCell.col };
-    });
-
-    @undoBatch
-    @action
-    createColumn = () => {
-        let index = 0;
-        let found = this.props.columns.findIndex(col => col.heading.toUpperCase() === "New field".toUpperCase()) > -1;
-        while (found) {
-            index++;
-            found = this.props.columns.findIndex(col => col.heading.toUpperCase() === ("New field (" + index + ")").toUpperCase()) > -1;
-        }
-        this.props.columns.push(new SchemaHeaderField(`New field ${index ? "(" + index + ")" : ""}`, "#f1efeb"));
-    }
-
-    @action
-    getColumnType = (column: SchemaHeaderField, doc?: Doc, field?: string): ColumnType => {
-        if (doc && field && column.type === ColumnType.Any) {
-            const val = doc[CollectionSchemaCell.resolvedFieldKey(field, doc)];
-            if (val instanceof ImageField) return ColumnType.Image;
-            if (val instanceof Doc) return ColumnType.Doc;
-            if (val instanceof DateField) return ColumnType.Date;
-            if (val instanceof List) return ColumnType.List;
-        }
-        if (column.type && column.type !== 0) {
-            return column.type;
-        }
-        if (columnTypes.get(column.heading)) {
-            return column.type = columnTypes.get(column.heading)!;
-        }
-        return column.type = ColumnType.Any;
-    }
-
-    @undoBatch
-    @action
-    toggleTextwrap = async () => {
-        const textwrappedRows = Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
-        if (textwrappedRows.length) {
-            this.props.Document.textwrappedSchemaRows = new List<string>([]);
-        } else {
-            const docs = DocListCast(this.props.Document[this.props.fieldKey]);
-            const allRows = docs instanceof Doc ? [docs[Id]] : docs.map(doc => doc[Id]);
-            this.props.Document.textwrappedSchemaRows = new List<string>(allRows);
-        }
-    }
-
-    @action
-    toggleTextWrapRow = (doc: Doc): void => {
-        const textWrapped = this.textWrappedRows;
-        const index = textWrapped.findIndex(id => doc[Id] === id);
-
-        index > -1 ? textWrapped.splice(index, 1) : textWrapped.push(doc[Id]);
-
-        this.textWrappedRows = textWrapped;
-    }
-
-    @computed
-    get reactTable() {
-        const children = this.childDocs;
-        const hasCollectionChild = children.reduce((found, doc) => found || doc.type === DocumentType.COL, false);
-        const expanded: { [name: string]: any } = {};
-        Array.from(this._openCollections.keys()).map(col => expanded[col.toString()] = true);
-        const rerender = [...this.textWrappedRows]; // TODO: get component to rerender on text wrap change without needign to console.log :((((
-
-        return <ReactTable
-            style={{ position: "relative" }}
-            data={children}
-            page={0}
-            pageSize={children.length}
-            showPagination={false}
-            columns={this.tableColumns}
-            getTrProps={this.getTrProps}
-            getTdProps={this.getTdProps}
-            sortable={false}
-            TrComponent={MovableRow}
-            sorted={this.sorted}
-            expanded={expanded}
-            resized={this.resized}
-            onResizedChange={this.props.onResizedChange}
-            // if it has a child, render another table with the children
-            SubComponent={!hasCollectionChild ? undefined : row => (row.original.type !== DocumentType.COL) ? (null) :
-                <div style={{ paddingLeft: 57 + "px" }} className="reactTable-sub"><SchemaTable {...this.props} Document={row.original} dataDoc={undefined} childDocs={undefined} /></div>}
-
-        />;
-    }
-
-    onContextMenu = (e: React.MouseEvent): void => {
-        ContextMenu.Instance.addItem({ description: "Toggle text wrapping", event: this.toggleTextwrap, icon: "table" });
-    }
-
-    getField = (row: number, col?: number) => {
-        const docs = this.childDocs;
-
-        row = row % docs.length;
-        while (row < 0) row += docs.length;
-        const columns = this.props.columns;
-        const doc = docs[row];
-        if (col === undefined) {
-            return doc;
-        }
-        if (col >= 0 && col < columns.length) {
-            const column = this.props.columns[col].heading;
-            return doc[column];
-        }
-        return undefined;
-    }
-
-    createTransformer = (row: number, col: number): Transformer => {
-        const self = this;
-        const captures: { [name: string]: Field } = {};
-
-        const transformer: ts.TransformerFactory<ts.SourceFile> = context => {
-            return root => {
-                function visit(node: ts.Node) {
-                    node = ts.visitEachChild(node, visit, context);
-                    if (ts.isIdentifier(node)) {
-                        const isntPropAccess = !ts.isPropertyAccessExpression(node.parent) || node.parent.expression === node;
-                        const isntPropAssign = !ts.isPropertyAssignment(node.parent) || node.parent.name !== node;
-                        if (isntPropAccess && isntPropAssign) {
-                            if (node.text === "$r") {
-                                return ts.createNumericLiteral(row.toString());
-                            } else if (node.text === "$c") {
-                                return ts.createNumericLiteral(col.toString());
-                            } else if (node.text === "$") {
-                                if (ts.isCallExpression(node.parent)) {
-                                    // captures.doc = self.props.Document;
-                                    // captures.key = self.props.fieldKey;
-                                }
-                            }
-                        }
-                    }
-
-                    return node;
-                }
-                return ts.visitNode(root, visit);
-            };
-        };
-
-        // const getVars = () => {
-        //     return { capturedVariables: captures };
-        // };
-
-        return { transformer, /*getVars*/ };
-    }
-
-    setComputed = (script: string, doc: Doc, field: string, row: number, col: number): boolean => {
-        script =
-            `const $ = (row:number, col?:number) => {
-                const rval = (doc as any)[key][row + ${row}];
-                return col === undefined ? rval : rval[(doc as any)._schemaHeaders[col + ${col}].heading];
-            }
-            return ${script}`;
-        const compiled = CompileScript(script, { params: { this: Doc.name }, capturedVariables: { doc: this.props.Document, key: this.props.fieldKey }, typecheck: false, transformer: this.createTransformer(row, col) });
-        if (compiled.compiled) {
-            doc[field] = new ComputedField(compiled);
-            return true;
-        }
-        return false;
-    }
-
-    @action
-    showDoc = (doc: Doc | undefined, dataDoc?: Doc, screenX?: number, screenY?: number) => {
-        this._showDoc = doc;
-        if (dataDoc && screenX && screenY) {
-            this._showDocPos = this.props.ScreenToLocalTransform().transformPoint(screenX, screenY);
-        }
-    }
-
-    onOpenClick = () => {
-        this._showDoc && this.props.addDocTab(this._showDoc, "add:right");
-    }
-
-    getPreviewTransform = (): Transform => {
-        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - 4 - this.tableWidth, - this.borderWidth);
-    }
-
-    render() {
-        const preview = "";
-        return <div className="collectionSchemaView-table"
-            onPointerDown={this.props.onPointerDown} onClick={this.props.onClick} onWheel={e => this.props.active(true) && e.stopPropagation()}
-            onDrop={e => this.props.onDrop(e, {})} onContextMenu={this.onContextMenu} >
-            {this.reactTable}
-            {this.props.Document._chromeHidden ? undefined : <div className="collectionSchemaView-addRow" onClick={this.createRow}>+ new</div>}
-            {!this._showDoc ? (null) :
-                <div className="collectionSchemaView-documentPreview" ref="overlay"
-                    style={{
-                        position: "absolute", width: 150, height: 150,
-                        background: "dimGray", display: "block", top: 0, left: 0,
-                        transform: `translate(${this._showDocPos[0]}px, ${this._showDocPos[1] - 180}px)`
-                    }} >
-                    <DocumentView
-                        Document={this._showDoc}
-                        DataDoc={this._showDataDoc}
-                        styleProvider={DefaultStyleProvider}
-                        layerProvider={undefined}
-                        docViewPath={returnEmptyDoclist}
-                        freezeDimensions={true}
-                        focus={DocUtils.DefaultFocus}
-                        renderDepth={this.props.renderDepth}
-                        rootSelected={returnFalse}
-                        isContentActive={returnTrue}
-                        isDocumentActive={returnFalse}
-                        PanelWidth={() => 150}
-                        PanelHeight={() => 150}
-                        ScreenToLocalTransform={this.getPreviewTransform}
-                        docFilters={returnEmptyFilter}
-                        docRangeFilters={returnEmptyFilter}
-                        searchFilterDocs={returnEmptyDoclist}
-                        ContainingCollectionDoc={this.props.CollectionView?.props.Document}
-                        ContainingCollectionView={this.props.CollectionView}
-                        moveDocument={this.props.moveDocument}
-                        whenChildContentsActiveChanged={emptyFunction}
-                        addDocTab={this.props.addDocTab}
-                        pinToPres={this.props.pinToPres}
-                        bringToFront={returnFalse}>
-                    </DocumentView>
-                </div>}
-        </div>;
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx
index ecf4c0901..f0a54e4ac 100644
--- a/src/client/views/nodes/DocumentContentsView.tsx
+++ b/src/client/views/nodes/DocumentContentsView.tsx
@@ -8,7 +8,7 @@ import { emptyPath, OmitKeys, Without } from "../../../Utils";
 import { DirectoryImportBox } from "../../util/Import & Export/DirectoryImportBox";
 import { CollectionDockingView } from "../collections/CollectionDockingView";
 import { CollectionFreeFormView } from "../collections/collectionFreeForm/CollectionFreeFormView";
-import { CollectionSchemaView } from "../collections/schemaView/CollectionSchemaView";
+import { CollectionSchemaView } from "../collections/CollectionSchemaView";
 import { CollectionView } from "../collections/CollectionView";
 import { InkingStroke } from "../InkingStroke";
 import { PresElementBox } from "../presentationview/PresElementBox";
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index a671c955d..5c168d8a9 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -18,7 +18,7 @@ import { SetupDrag } from '../../util/DragManager';
 import { SearchUtil } from '../../util/SearchUtil';
 import { Transform } from '../../util/Transform';
 import { CollectionDockingView } from "../collections/CollectionDockingView";
-import { CollectionSchemaView, ColumnType } from "../collections/schemaView/CollectionSchemaView";
+import { CollectionSchemaView, ColumnType } from "../collections/CollectionSchemaView";
 import { CollectionViewType } from '../collections/CollectionView';
 import { ViewBoxBaseComponent } from "../DocComponent";
 import { FieldView, FieldViewProps } from '../nodes/FieldView';
@@ -119,7 +119,7 @@ export class SearchBox extends ViewBoxBaseComponent<FieldViewProps, SearchBoxDoc
 
     getFinalQuery(query: string): string {
         //alters the query so it looks in the correct fields
-        //if this is true, then not all of the field boxes are checked
+        //if this is true, th`en not all of the field boxes are checked
         //TODO: data
         const initialfilters = Cast(this.props.Document._docFilters, listSpec("string"), []);
 
diff --git a/src/fields/SchemaHeaderField.ts b/src/fields/SchemaHeaderField.ts
index 74cf934f2..88de3a19f 100644
--- a/src/fields/SchemaHeaderField.ts
+++ b/src/fields/SchemaHeaderField.ts
@@ -3,7 +3,7 @@ import { serializable, primitive } from "serializr";
 import { ObjectField } from "./ObjectField";
 import { Copy, ToScriptString, ToString, OnUpdate } from "./FieldSymbols";
 import { scriptingGlobal } from "../client/util/Scripting";
-import { ColumnType } from "../client/views/collections/schemaView/CollectionSchemaView";
+import { ColumnType } from "../client/views/collections/CollectionSchemaView";
 
 export const PastelSchemaPalette = new Map<string, string>([
     // ["pink1", "#FFB4E8"],
-- 
cgit v1.2.3-70-g09d2


From e48f447f66f7f50f39be385e0eb09df552f5f503 Mon Sep 17 00:00:00 2001
From: geireann <geireann_lindfield_roberts@brown.edu>
Date: Mon, 12 Jul 2021 13:54:23 -0400
Subject: Changed "schemaView" :arrow_right: "collectionSchema"

So style is consistent with other folders
---
 src/client/util/SelectionManager.ts                |   2 +-
 .../views/collections/CollectionSchemaView.tsx     | 575 ++++++++++++++++++++
 src/client/views/collections/CollectionView.tsx    |   2 +-
 .../collectionSchema/CollectionSchemaCells.tsx     | 585 ++++++++++++++++++++
 .../collectionSchema/CollectionSchemaHeaders.tsx   | 518 ++++++++++++++++++
 .../CollectionSchemaMovableColumn.tsx              | 128 +++++
 .../CollectionSchemaMovableRow.tsx                 | 147 +++++
 .../collectionSchema/CollectionSchemaView.scss     | 552 +++++++++++++++++++
 .../collectionSchema/CollectionSchemaView.tsx      | 575 ++++++++++++++++++++
 .../collections/collectionSchema/SchemaTable.tsx   | 601 +++++++++++++++++++++
 .../schemaView/CollectionSchemaCells.tsx           | 585 --------------------
 .../schemaView/CollectionSchemaHeaders.tsx         | 518 ------------------
 .../schemaView/CollectionSchemaMovableColumn.tsx   | 128 -----
 .../schemaView/CollectionSchemaMovableRow.tsx      | 147 -----
 .../schemaView/CollectionSchemaView.scss           | 552 -------------------
 .../schemaView/CollectionSchemaView.tsx            | 575 --------------------
 .../views/collections/schemaView/SchemaTable.tsx   | 601 ---------------------
 src/client/views/nodes/DocumentContentsView.tsx    |   2 +-
 src/client/views/search/SearchBox.tsx              |   8 +-
 src/fields/SchemaHeaderField.ts                    |   2 +-
 20 files changed, 3689 insertions(+), 3114 deletions(-)
 create mode 100644 src/client/views/collections/CollectionSchemaView.tsx
 create mode 100644 src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx
 create mode 100644 src/client/views/collections/collectionSchema/CollectionSchemaHeaders.tsx
 create mode 100644 src/client/views/collections/collectionSchema/CollectionSchemaMovableColumn.tsx
 create mode 100644 src/client/views/collections/collectionSchema/CollectionSchemaMovableRow.tsx
 create mode 100644 src/client/views/collections/collectionSchema/CollectionSchemaView.scss
 create mode 100644 src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
 create mode 100644 src/client/views/collections/collectionSchema/SchemaTable.tsx
 delete mode 100644 src/client/views/collections/schemaView/CollectionSchemaCells.tsx
 delete mode 100644 src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
 delete mode 100644 src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
 delete mode 100644 src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx
 delete mode 100644 src/client/views/collections/schemaView/CollectionSchemaView.scss
 delete mode 100644 src/client/views/collections/schemaView/CollectionSchemaView.tsx
 delete mode 100644 src/client/views/collections/schemaView/SchemaTable.tsx

(limited to 'src')

diff --git a/src/client/util/SelectionManager.ts b/src/client/util/SelectionManager.ts
index a624d5b7c..00f0894c7 100644
--- a/src/client/util/SelectionManager.ts
+++ b/src/client/util/SelectionManager.ts
@@ -1,7 +1,7 @@
 import { action, observable, ObservableMap } from "mobx";
 import { computedFn } from "mobx-utils";
 import { Doc, Opt } from "../../fields/Doc";
-import { CollectionSchemaView } from "../views/collections/schemaView/CollectionSchemaView";
+import { CollectionSchemaView } from "../views/collections/collectionSchema/CollectionSchemaView";
 import { CollectionViewType } from "../views/collections/CollectionView";
 import { DocumentView } from "../views/nodes/DocumentView";
 
diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx
new file mode 100644
index 000000000..8f2847139
--- /dev/null
+++ b/src/client/views/collections/CollectionSchemaView.tsx
@@ -0,0 +1,575 @@
+import React = require("react");
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { action, computed, observable, untracked } from "mobx";
+import { observer } from "mobx-react";
+import Measure from "react-measure";
+import { Resize } from "react-table";
+import "react-table/react-table.css";
+import { Doc, Opt } from "../../../fields/Doc";
+import { List } from "../../../fields/List";
+import { listSpec } from "../../../fields/Schema";
+import { PastelSchemaPalette, SchemaHeaderField } from "../../../fields/SchemaHeaderField";
+import { Cast, NumCast } from "../../../fields/Types";
+import { TraceMobx } from "../../../fields/util";
+import { emptyFunction, emptyPath, returnFalse, setupMoveUpEvents, returnEmptyDoclist, returnTrue } from "../../../Utils";
+import { SelectionManager } from "../../util/SelectionManager";
+import { SnappingManager } from "../../util/SnappingManager";
+import { Transform } from "../../util/Transform";
+import { undoBatch } from "../../util/UndoManager";
+import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../views/globalCssVariables.scss';
+import { ContextMenu } from "../ContextMenu";
+import { ContextMenuProps } from "../ContextMenuItem";
+import '../DocumentDecorations.scss';
+import { DocumentView } from "../nodes/DocumentView";
+import { DefaultStyleProvider } from "../StyleProvider";
+import "./CollectionSchemaView.scss";
+import { CollectionSubView } from "./CollectionSubView";
+import { SchemaTable } from "./SchemaTable";
+import { DocUtils } from "../../documents/Documents";
+// bcz: need to add drag and drop of rows and columns.  This seems like it might work for rows: https://codesandbox.io/s/l94mn1q657
+
+export enum ColumnType {
+    Any,
+    Number,
+    String,
+    Boolean,
+    Doc,
+    Image,
+    List,
+    Date
+}
+// this map should be used for keys that should have a const type of value
+const columnTypes: Map<string, ColumnType> = new Map([
+    ["title", ColumnType.String],
+    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
+    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
+    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
+]);
+
+@observer
+export class CollectionSchemaView extends CollectionSubView(doc => doc) {
+    private _previewCont?: HTMLDivElement;
+
+    @observable _previewDoc: Doc | undefined = undefined;
+    @observable _focusedTable: Doc = this.props.Document;
+    @observable _col: any = "";
+    @observable _menuWidth = 0;
+    @observable _headerOpen = false;
+    @observable _headerIsEditing = false;
+    @observable _menuHeight = 0;
+    @observable _pointerX = 0;
+    @observable _pointerY = 0;
+    @observable _openTypes: boolean = false;
+
+    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
+    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
+    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
+    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
+    @computed get scale() { return this.props.ScreenToLocalTransform().Scale; }
+    @computed get columns() { return Cast(this.props.Document._schemaHeaders, listSpec(SchemaHeaderField), []); }
+    set columns(columns: SchemaHeaderField[]) { this.props.Document._schemaHeaders = new List<SchemaHeaderField>(columns); }
+
+    @computed get menuCoordinates() {
+        let searchx = 0;
+        let searchy = 0;
+        if (this.props.Document._searchDoc) {
+            const el = document.getElementsByClassName("collectionSchemaView-searchContainer")[0];
+            if (el !== undefined) {
+                const rect = el.getBoundingClientRect();
+                searchx = rect.x;
+                searchy = rect.y;
+            }
+        }
+        const x = Math.max(0, Math.min(document.body.clientWidth - this._menuWidth, this._pointerX)) - searchx;
+        const y = Math.max(0, Math.min(document.body.clientHeight - this._menuHeight, this._pointerY)) - searchy;
+        return this.props.ScreenToLocalTransform().transformPoint(x, y);
+    }
+
+    get documentKeys() {
+        const docs = this.childDocs;
+        const keys: { [key: string]: boolean } = {};
+        // bcz: ugh.  this is untracked since otherwise a large collection of documents will blast the server for all their fields.
+        //  then as each document's fields come back, we update the documents _proxies.  Each time we do this, the whole schema will be
+        //  invalidated and re-rendered.   This workaround will inquire all of the document fields before the options button is clicked.
+        //  then by the time the options button is clicked, all of the fields should be in place.  If a new field is added while this menu
+        //  is displayed (unlikely) it won't show up until something else changes.
+        //TODO Types
+        untracked(() => docs.map(doc => Doc.GetAllPrototypes(doc).map(proto => Object.keys(proto).forEach(key => keys[key] = false))));
+
+        this.columns.forEach(key => keys[key.heading] = true);
+        return Array.from(Object.keys(keys));
+    }
+
+    @action setHeaderIsEditing = (isEditing: boolean) => this._headerIsEditing = isEditing;
+
+    @undoBatch
+    setColumnType = action((columnField: SchemaHeaderField, type: ColumnType): void => {
+        this._openTypes = false;
+        if (columnTypes.get(columnField.heading)) return;
+
+        const columns = this.columns;
+        const index = columns.indexOf(columnField);
+        if (index > -1) {
+            columnField.setType(NumCast(type));
+            columns[index] = columnField;
+            this.columns = columns;
+        }
+    });
+
+    @undoBatch
+    setColumnColor = (columnField: SchemaHeaderField, color: string): void => {
+        const columns = this.columns;
+        const index = columns.indexOf(columnField);
+        if (index > -1) {
+            columnField.setColor(color);
+            columns[index] = columnField;
+            this.columns = columns; // need to set the columns to trigger rerender
+        }
+    }
+
+    @undoBatch
+    @action
+    setColumnSort = (columnField: SchemaHeaderField, descending: boolean | undefined) => {
+        const columns = this.columns;
+        columns.forEach(col => col.setDesc(undefined));
+
+        const index = columns.findIndex(c => c.heading === columnField.heading);
+        const column = columns[index];
+        column.setDesc(descending);
+        columns[index] = column;
+        this.columns = columns;
+    }
+
+    renderTypes = (col: any) => {
+        if (columnTypes.get(col.heading)) return (null);
+
+        const type = col.type;
+
+        const anyType = <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Any)}>
+            <FontAwesomeIcon icon={"align-justify"} size="sm" />
+            Any
+        </div>;
+
+        const numType = <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Number)}>
+            <FontAwesomeIcon icon={"hashtag"} size="sm" />
+            Number
+        </div>;
+
+        const textType = <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.String)}>
+            <FontAwesomeIcon icon={"font"} size="sm" />
+            Text
+        </div>;
+
+        const boolType = <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Boolean)}>
+            <FontAwesomeIcon icon={"check-square"} size="sm" />
+            Checkbox
+        </div>;
+
+        const listType = <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.List)}>
+            <FontAwesomeIcon icon={"list-ul"} size="sm" />
+            List
+        </div>;
+
+        const docType = <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Doc)}>
+            <FontAwesomeIcon icon={"file"} size="sm" />
+            Document
+        </div>;
+
+        const imageType = <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Image)}>
+            <FontAwesomeIcon icon={"image"} size="sm" />
+            Image
+        </div>;
+
+        const dateType = <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Date)}>
+            <FontAwesomeIcon icon={"calendar"} size="sm" />
+            Date
+        </div>;
+
+
+        const allColumnTypes = <div className="columnMenu-types">
+            {anyType}
+            {numType}
+            {textType}
+            {boolType}
+            {listType}
+            {docType}
+            {imageType}
+            {dateType}
+        </div>;
+
+        const justColType = type === ColumnType.Any ? anyType : type === ColumnType.Number ? numType :
+            type === ColumnType.String ? textType : type === ColumnType.Boolean ? boolType :
+                type === ColumnType.List ? listType : type === ColumnType.Doc ? docType :
+                    type === ColumnType.Date ? dateType : imageType;
+
+        return (
+            <div className="collectionSchema-headerMenu-group" onClick={action(() => this._openTypes = !this._openTypes)}>
+                <div>
+                    <label style={{ cursor: "pointer" }}>Column type:</label>
+                    <FontAwesomeIcon icon={"caret-down"} size="lg" style={{ float: "right", transform: `rotate(${this._openTypes ? "180deg" : 0})`, transition: "0.2s all ease" }} />
+                </div>
+                {this._openTypes ? allColumnTypes : justColType}
+            </div >
+        );
+    }
+
+    renderSorting = (col: any) => {
+        const sort = col.desc;
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Sort by:</label>
+                <div className="columnMenu-sort">
+                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.setColumnSort(col, true)}>
+                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
+                        Sort descending
+                    </div>
+                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.setColumnSort(col, false)}>
+                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
+                        Sort ascending
+                    </div>
+                    <div className="columnMenu-option" onClick={() => this.setColumnSort(col, undefined)}>
+                        <FontAwesomeIcon icon="times" size="sm" />
+                        Clear sorting
+                    </div>
+                </div>
+            </div>
+        );
+    }
+
+    renderColors = (col: any) => {
+        const selected = col.color;
+
+        const pink = PastelSchemaPalette.get("pink2");
+        const purple = PastelSchemaPalette.get("purple2");
+        const blue = PastelSchemaPalette.get("bluegreen1");
+        const yellow = PastelSchemaPalette.get("yellow4");
+        const red = PastelSchemaPalette.get("red2");
+        const gray = "#f1efeb";
+
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Color:</label>
+                <div className="columnMenu-colors">
+                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.setColumnColor(col, pink!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.setColumnColor(col, purple!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.setColumnColor(col, blue!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.setColumnColor(col, yellow!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.setColumnColor(col, red!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.setColumnColor(col, gray)}></div>
+                </div>
+            </div>
+        );
+    }
+
+    @undoBatch
+    @action
+    changeColumns = (oldKey: string, newKey: string, addNew: boolean, filter?: string) => {
+        const columns = this.columns;
+        if (columns === undefined) {
+            this.columns = new List<SchemaHeaderField>([new SchemaHeaderField(newKey, "f1efeb")]);
+        } else {
+            if (addNew) {
+                columns.push(new SchemaHeaderField(newKey, "f1efeb"));
+                this.columns = columns;
+            } else {
+                const index = columns.map(c => c.heading).indexOf(oldKey);
+                if (index > -1) {
+                    const column = columns[index];
+                    column.setHeading(newKey);
+                    columns[index] = column;
+                    this.columns = columns;
+                    if (filter) {
+                        Doc.setDocFilter(this.props.Document, newKey, filter, "match");
+                    }
+                    else {
+                        this.props.Document._docFilters = undefined;
+                    }
+                }
+            }
+        }
+    }
+
+    @action
+    openHeader = (col: any, screenx: number, screeny: number) => {
+        this._col = col;
+        this._headerOpen = true;
+        this._pointerX = screenx;
+        this._pointerY = screeny;
+    }
+
+    @action
+    closeHeader = () => { this._headerOpen = false; }
+
+    @undoBatch
+    @action
+    deleteColumn = (key: string) => {
+        const columns = this.columns;
+        if (columns === undefined) {
+            this.columns = new List<SchemaHeaderField>([]);
+        } else {
+            const index = columns.map(c => c.heading).indexOf(key);
+            if (index > -1) {
+                columns.splice(index, 1);
+                this.columns = columns;
+            }
+        }
+        this.closeHeader();
+    }
+
+    getPreviewTransform = (): Transform => {
+        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - NumCast(COLLECTION_BORDER_WIDTH) - this.tableWidth, - this.borderWidth);
+    }
+
+    @action
+    onHeaderClick = (e: React.PointerEvent) => {
+        e.stopPropagation();
+    }
+
+    @action
+    onWheel(e: React.WheelEvent) {
+        const scale = this.props.ScreenToLocalTransform().Scale;
+        this.props.isContentActive(true) && e.stopPropagation();
+    }
+
+    @computed get renderMenuContent() {
+        TraceMobx();
+        return <div className="collectionSchema-header-menuOptions">
+            {this.renderTypes(this._col)}
+            {this.renderColors(this._col)}
+            <div className="collectionSchema-headerMenu-group">
+                <button onClick={() => { this.deleteColumn(this._col.heading); }}
+                >Delete Column</button>
+            </div>
+        </div>;
+    }
+
+    private createTarget = (ele: HTMLDivElement) => {
+        this._previewCont = ele;
+        super.CreateDropTarget(ele);
+    }
+
+    isFocused = (doc: Doc, outsideReaction: boolean): boolean => this.props.isSelected(outsideReaction) && doc === this._focusedTable;
+
+    @action setFocused = (doc: Doc) => this._focusedTable = doc;
+
+    @action setPreviewDoc = (doc: Opt<Doc>) => {
+        SelectionManager.SelectSchemaView(this, doc);
+        this._previewDoc = doc;
+    }
+
+    //toggles preview side-panel of schema
+    @action
+    toggleExpander = () => {
+        this.props.Document.schemaPreviewWidth = this.previewWidth() === 0 ? Math.min(this.tableWidth / 3, 200) : 0;
+    }
+
+    onDividerDown = (e: React.PointerEvent) => {
+        setupMoveUpEvents(this, e, this.onDividerMove, emptyFunction, this.toggleExpander);
+    }
+    @action
+    onDividerMove = (e: PointerEvent, down: number[], delta: number[]) => {
+        const nativeWidth = this._previewCont!.getBoundingClientRect();
+        const minWidth = 40;
+        const maxWidth = 1000;
+        const movedWidth = this.props.ScreenToLocalTransform().transformDirection(nativeWidth.right - e.clientX, 0)[0];
+        const width = movedWidth < minWidth ? minWidth : movedWidth > maxWidth ? maxWidth : movedWidth;
+        this.props.Document.schemaPreviewWidth = width;
+        return false;
+    }
+
+    onPointerDown = (e: React.PointerEvent): void => {
+        if (e.button === 0 && !e.altKey && !e.ctrlKey && !e.metaKey) {
+            if (this.props.isSelected(true)) e.stopPropagation();
+            else this.props.select(false);
+        }
+    }
+
+    @computed
+    get previewDocument(): Doc | undefined { return this._previewDoc; }
+
+    @computed
+    get dividerDragger() {
+        return this.previewWidth() === 0 ? (null) :
+            <div className="collectionSchemaView-dividerDragger" onPointerDown={this.onDividerDown} >
+                <div className="collectionSchemaView-dividerDragger" />
+            </div>;
+    }
+
+    @computed
+    get previewPanel() {
+        return <div ref={this.createTarget} style={{ width: `${this.previewWidth()}px` }}>
+            {!this.previewDocument ? (null) :
+                <DocumentView
+                    Document={this.previewDocument}
+                    DataDoc={undefined}
+                    fitContentsToDoc={returnTrue}
+                    freezeDimensions={true}
+                    dontCenter={"y"}
+                    focus={DocUtils.DefaultFocus}
+                    renderDepth={this.props.renderDepth}
+                    rootSelected={this.rootSelected}
+                    PanelWidth={this.previewWidth}
+                    PanelHeight={this.previewHeight}
+                    isContentActive={returnTrue}
+                    isDocumentActive={returnFalse}
+                    ScreenToLocalTransform={this.getPreviewTransform}
+                    docFilters={this.docFilters}
+                    docRangeFilters={this.docRangeFilters}
+                    searchFilterDocs={this.searchFilterDocs}
+                    styleProvider={DefaultStyleProvider}
+                    layerProvider={undefined}
+                    docViewPath={returnEmptyDoclist}
+                    ContainingCollectionDoc={this.props.CollectionView?.props.Document}
+                    ContainingCollectionView={this.props.CollectionView}
+                    moveDocument={this.props.moveDocument}
+                    addDocument={this.props.addDocument}
+                    removeDocument={this.props.removeDocument}
+                    whenChildContentsActiveChanged={this.props.whenChildContentsActiveChanged}
+                    addDocTab={this.props.addDocTab}
+                    pinToPres={this.props.pinToPres}
+                    bringToFront={returnFalse}
+                />}
+        </div>;
+    }
+
+    @computed
+    get schemaTable() {
+        return <SchemaTable
+            Document={this.props.Document}
+            PanelHeight={this.props.PanelHeight}
+            PanelWidth={this.props.PanelWidth}
+            childDocs={this.childDocs}
+            CollectionView={this.props.CollectionView}
+            ContainingCollectionView={this.props.ContainingCollectionView}
+            ContainingCollectionDoc={this.props.ContainingCollectionDoc}
+            fieldKey={this.props.fieldKey}
+            renderDepth={this.props.renderDepth}
+            moveDocument={this.props.moveDocument}
+            ScreenToLocalTransform={this.props.ScreenToLocalTransform}
+            active={this.props.isContentActive}
+            onDrop={this.onExternalDrop}
+            addDocTab={this.props.addDocTab}
+            pinToPres={this.props.pinToPres}
+            isSelected={this.props.isSelected}
+            isFocused={this.isFocused}
+            setFocused={this.setFocused}
+            setPreviewDoc={this.setPreviewDoc}
+            deleteDocument={this.props.removeDocument}
+            addDocument={this.props.addDocument}
+            dataDoc={this.props.DataDoc}
+            columns={this.columns}
+            documentKeys={this.documentKeys}
+            headerIsEditing={this._headerIsEditing}
+            openHeader={this.openHeader}
+            onClick={this.onTableClick}
+            onPointerDown={emptyFunction}
+            onResizedChange={this.onResizedChange}
+            setColumns={this.setColumns}
+            reorderColumns={this.reorderColumns}
+            changeColumns={this.changeColumns}
+            setHeaderIsEditing={this.setHeaderIsEditing}
+            changeColumnSort={this.setColumnSort}
+        />;
+    }
+
+    @computed
+    public get schemaToolbar() {
+        return <div className="collectionSchemaView-toolbar">
+            <div className="collectionSchemaView-toolbar-item">
+                <div id="preview-schema-checkbox-div">
+                    <input type="checkbox" key={"Show Preview"} checked={this.previewWidth() !== 0} onChange={this.toggleExpander} />
+                    Show Preview
+                </div>
+            </div>
+        </div>;
+    }
+
+    onSpecificMenu = (e: React.MouseEvent) => {
+        if ((e.target as any)?.className?.includes?.("collectionSchemaView-cell") || (e.target instanceof HTMLSpanElement)) {
+            const cm = ContextMenu.Instance;
+            const options = cm.findByDescription("Options...");
+            const optionItems: ContextMenuProps[] = options && "subitems" in options ? options.subitems : [];
+            optionItems.push({ description: "remove", event: () => this._previewDoc && this.props.removeDocument?.(this._previewDoc), icon: "trash" });
+            !options && cm.addItem({ description: "Options...", subitems: optionItems, icon: "compass" });
+            cm.displayMenu(e.clientX, e.clientY);
+            (e.nativeEvent as any).SchemaHandled = true; // not sure why this is needed, but if you right-click quickly on a cell, the Document/Collection contextMenu handlers still fire without this.
+            e.stopPropagation();
+        }
+    }
+
+    @action
+    onTableClick = (e: React.MouseEvent): void => {
+        if (!(e.target as any)?.className?.includes?.("collectionSchemaView-cell") && !(e.target instanceof HTMLSpanElement)) {
+            this.setPreviewDoc(undefined);
+        } else {
+            e.stopPropagation();
+        }
+        this.setFocused(this.props.Document);
+        this.closeHeader();
+    }
+
+    onResizedChange = (newResized: Resize[], event: any) => {
+        const columns = this.columns;
+        newResized.forEach(resized => {
+            const index = columns.findIndex(c => c.heading === resized.id);
+            const column = columns[index];
+            column.setWidth(resized.value);
+            columns[index] = column;
+        });
+        this.columns = columns;
+    }
+
+    @action
+    setColumns = (columns: SchemaHeaderField[]) => this.columns = columns
+
+    @undoBatch
+    reorderColumns = (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => {
+        const columns = [...columnsValues];
+        const oldIndex = columns.indexOf(toMove);
+        const relIndex = columns.indexOf(relativeTo);
+        const newIndex = (oldIndex > relIndex && !before) ? relIndex + 1 : (oldIndex < relIndex && before) ? relIndex - 1 : relIndex;
+
+        if (oldIndex === newIndex) return;
+
+        columns.splice(newIndex, 0, columns.splice(oldIndex, 1)[0]);
+        this.columns = columns;
+    }
+
+    onZoomMenu = (e: React.WheelEvent) => this.props.isContentActive(true) && e.stopPropagation();
+
+    render() {
+        TraceMobx();
+        if (!this.props.isContentActive()) setTimeout(() => this.closeHeader(), 0);
+        const menuContent = this.renderMenuContent;
+        const menu = <div className="collectionSchema-header-menu"
+            onWheel={e => this.onZoomMenu(e)}
+            onPointerDown={e => this.onHeaderClick(e)}
+            style={{ transform: `translate(${(this.menuCoordinates[0])}px, ${(this.menuCoordinates[1])}px)` }}>
+            <Measure offset onResize={action((r: any) => {
+                const dim = this.props.ScreenToLocalTransform().inverse().transformDirection(r.offset.width, r.offset.height);
+                this._menuWidth = dim[0]; this._menuHeight = dim[1];
+            })}>
+                {({ measureRef }) => <div ref={measureRef}> {menuContent} </div>}
+            </Measure>
+        </div>;
+        return <div className={"collectionSchemaView" + (this.props.Document._searchDoc ? "-searchContainer" : "-container")}
+            style={{
+                overflow: this.props.scrollOverflow === true ? "scroll" : undefined, backgroundColor: "white",
+                pointerEvents: this.props.Document._searchDoc !== undefined && !this.props.isContentActive() && !SnappingManager.GetIsDragging() ? "none" : undefined,
+                width: name === "collectionSchemaView-searchContainer" ? "auto" : this.props.PanelWidth() || "100%", height: this.props.PanelHeight() || "100%", position: "relative",
+            }}  >
+            <div className="collectionSchemaView-tableContainer"
+                style={{ width: `calc(100% - ${this.previewWidth()}px)` }}
+                onContextMenu={this.onSpecificMenu}
+                onPointerDown={this.onPointerDown}
+                onWheel={e => this.props.isContentActive(true) && e.stopPropagation()}
+                onDrop={e => this.onExternalDrop(e, {})}
+                ref={this.createTarget}>
+                {this.schemaTable}
+            </div>
+            {this.dividerDragger}
+            {!this.previewWidth() ? (null) : this.previewPanel}
+            {this._headerOpen && this.props.isContentActive() ? menu : null}
+        </div>;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx
index e5b1721f9..e225c4a11 100644
--- a/src/client/views/collections/CollectionView.tsx
+++ b/src/client/views/collections/CollectionView.tsx
@@ -29,7 +29,7 @@ import CollectionMapView from './CollectionMapView';
 import { CollectionMulticolumnView } from './collectionMulticolumn/CollectionMulticolumnView';
 import { CollectionMultirowView } from './collectionMulticolumn/CollectionMultirowView';
 import { CollectionPileView } from './CollectionPileView';
-import { CollectionSchemaView } from "./schemaView/CollectionSchemaView";
+import { CollectionSchemaView } from "./collectionSchema/CollectionSchemaView";
 import { CollectionStackingView } from './CollectionStackingView';
 import { SubCollectionViewProps } from './CollectionSubView';
 import { CollectionTimeView } from './CollectionTimeView';
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx
new file mode 100644
index 000000000..f75179cea
--- /dev/null
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx
@@ -0,0 +1,585 @@
+import React = require("react");
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action, computed, observable } from "mobx";
+import { observer } from "mobx-react";
+import DatePicker from "react-datepicker";
+import "react-datepicker/dist/react-datepicker.css";
+import { CellInfo } from "react-table";
+import "react-table/react-table.css";
+import { DateField } from "../../../../fields/DateField";
+import { Doc, DocListCast, Field, Opt } from "../../../../fields/Doc";
+import { Id } from "../../../../fields/FieldSymbols";
+import { List } from "../../../../fields/List";
+import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { ComputedField } from "../../../../fields/ScriptField";
+import { BoolCast, Cast, DateCast, FieldValue, NumCast, StrCast } from "../../../../fields/Types";
+import { ImageField } from "../../../../fields/URLField";
+import { Utils, emptyFunction } from "../../../../Utils";
+import { Docs } from "../../../documents/Documents";
+import { DocumentType } from "../../../documents/DocumentTypes";
+import { DocumentManager } from "../../../util/DocumentManager";
+import { DragManager } from "../../../util/DragManager";
+import { KeyCodes } from "../../../util/KeyCodes";
+import { CompileScript } from "../../../util/Scripting";
+import { SearchUtil } from "../../../util/SearchUtil";
+import { SnappingManager } from "../../../util/SnappingManager";
+import { undoBatch } from "../../../util/UndoManager";
+import '../../../views/DocumentDecorations.scss';
+import { EditableView } from "../../EditableView";
+import { MAX_ROW_HEIGHT } from '../../globalCssVariables.scss';
+import { DocumentIconContainer } from "../../nodes/DocumentIcon";
+import { OverlayView } from "../../OverlayView";
+import "./CollectionSchemaView.scss";
+import { CollectionView } from "../CollectionView";
+const path = require('path');
+
+// intialize cell properties
+export interface CellProps {
+    row: number;
+    col: number;
+    rowProps: CellInfo;
+    CollectionView: Opt<CollectionView>;
+    ContainingCollection: Opt<CollectionView>;
+    Document: Doc;
+    fieldKey: string;
+    renderDepth: number;
+    addDocTab: (document: Doc, where: string) => boolean;
+    pinToPres: (document: Doc) => void;
+    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined,
+        addDocument: (document: Doc | Doc[]) => boolean) => boolean;
+    isFocused: boolean;
+    changeFocusedCellByIndex: (row: number, col: number) => void;
+    setIsEditing: (isEditing: boolean) => void;
+    isEditable: boolean;
+    setPreviewDoc: (doc: Doc) => void;
+    setComputed: (script: string, doc: Doc, field: string, row: number, col: number) => boolean;
+    getField: (row: number, col?: number) => void;
+    showDoc: (doc: Doc | undefined, dataDoc?: any, screenX?: number, screenY?: number) => void;
+}
+
+@observer
+export class CollectionSchemaCell extends React.Component<CellProps> {
+    public static resolvedFieldKey(column: string, rowDoc: Doc) {
+        const fieldKey = column;
+        if (fieldKey.startsWith("*")) {
+            const rootKey = fieldKey.substring(1);
+            const allKeys = [...Array.from(Object.keys(rowDoc)), ...Array.from(Object.keys(Doc.GetProto(rowDoc)))];
+            const matchedKeys = allKeys.filter(key => key.includes(rootKey));
+            if (matchedKeys.length) return matchedKeys[0];
+        }
+        return fieldKey;
+    }
+    @observable protected _isEditing: boolean = false;
+    protected _focusRef = React.createRef<HTMLDivElement>();
+    protected _rowDoc = this.props.rowProps.original;
+    protected _rowDataDoc = Doc.GetProto(this.props.rowProps.original);
+    protected _dropDisposer?: DragManager.DragDropDisposer;
+    @observable contents: string = "";
+
+    componentDidMount() { document.addEventListener("keydown", this.onKeyDown); }
+    componentWillUnmount() { document.removeEventListener("keydown", this.onKeyDown); }
+
+    @action
+    onKeyDown = (e: KeyboardEvent): void => {
+        if (this.props.isFocused && this.props.isEditable && e.keyCode === KeyCodes.ENTER) {
+            document.removeEventListener("keydown", this.onKeyDown);
+            this._isEditing = true;
+            this.props.setIsEditing(true);
+        }
+    }
+
+    @action
+    isEditingCallback = (isEditing: boolean): void => {
+        document.removeEventListener("keydown", this.onKeyDown);
+        isEditing && document.addEventListener("keydown", this.onKeyDown);
+        this._isEditing = isEditing;
+        this.props.setIsEditing(isEditing);
+        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
+    }
+
+    @action
+    onPointerDown = async (e: React.PointerEvent): Promise<void> => {
+        this.onItemDown(e);
+        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
+        this.props.setPreviewDoc(this.props.rowProps.original);
+
+        let url: string;
+        if (url = StrCast(this.props.rowProps.row.href)) {
+            try {
+                new URL(url);
+                const temp = window.open(url)!;
+                temp.blur();
+                window.focus();
+            } catch { }
+        }
+
+        const doc = Cast(this._rowDoc[this.renderFieldKey], Doc, null);
+        doc && this.props.setPreviewDoc(doc);
+    }
+
+    @undoBatch
+    applyToDoc = (doc: Doc, row: number, col: number, run: (args?: { [name: string]: any }) => any) => {
+        const res = run({ this: doc, $r: row, $c: col, $: (r: number = 0, c: number = 0) => this.props.getField(r + row, c + col) });
+        if (!res.success) return false;
+        doc[this.renderFieldKey] = res.result;
+        return true;
+    }
+
+    private drop = (e: Event, de: DragManager.DropEvent) => {
+        if (de.complete.docDragData) {
+            if (de.complete.docDragData.draggedDocuments.length === 1) {
+                this._rowDataDoc[this.renderFieldKey] = de.complete.docDragData.draggedDocuments[0];
+            }
+            else {
+                const coll = Docs.Create.SchemaDocument([new SchemaHeaderField("title", "#f1efeb")], de.complete.docDragData.draggedDocuments, {});
+                this._rowDataDoc[this.renderFieldKey] = coll;
+            }
+            e.stopPropagation();
+        }
+    }
+
+    protected dropRef = (ele: HTMLElement | null) => {
+        this._dropDisposer?.();
+        ele && (this._dropDisposer = DragManager.MakeDropTarget(ele, this.drop.bind(this)));
+    }
+
+    returnHighlights(contents: string, positions?: number[]) {
+        if (positions) {
+            const results = [];
+            StrCast(this.props.Document._searchString);
+            const length = StrCast(this.props.Document._searchString).length;
+            const color = contents ? "black" : "grey";
+
+            results.push(<span key="-1" style={{ color }}>{contents?.slice(0, positions[0])}</span>);
+            positions.forEach((num, cur) => {
+                results.push(<span key={"start" + cur} style={{ backgroundColor: "#FFFF00", color }}>{contents?.slice(num, num + length)}</span>);
+                let end = 0;
+                cur === positions.length - 1 ? end = contents.length : end = positions[cur + 1];
+                results.push(<span key={"end" + cur} style={{ color }}>{contents?.slice(num + length, end)}</span>);
+            }
+            );
+            return results;
+        }
+        return <span style={{ color: contents ? "black" : "grey" }}>{contents ? contents?.valueOf() : "undefined"}</span>;
+    }
+
+    @computed get renderFieldKey() { return CollectionSchemaCell.resolvedFieldKey(this.props.rowProps.column.id!, this.props.rowProps.original); }
+    onItemDown = async (e: React.PointerEvent) => {
+        if (this.props.Document._searchDoc) {
+            const aliasdoc = await SearchUtil.GetAliasesOfDocument(this._rowDataDoc);
+            const targetContext = aliasdoc.length <= 0 ? undefined : Cast(aliasdoc[0].context, Doc, null);
+            DocumentManager.Instance.jumpToDocument(this._rowDoc, false, emptyFunction, targetContext,
+                undefined, undefined, undefined, () => this.props.setPreviewDoc(this._rowDoc));
+        }
+    }
+    renderCellWithType(type: string | undefined) {
+        const dragRef: React.RefObject<HTMLDivElement> = React.createRef();
+
+        const fieldKey = this.renderFieldKey;
+        const field = this._rowDoc[fieldKey];
+
+        const onPointerEnter = (e: React.PointerEvent): void => {
+            if (e.buttons === 1 && SnappingManager.GetIsDragging() && (type === "document" || type === undefined)) {
+                dragRef.current!.className = "collectionSchemaView-cellContainer doc-drag-over";
+            }
+        };
+        const onPointerLeave = (e: React.PointerEvent): void => {
+            dragRef.current!.className = "collectionSchemaView-cellContainer";
+        };
+
+        let contents = Field.toString(field as Field);
+        contents = contents === "" ? "--" : contents;
+
+        let className = "collectionSchemaView-cellWrapper";
+        if (this._isEditing) className += " editing";
+        if (this.props.isFocused && this.props.isEditable) className += " focused";
+        if (this.props.isFocused && !this.props.isEditable) className += " inactive";
+
+        const positions = [];
+        if (StrCast(this.props.Document._searchString).toLowerCase() !== "") {
+            let term = (field instanceof Promise) ? "...promise pending..." : contents.toLowerCase();
+            const search = StrCast(this.props.Document._searchString).toLowerCase();
+            let start = term.indexOf(search);
+            let tally = 0;
+            if (start !== -1) {
+                positions.push(start);
+            }
+            while (start < contents?.length && start !== -1) {
+                term = term.slice(start + search.length + 1);
+                tally += start + search.length + 1;
+                start = term.indexOf(search);
+                positions.push(tally + start);
+            }
+            if (positions.length > 1) {
+                positions.pop();
+            }
+        }
+        const placeholder = type === "number" ? "0" : contents === "" ? "--" : "undefined";
+        return (
+            <div className="collectionSchemaView-cellContainer" style={{ cursor: field instanceof Doc ? "grab" : "auto" }}
+                ref={dragRef} onPointerDown={this.onPointerDown} onClick={action(e => this._isEditing = true)} onPointerEnter={onPointerEnter} onPointerLeave={onPointerLeave}>
+                <div className={className} ref={this._focusRef} tabIndex={-1}>
+                    <div className="collectionSchemaView-cellContents" ref={type === undefined || type === "document" ? this.dropRef : null}>
+                        {!this.props.Document._searchDoc ?
+                            <EditableView
+                                editing={this._isEditing}
+                                isEditingCallback={this.isEditingCallback}
+                                display={"inline"}
+                                contents={contents}
+                                height={"auto"}
+                                maxHeight={Number(MAX_ROW_HEIGHT)}
+                                placeholder={placeholder}
+                                GetValue={() => {
+                                    const cfield = ComputedField.WithoutComputed(() => FieldValue(field));
+                                    const cscript = cfield instanceof ComputedField ? cfield.script.originalScript : undefined;
+                                    const cfinalScript = cscript?.split("return")[cscript.split("return").length - 1];
+                                    return cscript ? (cfinalScript?.endsWith(";") ? `:=${cfinalScript?.substring(0, cfinalScript.length - 2)}` : cfinalScript) :
+                                        Field.IsField(cfield) ? Field.toScriptString(cfield) : "";
+                                }}
+                                SetValue={action((value: string) => {
+                                    // sets what is displayed after the user makes an input
+                                    let retVal = false;
+                                    if (value.startsWith(":=") || value.startsWith("=:=")) {
+                                        // decides how to compute a value when given either of the above strings
+                                        const script = value.substring(value.startsWith("=:=") ? 3 : 2);
+                                        retVal = this.props.setComputed(script, value.startsWith(":=") ? this._rowDataDoc : this._rowDoc, this.renderFieldKey, this.props.row, this.props.col);
+                                    } else {
+                                        // check if the input is a number
+                                        let inputIsNum = true;
+                                        for (let s of value) {
+                                            if (isNaN(parseInt(s)) && !(s == ".") && !(s == ",")) {
+                                                inputIsNum = false;
+                                            }
+                                        }
+                                        // check if the input is a boolean
+                                        let inputIsBool: boolean = value == "false" || value == "true";
+                                        // what to do in the case 
+                                        if (!inputIsNum && !inputIsBool && !value.startsWith("=")) {
+                                            // if it's not a number, it's a string, and should be processed as such
+                                            // strips the string of quotes when it is edited to prevent quotes form being added to the text automatically 
+                                            // after each edit
+                                            let valueSansQuotes = value;
+                                            if (this._isEditing) {
+                                                const vsqLength = valueSansQuotes.length;
+                                                // get rid of outer quotes
+                                                valueSansQuotes = valueSansQuotes.substring(value.startsWith("\"") ? 1 : 0,
+                                                    valueSansQuotes.charAt(vsqLength - 1) == "\"" ? vsqLength - 1 : vsqLength);
+                                            }
+                                            let inputAsString = '"';
+                                            // escape any quotes in the string
+                                            for (const i of valueSansQuotes) {
+                                                if (i == '"') {
+                                                    inputAsString += '\\"';
+                                                } else {
+                                                    inputAsString += i;
+                                                }
+                                            }
+                                            // add a closing quote
+                                            inputAsString += '"';
+                                            //two options here: we can strip off outer quotes or we can figure out what's going on with the script
+                                            const script = CompileScript(inputAsString, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                            const changeMade = inputAsString.length !== value.length || inputAsString.length - 2 !== value.length
+                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            // handle numbers and expressions
+                                        } else if (inputIsNum || value.startsWith("=")) {
+                                            //TODO: make accept numbers
+                                            const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
+                                            // if commas are not stripped, the parser only considers the numbers after the last comma
+                                            let inputSansCommas = "";
+                                            for (let s of inputscript) {
+                                                if (!(s == ",")) {
+                                                    inputSansCommas += s;
+                                                }
+                                            }
+                                            const script = CompileScript(inputSansCommas, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
+                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            // handle booleans
+                                        } else if (inputIsBool) {
+                                            const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
+                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                        }
+                                    }
+                                    if (retVal) {
+                                        this._isEditing = false; // need to set this here. otherwise, the assignment of the field will invalidate & cause render() to be called with the wrong value for 'editing'
+                                        this.props.setIsEditing(false);
+                                    }
+                                    return retVal;
+                                })}
+                                OnFillDown={async (value: string) => {
+                                    const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                    script.compiled && DocListCast(this.props.Document[this.props.fieldKey]).
+                                        forEach((doc, i) => value.startsWith(":=") ?
+                                            this.props.setComputed(value.substring(2), Doc.GetProto(doc), this.renderFieldKey, i, this.props.col) :
+                                            this.applyToDoc(Doc.GetProto(doc), i, this.props.col, script.run));
+                                }}
+                            />
+                            :
+                            this.returnHighlights(contents, positions)
+                        }
+                    </div >
+                </div>
+            </div>
+        );
+    }
+
+    render() { return this.renderCellWithType(undefined); }
+}
+
+@observer
+export class CollectionSchemaNumberCell extends CollectionSchemaCell { render() { return this.renderCellWithType("number"); } }
+
+@observer
+export class CollectionSchemaBooleanCell extends CollectionSchemaCell { render() { return this.renderCellWithType("boolean"); } }
+
+@observer
+export class CollectionSchemaStringCell extends CollectionSchemaCell { render() { return this.renderCellWithType("string"); } }
+
+@observer
+export class CollectionSchemaDateCell extends CollectionSchemaCell {
+    @computed get _date(): Opt<DateField> { return this._rowDoc[this.renderFieldKey] instanceof DateField ? DateCast(this._rowDoc[this.renderFieldKey]) : undefined; }
+
+    @action
+    handleChange = (date: any) => {
+        // const script = CompileScript(date.toString(), { requiredType: "Date", addReturn: true, params: { this: Doc.name } });
+        // if (script.compiled) {
+        //     this.applyToDoc(this._document, this.props.row, this.props.col, script.run);
+        // } else {
+        // ^ DateCast is always undefined for some reason, but that is what the field should be set to
+        this._rowDoc[this.renderFieldKey] = new DateField(date as Date);
+        //}
+    }
+
+    render() {
+        return !this.props.isFocused ? <span onPointerDown={this.onPointerDown}>{this._date ? Field.toString(this._date as Field) : "--"}</span> :
+            <DatePicker
+                selected={this._date?.date || new Date}
+                onSelect={date => this.handleChange(date)}
+                onChange={date => this.handleChange(date)}
+            />;
+    }
+}
+
+@observer
+export class CollectionSchemaDocCell extends CollectionSchemaCell {
+
+    _overlayDisposer?: () => void;
+
+    @computed get _doc() { return FieldValue(Cast(this._rowDoc[this.renderFieldKey], Doc)); }
+
+    @action
+    onSetValue = (value: string) => {
+        this._doc && (Doc.GetProto(this._doc).title = value);
+
+        const script = CompileScript(value, {
+            addReturn: true,
+            typecheck: true,
+            transformer: DocumentIconContainer.getTransformer()
+        });
+
+        const results = script.compiled && script.run();
+        if (results && results.success) {
+            this._rowDoc[this.renderFieldKey] = results.result;
+            return true;
+        }
+        return false;
+    }
+
+    componentWillUnmount() { this.onBlur(); }
+
+    onBlur = () => { this._overlayDisposer?.(); };
+    onFocus = () => {
+        this.onBlur();
+        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
+    }
+
+    @action
+    isEditingCallback = (isEditing: boolean): void => {
+        document.removeEventListener("keydown", this.onKeyDown);
+        isEditing && document.addEventListener("keydown", this.onKeyDown);
+        this._isEditing = isEditing;
+        this.props.setIsEditing(isEditing);
+        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
+    }
+
+    render() {
+        return !this._doc ? this.renderCellWithType("document") :
+            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1}
+                onPointerDown={this.onPointerDown}
+            >
+                <div className="collectionSchemaView-cellContents-document"
+                    style={{ padding: "5.9px" }}
+                    ref={this.dropRef}
+                    onFocus={this.onFocus}
+                    onBlur={this.onBlur}
+                >
+                    <EditableView
+                        editing={this._isEditing}
+                        isEditingCallback={this.isEditingCallback}
+                        display={"inline"}
+                        contents={this._doc.title || "--"}
+                        height={"auto"}
+                        maxHeight={Number(MAX_ROW_HEIGHT)}
+                        GetValue={() => StrCast(this._doc?.title)}
+                        SetValue={action((value: string) => {
+                            this.onSetValue(value);
+                            return true;
+                        })}
+                    />
+                </div >
+                <div onClick={() => this._doc && this.props.addDocTab(this._doc, "add:right")} className="collectionSchemaView-cellContents-docButton">
+                    <FontAwesomeIcon icon="external-link-alt" size="lg" />
+                </div>
+            </div>;
+    }
+}
+
+@observer
+export class CollectionSchemaImageCell extends CollectionSchemaCell {
+
+    choosePath(url: URL) {
+        if (url.protocol === "data") return url.href;
+        if (url.href.indexOf(window.location.origin) === -1) return Utils.CorsProxy(url.href);
+        if (!/\.(png|jpg|jpeg|gif|webp)$/.test(url.href.toLowerCase())) return url.href;//Why is this here
+
+        const ext = path.extname(url.href);
+        return url.href.replace(ext, "_o" + path.extname(url.href));
+    }
+
+    render() {
+        const field = Cast(this._rowDoc[this.renderFieldKey], ImageField, null); // retrieve the primary image URL that is being rendered from the data doc
+        const alts = DocListCast(this._rowDoc[this.renderFieldKey + "-alternates"]); // retrieve alternate documents that may be rendered as alternate images
+        const altpaths = alts.map(doc => Cast(doc[Doc.LayoutFieldKey(doc)], ImageField, null)?.url).filter(url => url).map(url => this.choosePath(url)); // access the primary layout data of the alternate documents
+        const paths = field ? [this.choosePath(field.url), ...altpaths] : altpaths;
+        const url = paths.length ? paths : [Utils.CorsProxy("http://www.cs.brown.edu/~bcz/noImage.png")];
+
+        const aspect = Doc.NativeAspect(this._rowDoc);
+        let width = Math.min(75, this.props.rowProps.width);
+        const height = Math.min(75, width / aspect);
+        width = height * aspect;
+
+        const reference = React.createRef<HTMLDivElement>();
+        return <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
+            <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
+                <img src={url[0]}
+                    width={paths.length ? width : "20px"}
+                    height={paths.length ? height : "20px"} />
+            </div >
+        </div>;
+    }
+}
+
+
+@observer
+export class CollectionSchemaListCell extends CollectionSchemaCell {
+    _overlayDisposer?: () => void;
+
+    @computed get _field() { return this._rowDoc[this.renderFieldKey]; }
+    @computed get _optionsList() { return this._field as List<any>; }
+    @observable private _opened = false;
+    @observable private _text = "select an item";
+    @observable private _selectedNum = 0;
+
+    @action
+    onSetValue = (value: string) => {
+        // change if its a document
+        this._optionsList[this._selectedNum] = this._text = value;
+
+        (this._field as List<any>).splice(this._selectedNum, 1, value);
+    }
+
+    @action
+    onSelected = (element: string, index: number) => {
+        this._text = element;
+        this._selectedNum = index;
+    }
+
+    onFocus = () => {
+        this._overlayDisposer?.();
+        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
+    }
+
+    render() {
+        const link = false;
+        const reference = React.createRef<HTMLDivElement>();
+
+        if (this._optionsList?.length) {
+            const options = !this._opened ? (null) :
+                <div>
+                    {this._optionsList.map((element, index) => {
+                        const val = Field.toString(element);
+                        return <div className="collectionSchemaView-dropdownOption" key={index} style={{ padding: "6px" }} onPointerDown={(e) => this.onSelected(StrCast(element), index)} >
+                            {val}
+                        </div>;
+                    })}
+                </div>;
+
+            const plainText = <div style={{ padding: "5.9px" }}>{this._text}</div>;
+            const textarea = <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} style={{ padding: "5.9px" }} ref={this.dropRef} >
+                <EditableView
+                    editing={this._isEditing}
+                    isEditingCallback={this.isEditingCallback}
+                    display={"inline"}
+                    contents={this._text}
+                    height={"auto"}
+                    maxHeight={Number(MAX_ROW_HEIGHT)}
+                    GetValue={() => this._text}
+                    SetValue={action((value: string) => {
+                        // add special for params 
+                        this.onSetValue(value);
+                        return true;
+                    })}
+                />
+            </div >;
+
+            //☰
+            return (
+                <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
+                    <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
+                        <div className="collectionSchemaView-dropDownWrapper">
+                            <button type="button" className="collectionSchemaView-dropdownButton" style={{ right: "length", position: "relative" }}
+                                onClick={action(e => this._opened = !this._opened)} >
+                                <FontAwesomeIcon icon={this._opened ? "caret-up" : "caret-down"} size="sm" />
+                            </button>
+                            <div className="collectionSchemaView-dropdownText"> {link ? plainText : textarea} </div>
+                        </div>
+                        {options}
+                    </div >
+                </div>
+            );
+        }
+        return this.renderCellWithType("list");
+    }
+}
+
+
+@observer
+export class CollectionSchemaCheckboxCell extends CollectionSchemaCell {
+    @computed get _isChecked() { return BoolCast(this._rowDoc[this.renderFieldKey]); }
+
+    render() {
+        const reference = React.createRef<HTMLDivElement>();
+        return (
+            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
+                <input type="checkbox" checked={this._isChecked} onChange={e => this._rowDoc[this.renderFieldKey] = e.target.checked} />
+            </div>
+        );
+    }
+}
+
+
+@observer
+export class CollectionSchemaButtons extends CollectionSchemaCell {
+    render() {
+        return !this.props.Document._searchDoc || ![DocumentType.PDF, DocumentType.RTF].includes(StrCast(this._rowDoc.type) as DocumentType) ? <></> :
+            <div style={{ paddingTop: 8, paddingLeft: 3 }} >
+                <button style={{ padding: 2, left: 77 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, true)}>
+                    <FontAwesomeIcon icon="arrow-up" size="sm" />
+                </button>
+                <button style={{ padding: 2 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, false)} >
+                    <FontAwesomeIcon icon="arrow-down" size="sm" />
+                </button>
+            </div>;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaHeaders.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaHeaders.tsx
new file mode 100644
index 000000000..b2115b22e
--- /dev/null
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaHeaders.tsx
@@ -0,0 +1,518 @@
+import React = require("react");
+import { IconProp, library } from "@fortawesome/fontawesome-svg-core";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action, computed, observable, runInAction } from "mobx";
+import { observer } from "mobx-react";
+import { Doc, DocListCast, Opt } from "../../../../fields/Doc";
+import { listSpec } from "../../../../fields/Schema";
+import { PastelSchemaPalette, SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { ScriptField } from "../../../../fields/ScriptField";
+import { Cast, StrCast } from "../../../../fields/Types";
+import { undoBatch } from "../../../util/UndoManager";
+import { SearchBox } from "../../search/SearchBox";
+import { ColumnType } from "./CollectionSchemaView";
+import "./CollectionSchemaView.scss";
+import { CollectionView } from "../CollectionView";
+
+const higflyout = require("@hig/flyout");
+export const { anchorPoints } = higflyout;
+export const Flyout = higflyout.default;
+
+
+export interface AddColumnHeaderProps {
+    createColumn: () => void;
+}
+
+@observer
+export class CollectionSchemaAddColumnHeader extends React.Component<AddColumnHeaderProps> {
+    render() {
+        return (
+            <button className="add-column" onClick={() => this.props.createColumn()}><FontAwesomeIcon icon="plus" size="sm" /></button>
+        );
+    }
+}
+
+
+export interface ColumnMenuProps {
+    columnField: SchemaHeaderField;
+    // keyValue: string;
+    possibleKeys: string[];
+    existingKeys: string[];
+    // keyType: ColumnType;
+    typeConst: boolean;
+    menuButtonContent: JSX.Element;
+    addNew: boolean;
+    onSelect: (oldKey: string, newKey: string, addnew: boolean) => void;
+    setIsEditing: (isEditing: boolean) => void;
+    deleteColumn: (column: string) => void;
+    onlyShowOptions: boolean;
+    setColumnType: (column: SchemaHeaderField, type: ColumnType) => void;
+    setColumnSort: (column: SchemaHeaderField, desc: boolean | undefined) => void;
+    anchorPoint?: any;
+    setColumnColor: (column: SchemaHeaderField, color: string) => void;
+}
+@observer
+export class CollectionSchemaColumnMenu extends React.Component<ColumnMenuProps> {
+    @observable private _isOpen: boolean = false;
+    @observable private _node: HTMLDivElement | null = null;
+
+    componentDidMount() { document.addEventListener("pointerdown", this.detectClick); }
+
+    componentWillUnmount() { document.removeEventListener("pointerdown", this.detectClick); }
+
+    @action
+    detectClick = (e: PointerEvent) => {
+        !this._node?.contains(e.target as Node) && this.props.setIsEditing(this._isOpen = false);
+    }
+
+    @action
+    toggleIsOpen = (): void => {
+        this.props.setIsEditing(this._isOpen = !this._isOpen);
+    }
+
+    changeColumnType = (type: ColumnType) => {
+        this.props.setColumnType(this.props.columnField, type);
+    }
+
+    changeColumnSort = (desc: boolean | undefined) => {
+        this.props.setColumnSort(this.props.columnField, desc);
+    }
+
+    changeColumnColor = (color: string) => {
+        this.props.setColumnColor(this.props.columnField, color);
+    }
+
+    @action
+    setNode = (node: HTMLDivElement): void => {
+        if (node) {
+            this._node = node;
+        }
+    }
+
+    renderTypes = () => {
+        if (this.props.typeConst) return (null);
+
+        const type = this.props.columnField.type;
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Column type:</label>
+                <div className="columnMenu-types">
+                    <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Any)}>
+                        <FontAwesomeIcon icon={"align-justify"} size="sm" />
+                        Any
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Number)}>
+                        <FontAwesomeIcon icon={"hashtag"} size="sm" />
+                        Number
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.String)}>
+                        <FontAwesomeIcon icon={"font"} size="sm" />
+                        Text
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Boolean)}>
+                        <FontAwesomeIcon icon={"check-square"} size="sm" />
+                        Checkbox
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.List)}>
+                        <FontAwesomeIcon icon={"list-ul"} size="sm" />
+                        List
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Doc)}>
+                        <FontAwesomeIcon icon={"file"} size="sm" />
+                        Document
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Image)}>
+                        <FontAwesomeIcon icon={"image"} size="sm" />
+                        Image
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Date)}>
+                        <FontAwesomeIcon icon={"calendar"} size="sm" />
+                        Date
+                    </div>
+                </div>
+            </div >
+        );
+    }
+
+    renderSorting = () => {
+        const sort = this.props.columnField.desc;
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Sort by:</label>
+                <div className="columnMenu-sort">
+                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.changeColumnSort(true)}>
+                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
+                        Sort descending
+                    </div>
+                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.changeColumnSort(false)}>
+                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
+                        Sort ascending
+                    </div>
+                    <div className="columnMenu-option" onClick={() => this.changeColumnSort(undefined)}>
+                        <FontAwesomeIcon icon="times" size="sm" />
+                        Clear sorting
+                    </div>
+                </div>
+            </div>
+        );
+    }
+
+    renderColors = () => {
+        const selected = this.props.columnField.color;
+
+        const pink = PastelSchemaPalette.get("pink2");
+        const purple = PastelSchemaPalette.get("purple2");
+        const blue = PastelSchemaPalette.get("bluegreen1");
+        const yellow = PastelSchemaPalette.get("yellow4");
+        const red = PastelSchemaPalette.get("red2");
+        const gray = "#f1efeb";
+
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Color:</label>
+                <div className="columnMenu-colors">
+                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.changeColumnColor(pink!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.changeColumnColor(purple!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.changeColumnColor(blue!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.changeColumnColor(yellow!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.changeColumnColor(red!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.changeColumnColor(gray)}></div>
+                </div>
+            </div>
+        );
+    }
+
+    renderContent = () => {
+        return (
+            <div className="collectionSchema-header-menuOptions">
+                {this.props.onlyShowOptions ? <></> :
+                    <>
+                        {this.renderTypes()}
+                        {this.renderSorting()}
+                        {this.renderColors()}
+                        <div className="collectionSchema-headerMenu-group">
+                            <button onClick={() => this.props.deleteColumn(this.props.columnField.heading)}>Delete Column</button>
+                        </div>
+                    </>
+                }
+            </div>
+        );
+    }
+
+    render() {
+        return (
+            <div className="collectionSchema-header-menu" ref={this.setNode}>
+                <Flyout anchorPoint={this.props.anchorPoint ? this.props.anchorPoint : anchorPoints.TOP_CENTER} content={this.renderContent()}>
+                    <div className="collectionSchema-header-toggler" onClick={() => this.toggleIsOpen()}>{this.props.menuButtonContent}</div>
+                </ Flyout >
+            </div>
+        );
+    }
+}
+
+
+export interface KeysDropdownProps {
+    keyValue: string;
+    possibleKeys: string[];
+    existingKeys: string[];
+    canAddNew: boolean;
+    addNew: boolean;
+    onSelect: (oldKey: string, newKey: string, addnew: boolean, filter?: string) => void;
+    setIsEditing: (isEditing: boolean) => void;
+    width?: string;
+    docs?: Doc[];
+    Document: Doc;
+    dataDoc: Doc | undefined;
+    fieldKey: string;
+    ContainingCollectionDoc: Doc | undefined;
+    ContainingCollectionView: Opt<CollectionView>;
+    active?: (outsideReaction?: boolean) => boolean;
+    openHeader: (column: any, screenx: number, screeny: number) => void;
+    col: SchemaHeaderField;
+    icon: IconProp;
+}
+@observer
+export class KeysDropdown extends React.Component<KeysDropdownProps> {
+    @observable private _key: string = this.props.keyValue;
+    @observable private _searchTerm: string = this.props.keyValue;
+    @observable private _isOpen: boolean = false;
+    @observable private _node: HTMLDivElement | null = null;
+    @observable private _inputRef: React.RefObject<HTMLInputElement> = React.createRef();
+
+    @action setSearchTerm = (value: string): void => { this._searchTerm = value; };
+    @action setKey = (key: string): void => { this._key = key; };
+    @action setIsOpen = (isOpen: boolean): void => { this._isOpen = isOpen; };
+
+    @action
+    onSelect = (key: string): void => {
+        this.props.onSelect(this._key, key, this.props.addNew);
+        this.setKey(key);
+        this._isOpen = false;
+        this.props.setIsEditing(false);
+    }
+
+    @action
+    setNode = (node: HTMLDivElement): void => {
+        if (node) {
+            this._node = node;
+        }
+    }
+
+    componentDidMount() {
+        document.addEventListener("pointerdown", this.detectClick);
+        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
+        if (filters?.some(filter => filter.split(":")[0] === this._key)) {
+            runInAction(() => this.closeResultsVisibility = "contents");
+        }
+    }
+
+    @action
+    detectClick = (e: PointerEvent): void => {
+        if (this._node && this._node.contains(e.target as Node)) {
+        } else {
+            this._isOpen = false;
+            this.props.setIsEditing(false);
+        }
+    }
+
+    private tempfilter: string = "";
+    @undoBatch
+    onKeyDown = (e: React.KeyboardEvent): void => {
+        if (e.key === "Enter") {
+            if (this._searchTerm.includes(":")) {
+                const colpos = this._searchTerm.indexOf(":");
+                const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
+                if (temp === "") {
+                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
+                    this.updateFilter();
+                }
+                else {
+                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
+                    this.tempfilter = temp;
+                    Doc.setDocFilter(this.props.Document, this._key, temp, "check");
+                    this.props.col.setColor("green");
+                    this.closeResultsVisibility = "contents";
+                }
+            }
+            else {
+                Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
+                this.updateFilter();
+                if (this.showKeys.length) {
+                    this.onSelect(this.showKeys[0]);
+                } else if (this._searchTerm !== "" && this.props.canAddNew) {
+                    this.setSearchTerm(this._searchTerm || this._key);
+                    this.onSelect(this._searchTerm);
+                }
+            }
+        }
+    }
+
+    onChange = (val: string): void => {
+        this.setSearchTerm(val);
+    }
+
+    @action
+    onFocus = (e: React.FocusEvent): void => {
+        this._isOpen = true;
+        this.props.setIsEditing(true);
+    }
+
+    @computed get showKeys() {
+        const whitelistKeys = ["context", "author", "*lastModified", "text", "data", "tags", "creationDate"];
+        const keyOptions = this._searchTerm === "" ? this.props.possibleKeys : this.props.possibleKeys.filter(key => key.toUpperCase().indexOf(this._searchTerm.toUpperCase()) > -1);
+        const showKeys = new Set<string>();
+        [...keyOptions, ...whitelistKeys].forEach(key => (!Doc.UserDoc().noviceMode ||
+            whitelistKeys.includes(key)
+            || ((!key.startsWith("_") && key[0] === key[0].toUpperCase()) || key[0] === "#")) ? showKeys.add(key) : null);
+        return Array.from(showKeys.keys()).filter(key => !this._searchTerm || key.includes(this._searchTerm));
+    }
+    @action
+    renderOptions = (): JSX.Element[] | JSX.Element => {
+        if (!this._isOpen) {
+            this.defaultMenuHeight = 0;
+            return <></>;
+        }
+        const options = this.showKeys.map(key => {
+            return <div key={key} className="key-option" style={{
+                border: "1px solid lightgray",
+                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
+            }}
+                onPointerDown={e => {
+                    e.stopPropagation();
+                }}
+                onClick={() => {
+                    this.onSelect(key);
+                    this.setSearchTerm("");
+                }}>{key}</div>;
+        });
+
+        // if search term does not already exist as a group type, give option to create new group type
+
+        if (this._key !== this._searchTerm.slice(0, this._key.length)) {
+            if (this._searchTerm !== "" && this.props.canAddNew) {
+                options.push(<div key={""} className="key-option" style={{
+                    border: "1px solid lightgray", width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
+                }}
+                    onClick={() => { this.onSelect(this._searchTerm); this.setSearchTerm(""); }}>
+                    Create "{this._searchTerm}" key</div>);
+            }
+        }
+
+        if (options.length === 0) {
+            this.defaultMenuHeight = 0;
+        }
+        else {
+            if (this.props.docs) {
+                const panesize = this.props.docs.length * 30;
+                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+            else {
+                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+        }
+        return options;
+    }
+
+    docSafe: Doc[] = [];
+
+    @action
+    renderFilterOptions = (): JSX.Element[] | JSX.Element => {
+        if (!this._isOpen || !this.props.dataDoc) {
+            this.defaultMenuHeight = 0;
+            return <></>;
+        }
+        const keyOptions: string[] = [];
+        const colpos = this._searchTerm.indexOf(":");
+        const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
+        if (this.docSafe.length === 0) {
+            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
+        }
+        const docs = this.docSafe;
+        docs.forEach((doc) => {
+            const key = StrCast(doc[this._key]);
+            if (keyOptions.includes(key) === false && key.includes(temp) && key !== "") {
+                keyOptions.push(key);
+            }
+        });
+
+        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
+        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
+            this.props.col.setColor("rgb(241, 239, 235)");
+            this.closeResultsVisibility = "none";
+        }
+        for (let i = 0; i < (filters?.length ?? 0) - 1; i++) {
+            if (filters![i] === this.props.col.heading && keyOptions.includes(filters![i].split(":")[1]) === false) {
+                keyOptions.push(filters![i + 1]);
+            }
+        }
+        const options = keyOptions.map(key => {
+            let bool = false;
+            if (filters !== undefined) {
+                const ind = filters.findIndex(filter => filter.split(":")[0] === key);
+                const fields = ind === -1 ? undefined : filters[ind].split(":");
+                bool = fields ? fields[1] === "check" : false;
+            }
+            return <div key={key} className="key-option" style={{
+                border: "1px solid lightgray", paddingLeft: 5, textAlign: "left",
+                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white", backgroundColor: "white",
+            }}
+            >
+                <input type="checkbox"
+                    onPointerDown={e => e.stopPropagation()}
+                    onClick={e => e.stopPropagation()}
+                    onChange={(e) => {
+                        e.target.checked === true ? Doc.setDocFilter(this.props.Document, this._key, key, "check") : Doc.setDocFilter(this.props.Document, this._key, key, "remove");
+                        e.target.checked === true ? this.closeResultsVisibility = "contents" : console.log("");
+                        e.target.checked === true ? this.props.col.setColor("green") : this.updateFilter();
+                        e.target.checked === true && SearchBox.Instance.filter === true ? Doc.setDocFilter(docs[0], this._key, key, "check") : Doc.setDocFilter(docs[0], this._key, key, "remove");
+                    }}
+                    checked={bool}
+                />
+                <span style={{ paddingLeft: 4 }}>
+                    {key}
+                </span>
+
+            </div>;
+        });
+        if (options.length === 0) {
+            this.defaultMenuHeight = 0;
+        }
+        else {
+            if (this.props.docs) {
+                const panesize = this.props.docs.length * 30;
+                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+            else {
+                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+
+        }
+        return options;
+    }
+
+    @observable defaultMenuHeight = 0;
+
+
+    updateFilter() {
+        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
+        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
+            this.props.col.setColor("rgb(241, 239, 235)");
+            this.closeResultsVisibility = "none";
+        }
+    }
+
+    @computed get scriptField() {
+        const scriptText = "setDocFilter(containingTreeView, heading, this.title, checked)";
+        const script = ScriptField.MakeScript(scriptText, { this: Doc.name, heading: "string", checked: "string", containingTreeView: Doc.name });
+        return script ? () => script : undefined;
+    }
+    filterBackground = () => "rgba(105, 105, 105, 0.432)";
+    @observable filterOpen: boolean | undefined = undefined;
+    closeResultsVisibility: string = "none";
+
+    removeFilters = (e: React.PointerEvent): void => {
+        const keyOptions: string[] = [];
+        if (this.docSafe.length === 0 && this.props.dataDoc) {
+            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
+        }
+        const docs = this.docSafe;
+        docs.forEach((doc) => {
+            const key = StrCast(doc[this._key]);
+            if (keyOptions.includes(key) === false) {
+                keyOptions.push(key);
+            }
+        });
+
+        Doc.setDocFilter(this.props.Document, this._key, "", "remove");
+        this.props.col.setColor("rgb(241, 239, 235)");
+        this.closeResultsVisibility = "none";
+    }
+    render() {
+        return (
+            <div style={{ display: "flex" }} ref={this.setNode}>
+                <FontAwesomeIcon onClick={e => { this.props.openHeader(this.props.col, e.clientX, e.clientY); e.stopPropagation(); }} icon={this.props.icon} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} />
+
+                {/* <FontAwesomeIcon icon={fa.faSearchMinus} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} onClick={e => {
+                    runInAction(() => { this._isOpen === undefined ? this._isOpen = true : this._isOpen = !this._isOpen })
+                }} /> */}
+
+                <div className="keys-dropdown" style={{ zIndex: 1, width: this.props.width, maxWidth: this.props.width }}>
+                    <input className="keys-search" style={{ width: "100%" }}
+                        ref={this._inputRef} type="text" value={this._searchTerm} placeholder="Column key" onKeyDown={this.onKeyDown}
+                        onChange={e => this.onChange(e.target.value)}
+                        onClick={(e) => { e.stopPropagation(); this._inputRef.current?.focus(); }}
+                        onFocus={this.onFocus} ></input>
+                    <div style={{ display: this.closeResultsVisibility }}>
+                        <FontAwesomeIcon onPointerDown={this.removeFilters} icon={"times-circle"} size="lg"
+                            style={{ cursor: "hand", color: "grey", padding: 2, left: -20, top: -1, height: 15, position: "relative" }} />
+                    </div>
+                    {!this._isOpen ? (null) : <div className="keys-options-wrapper" style={{
+                        width: this.props.width, maxWidth: this.props.width, height: "auto",
+                    }}>
+                        {this._searchTerm.includes(":") ? this.renderFilterOptions() : this.renderOptions()}
+                    </div>}
+                </div >
+            </div>
+        );
+    }
+}
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaMovableColumn.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaMovableColumn.tsx
new file mode 100644
index 000000000..456c38c68
--- /dev/null
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaMovableColumn.tsx
@@ -0,0 +1,128 @@
+import React = require("react");
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action } from "mobx";
+import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
+import { Doc } from "../../../../fields/Doc";
+import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { Cast, FieldValue, StrCast } from "../../../../fields/Types";
+import { DocumentManager } from "../../../util/DocumentManager";
+import { DragManager, dropActionType, SetupDrag } from "../../../util/DragManager";
+import { SnappingManager } from "../../../util/SnappingManager";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { ContextMenu } from "../../ContextMenu";
+import "./CollectionSchemaView.scss";
+
+export interface MovableColumnProps {
+    columnRenderer: TableCellRenderer;
+    columnValue: SchemaHeaderField;
+    allColumns: SchemaHeaderField[];
+    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columns: SchemaHeaderField[]) => void;
+    ScreenToLocalTransform: () => Transform;
+}
+export class MovableColumn extends React.Component<MovableColumnProps> {
+    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
+    private _colDropDisposer?: DragManager.DragDropDisposer;
+    private _startDragPosition: { x: number, y: number } = { x: 0, y: 0 };
+    private _sensitivity: number = 16;
+    private _dragRef: React.RefObject<HTMLDivElement> = React.createRef();
+
+    onPointerEnter = (e: React.PointerEvent): void => {
+        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
+            this._header!.current!.className = "collectionSchema-col-wrapper";
+            document.addEventListener("pointermove", this.onDragMove, true);
+        }
+    }
+    onPointerLeave = (e: React.PointerEvent): void => {
+        this._header!.current!.className = "collectionSchema-col-wrapper";
+        document.removeEventListener("pointermove", this.onDragMove, true);
+        !e.buttons && document.removeEventListener("pointermove", this.onPointerMove);
+    }
+    onDragMove = (e: PointerEvent): void => {
+        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
+        const before = x[0] < bounds[0];
+        this._header!.current!.className = "collectionSchema-col-wrapper";
+        if (before) this._header!.current!.className += " col-before";
+        if (!before) this._header!.current!.className += " col-after";
+        e.stopPropagation();
+    }
+
+    createColDropTarget = (ele: HTMLDivElement) => {
+        this._colDropDisposer?.();
+        if (ele) {
+            this._colDropDisposer = DragManager.MakeDropTarget(ele, this.colDrop.bind(this));
+        }
+    }
+
+    colDrop = (e: Event, de: DragManager.DropEvent) => {
+        document.removeEventListener("pointermove", this.onDragMove, true);
+        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
+        const before = x[0] < bounds[0];
+        const colDragData = de.complete.columnDragData;
+        if (colDragData) {
+            e.stopPropagation();
+            this.props.reorderColumns(colDragData.colKey, this.props.columnValue, before, this.props.allColumns);
+            return true;
+        }
+        return false;
+    }
+
+    onPointerMove = (e: PointerEvent) => {
+        const onRowMove = (e: PointerEvent) => {
+            e.stopPropagation();
+            e.preventDefault();
+
+            document.removeEventListener("pointermove", onRowMove);
+            document.removeEventListener('pointerup', onRowUp);
+            const dragData = new DragManager.ColumnDragData(this.props.columnValue);
+            DragManager.StartColumnDrag(this._dragRef.current!, dragData, e.x, e.y);
+        };
+        const onRowUp = (): void => {
+            document.removeEventListener("pointermove", onRowMove);
+            document.removeEventListener('pointerup', onRowUp);
+        };
+        if (e.buttons === 1) {
+            const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX - this._startDragPosition.x, e.clientY - this._startDragPosition.y);
+            if (Math.abs(dx) + Math.abs(dy) > this._sensitivity) {
+                document.removeEventListener("pointermove", this.onPointerMove);
+                e.stopPropagation();
+
+                document.addEventListener("pointermove", onRowMove);
+                document.addEventListener("pointerup", onRowUp);
+            }
+        }
+    }
+
+    onPointerUp = (e: React.PointerEvent) => {
+        document.removeEventListener("pointermove", this.onPointerMove);
+    }
+
+    @action
+    onPointerDown = (e: React.PointerEvent, ref: React.RefObject<HTMLDivElement>) => {
+        this._dragRef = ref;
+        const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX, e.clientY);
+        if (!(e.target as any)?.tagName.includes("INPUT")) {
+            this._startDragPosition = { x: dx, y: dy };
+            document.addEventListener("pointermove", this.onPointerMove);
+        }
+    }
+
+
+    render() {
+        const reference = React.createRef<HTMLDivElement>();
+
+        return (
+            <div className="collectionSchema-col" ref={this.createColDropTarget}>
+                <div className="collectionSchema-col-wrapper" ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
+                    <div className="col-dragger" ref={reference} onPointerDown={e => this.onPointerDown(e, reference)} onPointerUp={this.onPointerUp}>
+                        {this.props.columnRenderer}
+                    </div>
+                </div>
+            </div>
+        );
+    }
+}
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaMovableRow.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaMovableRow.tsx
new file mode 100644
index 000000000..f48906ba5
--- /dev/null
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaMovableRow.tsx
@@ -0,0 +1,147 @@
+import React = require("react");
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action } from "mobx";
+import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
+import { Doc } from "../../../../fields/Doc";
+import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { Cast, FieldValue, StrCast } from "../../../../fields/Types";
+import { DocumentManager } from "../../../util/DocumentManager";
+import { DragManager, dropActionType, SetupDrag } from "../../../util/DragManager";
+import { SnappingManager } from "../../../util/SnappingManager";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { ContextMenu } from "../../ContextMenu";
+import "./CollectionSchemaView.scss";
+
+export interface MovableRowProps {
+    rowInfo: RowInfo;
+    ScreenToLocalTransform: () => Transform;
+    addDoc: (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => boolean;
+    removeDoc: (doc: Doc | Doc[]) => boolean;
+    rowFocused: boolean;
+    textWrapRow: (doc: Doc) => void;
+    rowWrapped: boolean;
+    dropAction: string;
+    addDocTab: any;
+}
+
+export class MovableRow extends React.Component<MovableRowProps> {
+    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
+    private _rowDropDisposer?: DragManager.DragDropDisposer;
+
+    // Event listeners are only necessary when the user is hovering over the table
+    // Create one when the mouse starts hovering...
+    onPointerEnter = (e: React.PointerEvent): void => {
+        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
+            this._header!.current!.className = "collectionSchema-row-wrapper";
+            document.addEventListener("pointermove", this.onDragMove, true);
+        }
+    }
+    // ... and delete it when the mouse leaves
+    onPointerLeave = (e: React.PointerEvent): void => {
+        this._header!.current!.className = "collectionSchema-row-wrapper";
+        document.removeEventListener("pointermove", this.onDragMove, true);
+    }
+    // The method for the event listener, reorders columns when dragged to their new locations.
+    onDragMove = (e: PointerEvent): void => {
+        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
+        const before = x[1] < bounds[1];
+        this._header!.current!.className = "collectionSchema-row-wrapper";
+        if (before) this._header!.current!.className += " row-above";
+        if (!before) this._header!.current!.className += " row-below";
+        e.stopPropagation();
+    }
+    componentWillUnmount() {
+
+        this._rowDropDisposer?.();
+    }
+    //
+    createRowDropTarget = (ele: HTMLDivElement) => {
+        this._rowDropDisposer?.();
+        if (ele) {
+            this._rowDropDisposer = DragManager.MakeDropTarget(ele, this.rowDrop.bind(this));
+        }
+    }
+    // Controls what hppens when a row is dragged and dropped
+    rowDrop = (e: Event, de: DragManager.DropEvent) => {
+        this.onPointerLeave(e as any);
+        const rowDoc = FieldValue(Cast(this.props.rowInfo.original, Doc));
+        if (!rowDoc) return false;
+
+        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
+        const before = x[1] < bounds[1];
+
+        const docDragData = de.complete.docDragData;
+        if (docDragData) {
+            e.stopPropagation();
+            if (docDragData.draggedDocuments[0] === rowDoc) return true;
+            const addDocument = (doc: Doc | Doc[]) => this.props.addDoc(doc, rowDoc, before);
+            const movedDocs = docDragData.draggedDocuments;
+            return (docDragData.dropAction || docDragData.userDropAction) ?
+                docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before) || added, false)
+                : (docDragData.moveDocument) ?
+                    movedDocs.reduce((added: boolean, d) => docDragData.moveDocument?.(d, rowDoc, addDocument) || added, false)
+                    : docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before), false);
+        }
+        return false;
+    }
+
+    onRowContextMenu = (e: React.MouseEvent): void => {
+        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
+        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
+    }
+
+    @undoBatch
+    @action
+    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
+        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
+        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
+    }
+
+    @action
+    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
+        console.log("yes");
+        if (e.key === "Backspace" || e.key === "Delete") {
+            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
+        }
+    }
+
+    render() {
+        const { children = null, rowInfo } = this.props;
+
+        if (!rowInfo) {
+            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
+        }
+
+        const { original } = rowInfo;
+        const doc = FieldValue(Cast(original, Doc));
+
+        if (!doc) return (null);
+
+        const reference = React.createRef<HTMLDivElement>();
+        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
+
+        let className = "collectionSchema-row";
+        if (this.props.rowFocused) className += " row-focused";
+        if (this.props.rowWrapped) className += " row-wrapped";
+
+        return (
+            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
+                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
+                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
+                        <div className="row-dragger">
+                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
+                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
+                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
+                        </div>
+                        {children}
+                    </ReactTableDefaults.TrComponent>
+                </div>
+            </div>
+        );
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.scss b/src/client/views/collections/collectionSchema/CollectionSchemaView.scss
new file mode 100644
index 000000000..b57fee0e4
--- /dev/null
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.scss
@@ -0,0 +1,552 @@
+@import "../../globalCssVariables";
+.collectionSchemaView-container {
+    border-width: $COLLECTION_BORDER_WIDTH;
+    border-color: $intermediate-color;
+    border-style: solid;
+    border-radius: $border-radius;
+    box-sizing: border-box;
+    position: relative;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    margin-top: 0;
+    transition: top 0.5s;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: nowrap;
+    touch-action: none;
+    div {
+        touch-action: none;
+    }
+    .collectionSchemaView-tableContainer {
+        width: 100%;
+        height: 100%;
+    }
+    .collectionSchemaView-dividerDragger {
+        position: relative;
+        height: 100%;
+        width: $SCHEMA_DIVIDER_WIDTH;
+        z-index: 20;
+        right: 0;
+        top: 0;
+        background: gray;
+        cursor: col-resize;
+    }
+    // .documentView-node:first-child {
+    //     background: $light-color;
+    // }
+}
+
+.collectionSchemaView-searchContainer {
+    border-width: $COLLECTION_BORDER_WIDTH;
+    border-color: $intermediate-color;
+    border-style: solid;
+    border-radius: $border-radius;
+    box-sizing: border-box;
+    position: relative;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    margin-top: 0;
+    transition: top 0.5s;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: nowrap;
+    touch-action: none;
+    padding: 2px;
+    div {
+        touch-action: none;
+    }
+    .collectionSchemaView-tableContainer {
+        width: 100%;
+        height: 100%;
+    }
+    .collectionSchemaView-dividerDragger {
+        position: relative;
+        height: 100%;
+        width: 20px;
+        z-index: 20;
+        right: 0;
+        top: 0;
+        background: gray;
+        cursor: col-resize;
+    }
+    // .documentView-node:first-child {
+    //     background: $light-color;
+    // }
+}
+
+.ReactTable {
+    width: 100%;
+    background: white;
+    box-sizing: border-box;
+    border: none !important;
+    float: none !important;
+    .rt-table {
+        height: 100%;
+        display: -webkit-inline-box;
+        direction: ltr;
+        overflow: visible;
+    }
+    .rt-noData {
+        display: none;
+    }
+    .rt-thead {
+        width: 100%;
+        z-index: 100;
+        overflow-y: visible;
+        &.-header {
+            font-size: 12px;
+            height: 30px;
+            box-shadow: none;
+            z-index: 100;
+            overflow-y: visible;
+        }
+        .rt-resizable-header-content {
+            height: 100%;
+            overflow: visible;
+        }
+        .rt-th {
+            padding: 0;
+            border: solid lightgray;
+            border-width: 0 1px;
+            border-bottom: 2px solid lightgray;
+        }
+    }
+    .rt-th {
+        font-size: 13px;
+        text-align: center;
+        &:last-child {
+            overflow: visible;
+        }
+    }
+    .rt-tbody {
+        width: 100%;
+        direction: rtl;
+        overflow: visible;
+        .rt-td {
+            border-right: 1px solid rgba(0, 0, 0, 0.2);
+        }
+    }
+    .rt-tr-group {
+        direction: ltr;
+        flex: 0 1 auto;
+        min-height: 30px;
+        border: 0 !important;
+    }
+    .rt-tr {
+        width: 100%;
+        min-height: 30px;
+    }
+    .rt-td {
+        padding: 0;
+        font-size: 13px;
+        text-align: center;
+        white-space: nowrap;
+        display: flex;
+        align-items: center;
+        .imageBox-cont {
+            position: relative;
+            max-height: 100%;
+        }
+        .imageBox-cont img {
+            object-fit: contain;
+            max-width: 100%;
+            height: 100%;
+        }
+        .videoBox-cont {
+            object-fit: contain;
+            width: auto;
+            height: 100%;
+        }
+    }
+    .rt-td.rt-expandable {
+        display: flex;
+        align-items: center;
+        height: inherit;
+    }
+    .rt-resizer {
+        width: 8px;
+        right: -4px;
+    }
+    .rt-resizable-header {
+        padding: 0;
+        height: 30px;
+    }
+    .rt-resizable-header:last-child {
+        overflow: visible;
+        .rt-resizer {
+            width: 5px !important;
+        }
+    }
+}
+
+.documentView-node-topmost {
+    text-align: left;
+    transform-origin: center top;
+    display: inline-block;
+}
+
+.collectionSchema-col {
+    height: 100%;
+}
+
+.collectionSchema-header-menu {
+    height: auto;
+    z-index: 100;
+    position: absolute;
+    background: white;
+    padding: 5px;
+    position: fixed;
+    background: white;
+    border: black 1px solid;
+    .collectionSchema-header-toggler {
+        z-index: 100;
+        width: 100%;
+        height: 100%;
+        padding: 4px;
+        letter-spacing: 2px;
+        text-transform: uppercase;
+        svg {
+            margin-right: 4px;
+        }
+    }
+}
+
+.collectionSchemaView-header {
+    height: 100%;
+    color: gray;
+    z-index: 100;
+    overflow-y: visible;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+}
+
+button.add-column {
+    width: 28px;
+}
+
+.collectionSchema-header-menuOptions {
+    color: black;
+    width: 180px;
+    text-align: left;
+    .collectionSchema-headerMenu-group {
+        padding: 7px 0;
+        border-bottom: 1px solid lightgray;
+        cursor: pointer;
+        &:first-child {
+            padding-top: 0;
+        }
+        &:last-child {
+            border: none;
+            text-align: center;
+            padding: 12px 0 0 0;
+        }
+    }
+    label {
+        color: $main-accent;
+        font-weight: normal;
+        letter-spacing: 2px;
+        text-transform: uppercase;
+    }
+    input {
+        color: black;
+        width: 100%;
+    }
+    .columnMenu-option {
+        cursor: pointer;
+        padding: 3px;
+        background-color: white;
+        transition: background-color 0.2s;
+        &:hover {
+            background-color: $light-color-secondary;
+        }
+        &.active {
+            font-weight: bold;
+            border: 2px solid $light-color-secondary;
+        }
+        svg {
+            color: gray;
+            margin-right: 5px;
+            width: 10px;
+        }
+    }
+    .keys-dropdown {
+        position: relative;
+        //width: 100%;
+        background-color: white;
+        input {
+            border: 2px solid $light-color-secondary;
+            padding: 3px;
+            height: 28px;
+            font-weight: bold;
+            letter-spacing: "2px";
+            text-transform: "uppercase";
+            &:focus {
+                font-weight: normal;
+            }
+        }
+        .keys-options-wrapper {
+            width: 100%;
+            max-height: 150px;
+            overflow-y: scroll;
+            position: absolute;
+            top: 28px;
+            box-shadow: 0 10px 16px rgba(0, 0, 0, 0.1);
+            background-color: white;
+            .key-option {
+                background-color: white;
+                border: 1px solid lightgray;
+                padding: 2px 3px;
+                &:not(:first-child) {
+                    border-top: 0;
+                }
+                &:hover {
+                    background-color: $light-color-secondary;
+                }
+            }
+        }
+    }
+    .columnMenu-colors {
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        .columnMenu-colorPicker {
+            cursor: pointer;
+            width: 20px;
+            height: 20px;
+            border-radius: 10px;
+            &.active {
+                border: 2px solid white;
+                box-shadow: 0 0 0 2px lightgray;
+            }
+        }
+    }
+}
+
+.collectionSchema-row {
+    height: 100%;
+    background-color: white;
+    &.row-focused .rt-td {
+        background-color: #bfffc0; //$light-color-secondary;
+    }
+    &.row-wrapped {
+        .rt-td {
+            white-space: normal;
+        }
+    }
+    .row-dragger {
+        display: flex;
+        justify-content: space-around;
+        //flex: 50 0 auto;
+        width: 0;
+        max-width: 50px;
+        //height: 100%;
+        min-height: 30px;
+        align-items: center;
+        color: lightgray;
+        background-color: white;
+        transition: color 0.1s ease;
+        .row-option {
+            // padding: 5px;
+            cursor: pointer;
+            position: absolute;
+            transition: color 0.1s ease;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            z-index: 2;
+            &:hover {
+                color: gray;
+            }
+        }
+    }
+    .collectionSchema-row-wrapper {
+        &.row-above {
+            border-top: 1px solid red;
+        }
+        &.row-below {
+            border-bottom: 1px solid red;
+        }
+        &.row-inside {
+            border: 1px solid red;
+        }
+        .row-dragging {
+            background-color: blue;
+        }
+    }
+}
+
+.collectionSchemaView-cellContainer {
+    width: 100%;
+    height: unset;
+}
+
+.collectionSchemaView-cellWrapper {
+    height: 100%;
+    padding: 4px;
+    text-align: left;
+    padding-left: 19px;
+    position: relative;
+    &:focus {
+        outline: none;
+    }
+    &.editing {
+        padding: 0;
+        input {
+            outline: 0;
+            border: none;
+            background-color: rgb(255, 217, 217);
+            width: 100%;
+            height: 100%;
+            padding: 2px 3px;
+            min-height: 26px;
+        }
+    }
+    &.focused {
+        &.inactive {
+            border: none;
+        }
+    }
+    p {
+        width: 100%;
+        height: 100%;
+    }
+    &:hover .collectionSchemaView-cellContents-docExpander {
+        display: block;
+    }
+    .collectionSchemaView-cellContents-document {
+        display: inline-block;
+    }
+    .collectionSchemaView-cellContents-docButton {
+        float: right;
+        width: "15px";
+        height: "15px";
+    }
+    .collectionSchemaView-dropdownWrapper {
+        border: grey;
+        border-style: solid;
+        border-width: 1px;
+        height: 30px;
+        .collectionSchemaView-dropdownButton {
+            //display: inline-block;
+            float: left;
+            height: 100%;
+        }
+        .collectionSchemaView-dropdownText {
+            display: inline-block;
+            //float: right;
+            height: 100%;
+            display: "flex";
+            font-size: 13;
+            justify-content: "center";
+            align-items: "center";
+        }
+    }
+    .collectionSchemaView-dropdownContainer {
+        position: absolute;
+        border: 1px solid rgba(0, 0, 0, 0.04);
+        box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14);
+        .collectionSchemaView-dropdownOption:hover {
+            background-color: rgba(0, 0, 0, 0.14);
+            cursor: pointer;
+        }
+    }
+}
+
+.collectionSchemaView-cellContents-docExpander {
+    height: 30px;
+    width: 30px;
+    display: none;
+    position: absolute;
+    top: 0;
+    right: 0;
+    background-color: lightgray;
+}
+
+.doc-drag-over {
+    background-color: red;
+}
+
+.collectionSchemaView-toolbar {
+    z-index: 100;
+}
+
+.collectionSchemaView-toolbar {
+    height: 30px;
+    display: flex;
+    justify-content: flex-end;
+    padding: 0 10px;
+    border-bottom: 2px solid gray;
+    .collectionSchemaView-toolbar-item {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+    }
+}
+
+#preview-schema-checkbox-div {
+    margin-left: 20px;
+    font-size: 12px;
+}
+
+.collectionSchemaView-table {
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    padding: 3px;
+}
+
+.rt-td.rt-expandable {
+    overflow: visible;
+    position: relative;
+    height: 100%;
+    z-index: 1;
+}
+
+.reactTable-sub {
+    background-color: rgb(252, 252, 252);
+    width: 100%;
+    .rt-thead {
+        display: none;
+    }
+    .row-dragger {
+        background-color: rgb(252, 252, 252);
+    }
+    .rt-table {
+        background-color: rgb(252, 252, 252);
+    }
+    .collectionSchemaView-table {
+        width: 100%;
+        border: solid 1px;
+        overflow: visible;
+        padding: 0px;
+    }
+}
+
+.collectionSchemaView-expander {
+    height: 100%;
+    min-height: 30px;
+    position: absolute;
+    color: gray;
+    width: 20;
+    height: auto;
+    left: 55;
+    svg {
+        position: absolute;
+        top: 50%;
+        left: 10;
+        transform: translate(-50%, -50%);
+    }
+}
+
+.collectionSchemaView-addRow {
+    color: gray;
+    letter-spacing: 2px;
+    text-transform: uppercase;
+    cursor: pointer;
+    font-size: 10.5px;
+    margin-left: 50px;
+    margin-top: 10px;
+}
\ No newline at end of file
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
new file mode 100644
index 000000000..ef28f75c8
--- /dev/null
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
@@ -0,0 +1,575 @@
+import React = require("react");
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { action, computed, observable, untracked } from "mobx";
+import { observer } from "mobx-react";
+import Measure from "react-measure";
+import { Resize } from "react-table";
+import "react-table/react-table.css";
+import { Doc, Opt } from "../../../../fields/Doc";
+import { List } from "../../../../fields/List";
+import { listSpec } from "../../../../fields/Schema";
+import { PastelSchemaPalette, SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { Cast, NumCast } from "../../../../fields/Types";
+import { TraceMobx } from "../../../../fields/util";
+import { emptyFunction, emptyPath, returnFalse, setupMoveUpEvents, returnEmptyDoclist, returnTrue } from "../../../../Utils";
+import { SelectionManager } from "../../../util/SelectionManager";
+import { SnappingManager } from "../../../util/SnappingManager";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../globalCssVariables.scss';
+import { ContextMenu } from "../../ContextMenu";
+import { ContextMenuProps } from "../../ContextMenuItem";
+import '../../../views/DocumentDecorations.scss';
+import { DocumentView } from "../../nodes/DocumentView";
+import { DefaultStyleProvider } from "../../StyleProvider";
+import "./CollectionSchemaView.scss";
+import { CollectionSubView } from "../CollectionSubView";
+import { SchemaTable } from "./SchemaTable";
+import { DocUtils } from "../../../documents/Documents";
+// bcz: need to add drag and drop of rows and columns.  This seems like it might work for rows: https://codesandbox.io/s/l94mn1q657
+
+export enum ColumnType {
+    Any,
+    Number,
+    String,
+    Boolean,
+    Doc,
+    Image,
+    List,
+    Date
+}
+// this map should be used for keys that should have a const type of value
+const columnTypes: Map<string, ColumnType> = new Map([
+    ["title", ColumnType.String],
+    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
+    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
+    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
+]);
+
+@observer
+export class CollectionSchemaView extends CollectionSubView(doc => doc) {
+    private _previewCont?: HTMLDivElement;
+
+    @observable _previewDoc: Doc | undefined = undefined;
+    @observable _focusedTable: Doc = this.props.Document;
+    @observable _col: any = "";
+    @observable _menuWidth = 0;
+    @observable _headerOpen = false;
+    @observable _headerIsEditing = false;
+    @observable _menuHeight = 0;
+    @observable _pointerX = 0;
+    @observable _pointerY = 0;
+    @observable _openTypes: boolean = false;
+
+    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
+    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
+    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
+    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
+    @computed get scale() { return this.props.ScreenToLocalTransform().Scale; }
+    @computed get columns() { return Cast(this.props.Document._schemaHeaders, listSpec(SchemaHeaderField), []); }
+    set columns(columns: SchemaHeaderField[]) { this.props.Document._schemaHeaders = new List<SchemaHeaderField>(columns); }
+
+    @computed get menuCoordinates() {
+        let searchx = 0;
+        let searchy = 0;
+        if (this.props.Document._searchDoc) {
+            const el = document.getElementsByClassName("collectionSchemaView-searchContainer")[0];
+            if (el !== undefined) {
+                const rect = el.getBoundingClientRect();
+                searchx = rect.x;
+                searchy = rect.y;
+            }
+        }
+        const x = Math.max(0, Math.min(document.body.clientWidth - this._menuWidth, this._pointerX)) - searchx;
+        const y = Math.max(0, Math.min(document.body.clientHeight - this._menuHeight, this._pointerY)) - searchy;
+        return this.props.ScreenToLocalTransform().transformPoint(x, y);
+    }
+
+    get documentKeys() {
+        const docs = this.childDocs;
+        const keys: { [key: string]: boolean } = {};
+        // bcz: ugh.  this is untracked since otherwise a large collection of documents will blast the server for all their fields.
+        //  then as each document's fields come back, we update the documents _proxies.  Each time we do this, the whole schema will be
+        //  invalidated and re-rendered.   This workaround will inquire all of the document fields before the options button is clicked.
+        //  then by the time the options button is clicked, all of the fields should be in place.  If a new field is added while this menu
+        //  is displayed (unlikely) it won't show up until something else changes.
+        //TODO Types
+        untracked(() => docs.map(doc => Doc.GetAllPrototypes(doc).map(proto => Object.keys(proto).forEach(key => keys[key] = false))));
+
+        this.columns.forEach(key => keys[key.heading] = true);
+        return Array.from(Object.keys(keys));
+    }
+
+    @action setHeaderIsEditing = (isEditing: boolean) => this._headerIsEditing = isEditing;
+
+    @undoBatch
+    setColumnType = action((columnField: SchemaHeaderField, type: ColumnType): void => {
+        this._openTypes = false;
+        if (columnTypes.get(columnField.heading)) return;
+
+        const columns = this.columns;
+        const index = columns.indexOf(columnField);
+        if (index > -1) {
+            columnField.setType(NumCast(type));
+            columns[index] = columnField;
+            this.columns = columns;
+        }
+    });
+
+    @undoBatch
+    setColumnColor = (columnField: SchemaHeaderField, color: string): void => {
+        const columns = this.columns;
+        const index = columns.indexOf(columnField);
+        if (index > -1) {
+            columnField.setColor(color);
+            columns[index] = columnField;
+            this.columns = columns; // need to set the columns to trigger rerender
+        }
+    }
+
+    @undoBatch
+    @action
+    setColumnSort = (columnField: SchemaHeaderField, descending: boolean | undefined) => {
+        const columns = this.columns;
+        columns.forEach(col => col.setDesc(undefined));
+
+        const index = columns.findIndex(c => c.heading === columnField.heading);
+        const column = columns[index];
+        column.setDesc(descending);
+        columns[index] = column;
+        this.columns = columns;
+    }
+
+    renderTypes = (col: any) => {
+        if (columnTypes.get(col.heading)) return (null);
+
+        const type = col.type;
+
+        const anyType = <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Any)}>
+            <FontAwesomeIcon icon={"align-justify"} size="sm" />
+                Any
+            </div>;
+
+        const numType = <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Number)}>
+            <FontAwesomeIcon icon={"hashtag"} size="sm" />
+                Number
+            </div>;
+
+        const textType = <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.String)}>
+            <FontAwesomeIcon icon={"font"} size="sm" />
+            Text
+            </div>;
+
+        const boolType = <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Boolean)}>
+            <FontAwesomeIcon icon={"check-square"} size="sm" />
+            Checkbox
+            </div>;
+
+        const listType = <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.List)}>
+            <FontAwesomeIcon icon={"list-ul"} size="sm" />
+            List
+            </div>;
+
+        const docType = <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Doc)}>
+            <FontAwesomeIcon icon={"file"} size="sm" />
+            Document
+            </div>;
+
+        const imageType = <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Image)}>
+            <FontAwesomeIcon icon={"image"} size="sm" />
+            Image
+            </div>;
+
+        const dateType = <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Date)}>
+            <FontAwesomeIcon icon={"calendar"} size="sm" />
+                Date
+                </div>;
+
+
+        const allColumnTypes = <div className="columnMenu-types">
+            {anyType}
+            {numType}
+            {textType}
+            {boolType}
+            {listType}
+            {docType}
+            {imageType}
+            {dateType}
+        </div>;
+
+        const justColType = type === ColumnType.Any ? anyType : type === ColumnType.Number ? numType :
+            type === ColumnType.String ? textType : type === ColumnType.Boolean ? boolType :
+                type === ColumnType.List ? listType : type === ColumnType.Doc ? docType :
+                    type === ColumnType.Date ? dateType : imageType;
+
+        return (
+            <div className="collectionSchema-headerMenu-group" onClick={action(() => this._openTypes = !this._openTypes)}>
+                <div>
+                    <label style={{ cursor: "pointer" }}>Column type:</label>
+                    <FontAwesomeIcon icon={"caret-down"} size="lg" style={{ float: "right", transform: `rotate(${this._openTypes ? "180deg" : 0})`, transition: "0.2s all ease" }} />
+                </div>
+                {this._openTypes ? allColumnTypes : justColType}
+            </div >
+        );
+    }
+
+    renderSorting = (col: any) => {
+        const sort = col.desc;
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Sort by:</label>
+                <div className="columnMenu-sort">
+                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.setColumnSort(col, true)}>
+                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
+                        Sort descending
+                    </div>
+                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.setColumnSort(col, false)}>
+                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
+                        Sort ascending
+                    </div>
+                    <div className="columnMenu-option" onClick={() => this.setColumnSort(col, undefined)}>
+                        <FontAwesomeIcon icon="times" size="sm" />
+                        Clear sorting
+                    </div>
+                </div>
+            </div>
+        );
+    }
+
+    renderColors = (col: any) => {
+        const selected = col.color;
+
+        const pink = PastelSchemaPalette.get("pink2");
+        const purple = PastelSchemaPalette.get("purple2");
+        const blue = PastelSchemaPalette.get("bluegreen1");
+        const yellow = PastelSchemaPalette.get("yellow4");
+        const red = PastelSchemaPalette.get("red2");
+        const gray = "#f1efeb";
+
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Color:</label>
+                <div className="columnMenu-colors">
+                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.setColumnColor(col, pink!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.setColumnColor(col, purple!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.setColumnColor(col, blue!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.setColumnColor(col, yellow!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.setColumnColor(col, red!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.setColumnColor(col, gray)}></div>
+                </div>
+            </div>
+        );
+    }
+
+    @undoBatch
+    @action
+    changeColumns = (oldKey: string, newKey: string, addNew: boolean, filter?: string) => {
+        const columns = this.columns;
+        if (columns === undefined) {
+            this.columns = new List<SchemaHeaderField>([new SchemaHeaderField(newKey, "f1efeb")]);
+        } else {
+            if (addNew) {
+                columns.push(new SchemaHeaderField(newKey, "f1efeb"));
+                this.columns = columns;
+            } else {
+                const index = columns.map(c => c.heading).indexOf(oldKey);
+                if (index > -1) {
+                    const column = columns[index];
+                    column.setHeading(newKey);
+                    columns[index] = column;
+                    this.columns = columns;
+                    if (filter) {
+                        Doc.setDocFilter(this.props.Document, newKey, filter, "match");
+                    }
+                    else {
+                        this.props.Document._docFilters = undefined;
+                    }
+                }
+            }
+        }
+    }
+
+    @action
+    openHeader = (col: any, screenx: number, screeny: number) => {
+        this._col = col;
+        this._headerOpen = true;
+        this._pointerX = screenx;
+        this._pointerY = screeny;
+    }
+
+    @action
+    closeHeader = () => { this._headerOpen = false; }
+
+    @undoBatch
+    @action
+    deleteColumn = (key: string) => {
+        const columns = this.columns;
+        if (columns === undefined) {
+            this.columns = new List<SchemaHeaderField>([]);
+        } else {
+            const index = columns.map(c => c.heading).indexOf(key);
+            if (index > -1) {
+                columns.splice(index, 1);
+                this.columns = columns;
+            }
+        }
+        this.closeHeader();
+    }
+
+    getPreviewTransform = (): Transform => {
+        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - NumCast(COLLECTION_BORDER_WIDTH) - this.tableWidth, - this.borderWidth);
+    }
+
+    @action
+    onHeaderClick = (e: React.PointerEvent) => {
+        e.stopPropagation();
+    }
+
+    @action
+    onWheel(e: React.WheelEvent) {
+        const scale = this.props.ScreenToLocalTransform().Scale;
+        this.props.isContentActive(true) && e.stopPropagation();
+    }
+
+    @computed get renderMenuContent() {
+        TraceMobx();
+        return <div className="collectionSchema-header-menuOptions">
+            {this.renderTypes(this._col)}
+            {this.renderColors(this._col)}
+            <div className="collectionSchema-headerMenu-group">
+                <button onClick={() => { this.deleteColumn(this._col.heading); }}
+                >Delete Column</button>
+            </div>
+        </div>;
+    }
+
+    private createTarget = (ele: HTMLDivElement) => {
+        this._previewCont = ele;
+        super.CreateDropTarget(ele);
+    }
+
+    isFocused = (doc: Doc, outsideReaction: boolean): boolean => this.props.isSelected(outsideReaction) && doc === this._focusedTable;
+
+    @action setFocused = (doc: Doc) => this._focusedTable = doc;
+
+    @action setPreviewDoc = (doc: Opt<Doc>) => {
+        SelectionManager.SelectSchemaView(this, doc);
+        this._previewDoc = doc;
+    }
+
+    //toggles preview side-panel of schema
+    @action
+    toggleExpander = () => {
+        this.props.Document.schemaPreviewWidth = this.previewWidth() === 0 ? Math.min(this.tableWidth / 3, 200) : 0;
+    }
+
+    onDividerDown = (e: React.PointerEvent) => {
+        setupMoveUpEvents(this, e, this.onDividerMove, emptyFunction, this.toggleExpander);
+    }
+    @action
+    onDividerMove = (e: PointerEvent, down: number[], delta: number[]) => {
+        const nativeWidth = this._previewCont!.getBoundingClientRect();
+        const minWidth = 40;
+        const maxWidth = 1000;
+        const movedWidth = this.props.ScreenToLocalTransform().transformDirection(nativeWidth.right - e.clientX, 0)[0];
+        const width = movedWidth < minWidth ? minWidth : movedWidth > maxWidth ? maxWidth : movedWidth;
+        this.props.Document.schemaPreviewWidth = width;
+        return false;
+    }
+
+    onPointerDown = (e: React.PointerEvent): void => {
+        if (e.button === 0 && !e.altKey && !e.ctrlKey && !e.metaKey) {
+            if (this.props.isSelected(true)) e.stopPropagation();
+            else this.props.select(false);
+        }
+    }
+
+    @computed
+    get previewDocument(): Doc | undefined { return this._previewDoc; }
+
+    @computed
+    get dividerDragger() {
+        return this.previewWidth() === 0 ? (null) :
+            <div className="collectionSchemaView-dividerDragger" onPointerDown={this.onDividerDown} >
+                <div className="collectionSchemaView-dividerDragger" />
+            </div>;
+    }
+
+    @computed
+    get previewPanel() {
+        return <div ref={this.createTarget} style={{ width: `${this.previewWidth()}px` }}>
+            {!this.previewDocument ? (null) :
+                <DocumentView
+                    Document={this.previewDocument}
+                    DataDoc={undefined}
+                    fitContentsToDoc={returnTrue}
+                    freezeDimensions={true}
+                    dontCenter={"y"}
+                    focus={DocUtils.DefaultFocus}
+                    renderDepth={this.props.renderDepth}
+                    rootSelected={this.rootSelected}
+                    PanelWidth={this.previewWidth}
+                    PanelHeight={this.previewHeight}
+                    isContentActive={returnTrue}
+                    isDocumentActive={returnFalse}
+                    ScreenToLocalTransform={this.getPreviewTransform}
+                    docFilters={this.docFilters}
+                    docRangeFilters={this.docRangeFilters}
+                    searchFilterDocs={this.searchFilterDocs}
+                    styleProvider={DefaultStyleProvider}
+                    layerProvider={undefined}
+                    docViewPath={returnEmptyDoclist}
+                    ContainingCollectionDoc={this.props.CollectionView?.props.Document}
+                    ContainingCollectionView={this.props.CollectionView}
+                    moveDocument={this.props.moveDocument}
+                    addDocument={this.props.addDocument}
+                    removeDocument={this.props.removeDocument}
+                    whenChildContentsActiveChanged={this.props.whenChildContentsActiveChanged}
+                    addDocTab={this.props.addDocTab}
+                    pinToPres={this.props.pinToPres}
+                    bringToFront={returnFalse}
+                />}
+        </div>;
+    }
+
+    @computed
+    get schemaTable() {
+        return <SchemaTable
+            Document={this.props.Document}
+            PanelHeight={this.props.PanelHeight}
+            PanelWidth={this.props.PanelWidth}
+            childDocs={this.childDocs}
+            CollectionView={this.props.CollectionView}
+            ContainingCollectionView={this.props.ContainingCollectionView}
+            ContainingCollectionDoc={this.props.ContainingCollectionDoc}
+            fieldKey={this.props.fieldKey}
+            renderDepth={this.props.renderDepth}
+            moveDocument={this.props.moveDocument}
+            ScreenToLocalTransform={this.props.ScreenToLocalTransform}
+            active={this.props.isContentActive}
+            onDrop={this.onExternalDrop}
+            addDocTab={this.props.addDocTab}
+            pinToPres={this.props.pinToPres}
+            isSelected={this.props.isSelected}
+            isFocused={this.isFocused}
+            setFocused={this.setFocused}
+            setPreviewDoc={this.setPreviewDoc}
+            deleteDocument={this.props.removeDocument}
+            addDocument={this.props.addDocument}
+            dataDoc={this.props.DataDoc}
+            columns={this.columns}
+            documentKeys={this.documentKeys}
+            headerIsEditing={this._headerIsEditing}
+            openHeader={this.openHeader}
+            onClick={this.onTableClick}
+            onPointerDown={emptyFunction}
+            onResizedChange={this.onResizedChange}
+            setColumns={this.setColumns}
+            reorderColumns={this.reorderColumns}
+            changeColumns={this.changeColumns}
+            setHeaderIsEditing={this.setHeaderIsEditing}
+            changeColumnSort={this.setColumnSort}
+        />;
+    }
+
+    @computed
+    public get schemaToolbar() {
+        return <div className="collectionSchemaView-toolbar">
+            <div className="collectionSchemaView-toolbar-item">
+                <div id="preview-schema-checkbox-div">
+                    <input type="checkbox" key={"Show Preview"} checked={this.previewWidth() !== 0} onChange={this.toggleExpander} />
+                    Show Preview
+                </div>
+            </div>
+        </div>;
+    }
+
+    onSpecificMenu = (e: React.MouseEvent) => {
+        if ((e.target as any)?.className?.includes?.("collectionSchemaView-cell") || (e.target instanceof HTMLSpanElement)) {
+            const cm = ContextMenu.Instance;
+            const options = cm.findByDescription("Options...");
+            const optionItems: ContextMenuProps[] = options && "subitems" in options ? options.subitems : [];
+            optionItems.push({ description: "remove", event: () => this._previewDoc && this.props.removeDocument?.(this._previewDoc), icon: "trash" });
+            !options && cm.addItem({ description: "Options...", subitems: optionItems, icon: "compass" });
+            cm.displayMenu(e.clientX, e.clientY);
+            (e.nativeEvent as any).SchemaHandled = true; // not sure why this is needed, but if you right-click quickly on a cell, the Document/Collection contextMenu handlers still fire without this.
+            e.stopPropagation();
+        }
+    }
+
+    @action
+    onTableClick = (e: React.MouseEvent): void => {
+        if (!(e.target as any)?.className?.includes?.("collectionSchemaView-cell") && !(e.target instanceof HTMLSpanElement)) {
+            this.setPreviewDoc(undefined);
+        } else {
+            e.stopPropagation();
+        }
+        this.setFocused(this.props.Document);
+        this.closeHeader();
+    }
+
+    onResizedChange = (newResized: Resize[], event: any) => {
+        const columns = this.columns;
+        newResized.forEach(resized => {
+            const index = columns.findIndex(c => c.heading === resized.id);
+            const column = columns[index];
+            column.setWidth(resized.value);
+            columns[index] = column;
+        });
+        this.columns = columns;
+    }
+
+    @action
+    setColumns = (columns: SchemaHeaderField[]) => this.columns = columns
+
+    @undoBatch
+    reorderColumns = (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => {
+        const columns = [...columnsValues];
+        const oldIndex = columns.indexOf(toMove);
+        const relIndex = columns.indexOf(relativeTo);
+        const newIndex = (oldIndex > relIndex && !before) ? relIndex + 1 : (oldIndex < relIndex && before) ? relIndex - 1 : relIndex;
+
+        if (oldIndex === newIndex) return;
+
+        columns.splice(newIndex, 0, columns.splice(oldIndex, 1)[0]);
+        this.columns = columns;
+    }
+
+    onZoomMenu = (e: React.WheelEvent) => this.props.isContentActive(true) && e.stopPropagation();
+
+    render() {
+        TraceMobx();
+        if (!this.props.isContentActive()) setTimeout(() => this.closeHeader(), 0);
+        const menuContent = this.renderMenuContent;
+        const menu = <div className="collectionSchema-header-menu"
+            onWheel={e => this.onZoomMenu(e)}
+            onPointerDown={e => this.onHeaderClick(e)}
+            style={{ transform: `translate(${(this.menuCoordinates[0])}px, ${(this.menuCoordinates[1])}px)` }}>
+            <Measure offset onResize={action((r: any) => {
+                const dim = this.props.ScreenToLocalTransform().inverse().transformDirection(r.offset.width, r.offset.height);
+                this._menuWidth = dim[0]; this._menuHeight = dim[1];
+            })}>
+                {({ measureRef }) => <div ref={measureRef}> {menuContent} </div>}
+            </Measure>
+        </div>;
+        return <div className={"collectionSchemaView" + (this.props.Document._searchDoc ? "-searchContainer" : "-container")}
+            style={{
+                overflow: this.props.scrollOverflow === true ? "scroll" : undefined, backgroundColor: "white",
+                pointerEvents: this.props.Document._searchDoc !== undefined && !this.props.isContentActive() && !SnappingManager.GetIsDragging() ? "none" : undefined,
+                width: name === "collectionSchemaView-searchContainer" ? "auto" : this.props.PanelWidth() || "100%", height: this.props.PanelHeight() || "100%", position: "relative",
+            }}  >
+            <div className="collectionSchemaView-tableContainer"
+                style={{ width: `calc(100% - ${this.previewWidth()}px)` }}
+                onContextMenu={this.onSpecificMenu}
+                onPointerDown={this.onPointerDown}
+                onWheel={e => this.props.isContentActive(true) && e.stopPropagation()}
+                onDrop={e => this.onExternalDrop(e, {})}
+                ref={this.createTarget}>
+                {this.schemaTable}
+            </div>
+            {this.dividerDragger}
+            {!this.previewWidth() ? (null) : this.previewPanel}
+            {this._headerOpen && this.props.isContentActive() ? menu : null}
+        </div>;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/collectionSchema/SchemaTable.tsx b/src/client/views/collections/collectionSchema/SchemaTable.tsx
new file mode 100644
index 000000000..0d5c9e077
--- /dev/null
+++ b/src/client/views/collections/collectionSchema/SchemaTable.tsx
@@ -0,0 +1,601 @@
+import React = require("react");
+import { IconProp } from '@fortawesome/fontawesome-svg-core';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { action, computed, observable } from "mobx";
+import { observer } from "mobx-react";
+import ReactTable, { CellInfo, Column, ComponentPropsGetterR, Resize, SortingRule } from "react-table";
+import "react-table/react-table.css";
+import { DateField } from "../../../../fields/DateField";
+import { AclPrivate, AclReadonly, DataSym, Doc, DocListCast, Field, Opt } from "../../../../fields/Doc";
+import { Id } from "../../../../fields/FieldSymbols";
+import { List } from "../../../../fields/List";
+import { listSpec } from "../../../../fields/Schema";
+import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { ComputedField } from "../../../../fields/ScriptField";
+import { Cast, FieldValue, NumCast, StrCast } from "../../../../fields/Types";
+import { ImageField } from "../../../../fields/URLField";
+import { GetEffectiveAcl } from "../../../../fields/util";
+import { emptyFunction, emptyPath, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue } from "../../../../Utils";
+import { Docs, DocumentOptions, DocUtils } from "../../../documents/Documents";
+import { DocumentType } from "../../../documents/DocumentTypes";
+import { CompileScript, Transformer, ts } from "../../../util/Scripting";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../globalCssVariables.scss';
+import { ContextMenu } from "../../ContextMenu";
+import '../../../views/DocumentDecorations.scss';
+import { DocumentView } from "../../nodes/DocumentView";
+import { DefaultStyleProvider } from "../../StyleProvider";
+import { CellProps, CollectionSchemaButtons, CollectionSchemaCell, CollectionSchemaCheckboxCell, CollectionSchemaDateCell, CollectionSchemaDocCell, CollectionSchemaImageCell, CollectionSchemaListCell, CollectionSchemaNumberCell, CollectionSchemaStringCell } from "./CollectionSchemaCells";
+import { CollectionSchemaAddColumnHeader, KeysDropdown } from "./CollectionSchemaHeaders";
+import { MovableColumn } from "./CollectionSchemaMovableColumn";
+import { MovableRow } from "./CollectionSchemaMovableRow";
+import "./CollectionSchemaView.scss";
+import { CollectionView } from "../CollectionView";
+
+
+enum ColumnType {
+    Any,
+    Number,
+    String,
+    Boolean,
+    Doc,
+    Image,
+    List,
+    Date
+}
+
+// this map should be used for keys that should have a const type of value
+const columnTypes: Map<string, ColumnType> = new Map([
+    ["title", ColumnType.String],
+    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
+    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
+    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
+]);
+
+export interface SchemaTableProps {
+    Document: Doc; // child doc
+    dataDoc?: Doc;
+    PanelHeight: () => number;
+    PanelWidth: () => number;
+    childDocs?: Doc[];
+    CollectionView: Opt<CollectionView>;
+    ContainingCollectionView: Opt<CollectionView>;
+    ContainingCollectionDoc: Opt<Doc>;
+    fieldKey: string;
+    renderDepth: number;
+    deleteDocument?: (document: Doc | Doc[]) => boolean;
+    addDocument?: (document: Doc | Doc[]) => boolean;
+    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (document: Doc | Doc[]) => boolean) => boolean;
+    ScreenToLocalTransform: () => Transform;
+    active: (outsideReaction: boolean | undefined) => boolean;
+    onDrop: (e: React.DragEvent<Element>, options: DocumentOptions, completed?: (() => void) | undefined) => void;
+    addDocTab: (document: Doc, where: string) => boolean;
+    pinToPres: (document: Doc) => void;
+    isSelected: (outsideReaction?: boolean) => boolean;
+    isFocused: (document: Doc, outsideReaction: boolean) => boolean;
+    setFocused: (document: Doc) => void;
+    setPreviewDoc: (document: Opt<Doc>) => void;
+    columns: SchemaHeaderField[];
+    documentKeys: any[];
+    headerIsEditing: boolean;
+    openHeader: (column: any, screenx: number, screeny: number) => void;
+    onClick: (e: React.MouseEvent) => void;
+    onPointerDown: (e: React.PointerEvent) => void;
+    onResizedChange: (newResized: Resize[], event: any) => void;
+    setColumns: (columns: SchemaHeaderField[]) => void;
+    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => void;
+    changeColumns: (oldKey: string, newKey: string, addNew: boolean) => void;
+    setHeaderIsEditing: (isEditing: boolean) => void;
+    changeColumnSort: (columnField: SchemaHeaderField, descending: boolean | undefined) => void;
+}
+
+@observer
+export class SchemaTable extends React.Component<SchemaTableProps> {
+    @observable _cellIsEditing: boolean = false;
+    @observable _focusedCell: { row: number, col: number } = { row: 0, col: 0 };
+    @observable _openCollections: Set<number> = new Set;
+
+    @observable _showDoc: Doc | undefined;
+    @observable _showDataDoc: any = "";
+    @observable _showDocPos: number[] = [];
+
+    @observable _showTitleDropdown: boolean = false;
+
+    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
+    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
+    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
+
+    @computed get childDocs() {
+        if (this.props.childDocs) return this.props.childDocs;
+
+        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
+        return DocListCast(doc[this.props.fieldKey]);
+    }
+    set childDocs(docs: Doc[]) {
+        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
+        doc[this.props.fieldKey] = new List<Doc>(docs);
+    }
+
+    @computed get textWrappedRows() {
+        return Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
+    }
+    set textWrappedRows(textWrappedRows: string[]) {
+        this.props.Document.textwrappedSchemaRows = new List<string>(textWrappedRows);
+    }
+
+    @computed get resized(): { id: string, value: number }[] {
+        return this.props.columns.reduce((resized, shf) => {
+            (shf.width > -1) && resized.push({ id: shf.heading, value: shf.width });
+            return resized;
+        }, [] as { id: string, value: number }[]);
+    }
+    @computed get sorted(): SortingRule[] {
+        return this.props.columns.reduce((sorted, shf) => {
+            shf.desc !== undefined && sorted.push({ id: shf.heading, desc: shf.desc });
+            return sorted;
+        }, [] as SortingRule[]);
+    }
+
+    @action
+    changeSorting = (col: any) => {
+        this.props.changeColumnSort(col, col.desc === true ? false : col.desc === false ? undefined : true);
+    }
+
+    @action
+    changeTitleMode = () => this._showTitleDropdown = !this._showTitleDropdown
+
+    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
+    @computed get tableColumns(): Column<Doc>[] {
+        const possibleKeys = this.props.documentKeys.filter(key => this.props.columns.findIndex(existingKey => existingKey.heading.toUpperCase() === key.toUpperCase()) === -1);
+        const columns: Column<Doc>[] = [];
+        const tableIsFocused = this.props.isFocused(this.props.Document, false);
+        const focusedRow = this._focusedCell.row;
+        const focusedCol = this._focusedCell.col;
+        const isEditable = !this.props.headerIsEditing;
+
+        columns.push({
+            expander: true, Header: "", width: 58,
+            Expander: (rowInfo) => {
+                return rowInfo.original.type !== DocumentType.COL ? (null) :
+                    <div className="collectionSchemaView-expander" onClick={action(() => (this._openCollections[rowInfo.isExpanded ? "delete" : "add"])(rowInfo.viewIndex))}>
+                        <FontAwesomeIcon icon={rowInfo.isExpanded ? "caret-down" : "caret-right"} size="lg" />
+                    </div>;
+            }
+        });
+        columns.push(...this.props.columns.map(col => {
+            const icon: IconProp = this.getColumnType(col) === ColumnType.Number ? "hashtag" : this.getColumnType(col) === ColumnType.String ? "font" :
+                this.getColumnType(col) === ColumnType.Boolean ? "check-square" : this.getColumnType(col) === ColumnType.Doc ? "file" :
+                    this.getColumnType(col) === ColumnType.Image ? "image" : this.getColumnType(col) === ColumnType.List ? "list-ul" :
+                        this.getColumnType(col) === ColumnType.Date ? "calendar" : "align-justify";
+
+            const keysDropdown = <KeysDropdown
+                keyValue={col.heading}
+                possibleKeys={possibleKeys}
+                existingKeys={this.props.columns.map(c => c.heading)}
+                canAddNew={true}
+                addNew={false}
+                onSelect={this.props.changeColumns}
+                setIsEditing={this.props.setHeaderIsEditing}
+                docs={this.props.childDocs}
+                Document={this.props.Document}
+                dataDoc={this.props.dataDoc}
+                fieldKey={this.props.fieldKey}
+                ContainingCollectionDoc={this.props.ContainingCollectionDoc}
+                ContainingCollectionView={this.props.ContainingCollectionView}
+                active={this.props.active}
+                openHeader={this.props.openHeader}
+                icon={icon}
+                col={col}
+                // try commenting this out
+                width={"100%"}
+            />;
+
+            const sortIcon = col.desc === undefined ? "caret-right" : col.desc === true ? "caret-down" : "caret-up";
+            const header = <div className="collectionSchemaView-menuOptions-wrapper" style={{ background: col.color, padding: "2px", display: "flex", cursor: "default", height: "100%", }}>
+                {keysDropdown}
+                <div onClick={e => this.changeSorting(col)} style={{ width: 21, padding: 1, display: "inline", zIndex: 1, background: "inherit", cursor: "hand" }}>
+                    <FontAwesomeIcon icon={sortIcon} size="lg" />
+                </div>
+            </div>;
+
+            return {
+                Header: <MovableColumn columnRenderer={header} columnValue={col} allColumns={this.props.columns} reorderColumns={this.props.reorderColumns} ScreenToLocalTransform={this.props.ScreenToLocalTransform} />,
+                accessor: (doc: Doc) => doc ? Field.toString(doc[col.heading] as Field) : 0,
+                id: col.heading,
+                Cell: (rowProps: CellInfo) => {
+                    const rowIndex = rowProps.index;
+                    const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
+                    const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
+
+                    const props: CellProps = {
+                        row: rowIndex,
+                        col: columnIndex,
+                        rowProps: rowProps,
+                        isFocused: isFocused,
+                        changeFocusedCellByIndex: this.changeFocusedCellByIndex,
+                        CollectionView: this.props.CollectionView,
+                        ContainingCollection: this.props.ContainingCollectionView,
+                        Document: this.props.Document,
+                        fieldKey: this.props.fieldKey,
+                        renderDepth: this.props.renderDepth,
+                        addDocTab: this.props.addDocTab,
+                        pinToPres: this.props.pinToPres,
+                        moveDocument: this.props.moveDocument,
+                        setIsEditing: this.setCellIsEditing,
+                        isEditable: isEditable,
+                        setPreviewDoc: this.props.setPreviewDoc,
+                        setComputed: this.setComputed,
+                        getField: this.getField,
+                        showDoc: this.showDoc,
+                    };
+
+
+                    switch (this.getColumnType(col, rowProps.original, rowProps.column.id)) {
+                        case ColumnType.Number: return <CollectionSchemaNumberCell {...props} />;
+                        case ColumnType.String: return <CollectionSchemaStringCell {...props} />;
+                        case ColumnType.Boolean: return <CollectionSchemaCheckboxCell {...props} />;
+                        case ColumnType.Doc: return <CollectionSchemaDocCell {...props} />;
+                        case ColumnType.Image: return <CollectionSchemaImageCell {...props} />;
+                        case ColumnType.List: return <CollectionSchemaListCell {...props} />;
+                        case ColumnType.Date: return <CollectionSchemaDateCell {...props} />;
+                        default:
+                            return <CollectionSchemaCell {...props} />;
+                    }
+                },
+                minWidth: 200,
+            };
+        }));
+        columns.push({
+            Header: <CollectionSchemaAddColumnHeader createColumn={this.createColumn} />,
+            accessor: (doc: Doc) => 0,
+            id: "add",
+            Cell: (rowProps: CellInfo) => {
+                const rowIndex = rowProps.index;
+                const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
+                const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
+                return <CollectionSchemaButtons  {...{
+                    row: rowProps.index,
+                    col: columnIndex,
+                    rowProps: rowProps,
+                    isFocused: isFocused,
+                    changeFocusedCellByIndex: this.changeFocusedCellByIndex,
+                    CollectionView: this.props.CollectionView,
+                    ContainingCollection: this.props.ContainingCollectionView,
+                    Document: this.props.Document,
+                    fieldKey: this.props.fieldKey,
+                    renderDepth: this.props.renderDepth,
+                    addDocTab: this.props.addDocTab,
+                    pinToPres: this.props.pinToPres,
+                    moveDocument: this.props.moveDocument,
+                    setIsEditing: this.setCellIsEditing,
+                    isEditable: isEditable,
+                    setPreviewDoc: this.props.setPreviewDoc,
+                    setComputed: this.setComputed,
+                    getField: this.getField,
+                    showDoc: this.showDoc,
+                }} />;
+            },
+            width: 28,
+            resizable: false
+        });
+        return columns;
+    }
+
+
+    constructor(props: SchemaTableProps) {
+        super(props);
+        if (this.props.Document._schemaHeaders === undefined) {
+            this.props.Document._schemaHeaders = new List<SchemaHeaderField>([new SchemaHeaderField("title", "#f1efeb"), new SchemaHeaderField("author", "#f1efeb"), new SchemaHeaderField("*lastModified", "#f1efeb", ColumnType.Date),
+            new SchemaHeaderField("text", "#f1efeb", ColumnType.String), new SchemaHeaderField("type", "#f1efeb"), new SchemaHeaderField("context", "#f1efeb", ColumnType.Doc)]);
+        }
+    }
+
+    componentDidMount() {
+        document.addEventListener("keydown", this.onKeyDown);
+    }
+
+    componentWillUnmount() {
+        document.removeEventListener("keydown", this.onKeyDown);
+    }
+
+    tableAddDoc = (doc: Doc, relativeTo?: Doc, before?: boolean) => {
+        const tableDoc = this.props.Document[DataSym];
+        const effectiveAcl = GetEffectiveAcl(tableDoc);
+
+        if (effectiveAcl !== AclPrivate && effectiveAcl !== AclReadonly) {
+            doc.context = this.props.Document;
+            tableDoc[this.props.fieldKey + "-lastModified"] = new DateField(new Date(Date.now()));
+            return Doc.AddDocToList(this.props.Document, this.props.fieldKey, doc, relativeTo, before);
+        }
+        return false;
+    }
+
+    private getTrProps: ComponentPropsGetterR = (state, rowInfo) => {
+        return !rowInfo ? {} : {
+            ScreenToLocalTransform: this.props.ScreenToLocalTransform,
+            addDoc: this.tableAddDoc,
+            removeDoc: this.props.deleteDocument,
+            rowInfo,
+            rowFocused: !this.props.headerIsEditing && rowInfo.index === this._focusedCell.row && this.props.isFocused(this.props.Document, true),
+            textWrapRow: this.toggleTextWrapRow,
+            rowWrapped: this.textWrappedRows.findIndex(id => rowInfo.original[Id] === id) > -1,
+            dropAction: StrCast(this.props.Document.childDropAction),
+            addDocTab: this.props.addDocTab
+        };
+    }
+
+    private getTdProps: ComponentPropsGetterR = (state, rowInfo, column, instance) => {
+        if (!rowInfo || column) return {};
+
+        const row = rowInfo.index;
+        //@ts-ignore
+        const col = this.columns.map(c => c.heading).indexOf(column!.id);
+        const isFocused = this._focusedCell.row === row && this._focusedCell.col === col && this.props.isFocused(this.props.Document, true);
+        // TODO: editing border doesn't work :(
+        return {
+            style: { border: !this.props.headerIsEditing && isFocused ? "2px solid rgb(255, 160, 160)" : "1px solid #f1efeb" }
+        };
+    }
+
+    @action setCellIsEditing = (isEditing: boolean) => this._cellIsEditing = isEditing;
+
+    @action
+    onKeyDown = (e: KeyboardEvent): void => {
+        if (!this._cellIsEditing && !this.props.headerIsEditing && this.props.isFocused(this.props.Document, true)) {// && this.props.isSelected(true)) {
+            const direction = e.key === "Tab" ? "tab" : e.which === 39 ? "right" : e.which === 37 ? "left" : e.which === 38 ? "up" : e.which === 40 ? "down" : "";
+            this._focusedCell = this.changeFocusedCellByDirection(direction, this._focusedCell.row, this._focusedCell.col);
+
+            if (direction) {
+                const pdoc = FieldValue(this.childDocs[this._focusedCell.row]);
+                pdoc && this.props.setPreviewDoc(pdoc);
+                e.stopPropagation();
+            }
+        } else if (e.keyCode === 27) {
+            this.props.setPreviewDoc(undefined);
+            e.stopPropagation(); // stopPropagation for left/right arrows 
+        }
+    }
+
+    changeFocusedCellByDirection = (direction: string, curRow: number, curCol: number) => {
+        switch (direction) {
+            case "tab": return { row: (curRow + 1 === this.childDocs.length ? 0 : curRow + 1), col: curCol + 1 === this.props.columns.length ? 0 : curCol + 1 };
+            case "right": return { row: curRow, col: curCol + 1 === this.props.columns.length ? curCol : curCol + 1 };
+            case "left": return { row: curRow, col: curCol === 0 ? curCol : curCol - 1 };
+            case "up": return { row: curRow === 0 ? curRow : curRow - 1, col: curCol };
+            case "down": return { row: curRow + 1 === this.childDocs.length ? curRow : curRow + 1, col: curCol };
+        }
+        return this._focusedCell;
+    }
+
+    @action
+    changeFocusedCellByIndex = (row: number, col: number): void => {
+        if (this._focusedCell.row !== row || this._focusedCell.col !== col) {
+            this._focusedCell = { row: row, col: col };
+        }
+        this.props.setFocused(this.props.Document);
+    }
+
+    @undoBatch
+    createRow = action(() => {
+        this.props.addDocument?.(Docs.Create.TextDocument("", { title: "", _width: 100, _height: 30 }));
+        this._focusedCell = { row: this.childDocs.length, col: this._focusedCell.col };
+    });
+
+    @undoBatch
+    @action
+    createColumn = () => {
+        let index = 0;
+        let found = this.props.columns.findIndex(col => col.heading.toUpperCase() === "New field".toUpperCase()) > -1;
+        while (found) {
+            index++;
+            found = this.props.columns.findIndex(col => col.heading.toUpperCase() === ("New field (" + index + ")").toUpperCase()) > -1;
+        }
+        this.props.columns.push(new SchemaHeaderField(`New field ${index ? "(" + index + ")" : ""}`, "#f1efeb"));
+    }
+
+    @action
+    getColumnType = (column: SchemaHeaderField, doc?: Doc, field?: string): ColumnType => {
+        if (doc && field && column.type === ColumnType.Any) {
+            const val = doc[CollectionSchemaCell.resolvedFieldKey(field, doc)];
+            if (val instanceof ImageField) return ColumnType.Image;
+            if (val instanceof Doc) return ColumnType.Doc;
+            if (val instanceof DateField) return ColumnType.Date;
+            if (val instanceof List) return ColumnType.List;
+        }
+        if (column.type && column.type !== 0) {
+            return column.type;
+        }
+        if (columnTypes.get(column.heading)) {
+            return column.type = columnTypes.get(column.heading)!;
+        }
+        return column.type = ColumnType.Any;
+    }
+
+    @undoBatch
+    @action
+    toggleTextwrap = async () => {
+        const textwrappedRows = Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
+        if (textwrappedRows.length) {
+            this.props.Document.textwrappedSchemaRows = new List<string>([]);
+        } else {
+            const docs = DocListCast(this.props.Document[this.props.fieldKey]);
+            const allRows = docs instanceof Doc ? [docs[Id]] : docs.map(doc => doc[Id]);
+            this.props.Document.textwrappedSchemaRows = new List<string>(allRows);
+        }
+    }
+
+    @action
+    toggleTextWrapRow = (doc: Doc): void => {
+        const textWrapped = this.textWrappedRows;
+        const index = textWrapped.findIndex(id => doc[Id] === id);
+
+        index > -1 ? textWrapped.splice(index, 1) : textWrapped.push(doc[Id]);
+
+        this.textWrappedRows = textWrapped;
+    }
+
+    @computed
+    get reactTable() {
+        const children = this.childDocs;
+        const hasCollectionChild = children.reduce((found, doc) => found || doc.type === DocumentType.COL, false);
+        const expanded: { [name: string]: any } = {};
+        Array.from(this._openCollections.keys()).map(col => expanded[col.toString()] = true);
+        const rerender = [...this.textWrappedRows]; // TODO: get component to rerender on text wrap change without needign to console.log :((((
+
+        return <ReactTable
+            style={{ position: "relative" }}
+            data={children}
+            page={0}
+            pageSize={children.length}
+            showPagination={false}
+            columns={this.tableColumns}
+            getTrProps={this.getTrProps}
+            getTdProps={this.getTdProps}
+            sortable={false}
+            TrComponent={MovableRow}
+            sorted={this.sorted}
+            expanded={expanded}
+            resized={this.resized}
+            onResizedChange={this.props.onResizedChange}
+            // if it has a child, render another table with the children
+            SubComponent={!hasCollectionChild ? undefined : row => (row.original.type !== DocumentType.COL) ? (null) :
+                <div style={{ paddingLeft: 57 + "px" }} className="reactTable-sub"><SchemaTable {...this.props} Document={row.original} dataDoc={undefined} childDocs={undefined} /></div>}
+
+        />;
+    }
+
+    onContextMenu = (e: React.MouseEvent): void => {
+        ContextMenu.Instance.addItem({ description: "Toggle text wrapping", event: this.toggleTextwrap, icon: "table" });
+    }
+
+    getField = (row: number, col?: number) => {
+        const docs = this.childDocs;
+
+        row = row % docs.length;
+        while (row < 0) row += docs.length;
+        const columns = this.props.columns;
+        const doc = docs[row];
+        if (col === undefined) {
+            return doc;
+        }
+        if (col >= 0 && col < columns.length) {
+            const column = this.props.columns[col].heading;
+            return doc[column];
+        }
+        return undefined;
+    }
+
+    createTransformer = (row: number, col: number): Transformer => {
+        const self = this;
+        const captures: { [name: string]: Field } = {};
+
+        const transformer: ts.TransformerFactory<ts.SourceFile> = context => {
+            return root => {
+                function visit(node: ts.Node) {
+                    node = ts.visitEachChild(node, visit, context);
+                    if (ts.isIdentifier(node)) {
+                        const isntPropAccess = !ts.isPropertyAccessExpression(node.parent) || node.parent.expression === node;
+                        const isntPropAssign = !ts.isPropertyAssignment(node.parent) || node.parent.name !== node;
+                        if (isntPropAccess && isntPropAssign) {
+                            if (node.text === "$r") {
+                                return ts.createNumericLiteral(row.toString());
+                            } else if (node.text === "$c") {
+                                return ts.createNumericLiteral(col.toString());
+                            } else if (node.text === "$") {
+                                if (ts.isCallExpression(node.parent)) {
+                                    // captures.doc = self.props.Document;
+                                    // captures.key = self.props.fieldKey;
+                                }
+                            }
+                        }
+                    }
+
+                    return node;
+                }
+                return ts.visitNode(root, visit);
+            };
+        };
+
+        // const getVars = () => {
+        //     return { capturedVariables: captures };
+        // };
+
+        return { transformer, /*getVars*/ };
+    }
+
+    setComputed = (script: string, doc: Doc, field: string, row: number, col: number): boolean => {
+        script =
+            `const $ = (row:number, col?:number) => {
+                const rval = (doc as any)[key][row + ${row}];
+                return col === undefined ? rval : rval[(doc as any)._schemaHeaders[col + ${col}].heading];
+            }
+            return ${script}`;
+        const compiled = CompileScript(script, { params: { this: Doc.name }, capturedVariables: { doc: this.props.Document, key: this.props.fieldKey }, typecheck: false, transformer: this.createTransformer(row, col) });
+        if (compiled.compiled) {
+            doc[field] = new ComputedField(compiled);
+            return true;
+        }
+        return false;
+    }
+
+    @action
+    showDoc = (doc: Doc | undefined, dataDoc?: Doc, screenX?: number, screenY?: number) => {
+        this._showDoc = doc;
+        if (dataDoc && screenX && screenY) {
+            this._showDocPos = this.props.ScreenToLocalTransform().transformPoint(screenX, screenY);
+        }
+    }
+
+    onOpenClick = () => {
+        this._showDoc && this.props.addDocTab(this._showDoc, "add:right");
+    }
+
+    getPreviewTransform = (): Transform => {
+        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - 4 - this.tableWidth, - this.borderWidth);
+    }
+
+    render() {
+        const preview = "";
+        return <div className="collectionSchemaView-table"
+            onPointerDown={this.props.onPointerDown} onClick={this.props.onClick} onWheel={e => this.props.active(true) && e.stopPropagation()}
+            onDrop={e => this.props.onDrop(e, {})} onContextMenu={this.onContextMenu} >
+            {this.reactTable}
+            {this.props.Document._chromeHidden ? undefined : <div className="collectionSchemaView-addRow" onClick={this.createRow}>+ new</div>}
+            {!this._showDoc ? (null) :
+                <div className="collectionSchemaView-documentPreview" ref="overlay"
+                    style={{
+                        position: "absolute", width: 150, height: 150,
+                        background: "dimGray", display: "block", top: 0, left: 0,
+                        transform: `translate(${this._showDocPos[0]}px, ${this._showDocPos[1] - 180}px)`
+                    }} >
+                    <DocumentView
+                        Document={this._showDoc}
+                        DataDoc={this._showDataDoc}
+                        styleProvider={DefaultStyleProvider}
+                        layerProvider={undefined}
+                        docViewPath={returnEmptyDoclist}
+                        freezeDimensions={true}
+                        focus={DocUtils.DefaultFocus}
+                        renderDepth={this.props.renderDepth}
+                        rootSelected={returnFalse}
+                        isContentActive={returnTrue}
+                        isDocumentActive={returnFalse}
+                        PanelWidth={() => 150}
+                        PanelHeight={() => 150}
+                        ScreenToLocalTransform={this.getPreviewTransform}
+                        docFilters={returnEmptyFilter}
+                        docRangeFilters={returnEmptyFilter}
+                        searchFilterDocs={returnEmptyDoclist}
+                        ContainingCollectionDoc={this.props.CollectionView?.props.Document}
+                        ContainingCollectionView={this.props.CollectionView}
+                        moveDocument={this.props.moveDocument}
+                        whenChildContentsActiveChanged={emptyFunction}
+                        addDocTab={this.props.addDocTab}
+                        pinToPres={this.props.pinToPres}
+                        bringToFront={returnFalse}>
+                    </DocumentView>
+                </div>}
+        </div>;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaCells.tsx b/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
deleted file mode 100644
index f75179cea..000000000
--- a/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
+++ /dev/null
@@ -1,585 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action, computed, observable } from "mobx";
-import { observer } from "mobx-react";
-import DatePicker from "react-datepicker";
-import "react-datepicker/dist/react-datepicker.css";
-import { CellInfo } from "react-table";
-import "react-table/react-table.css";
-import { DateField } from "../../../../fields/DateField";
-import { Doc, DocListCast, Field, Opt } from "../../../../fields/Doc";
-import { Id } from "../../../../fields/FieldSymbols";
-import { List } from "../../../../fields/List";
-import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
-import { ComputedField } from "../../../../fields/ScriptField";
-import { BoolCast, Cast, DateCast, FieldValue, NumCast, StrCast } from "../../../../fields/Types";
-import { ImageField } from "../../../../fields/URLField";
-import { Utils, emptyFunction } from "../../../../Utils";
-import { Docs } from "../../../documents/Documents";
-import { DocumentType } from "../../../documents/DocumentTypes";
-import { DocumentManager } from "../../../util/DocumentManager";
-import { DragManager } from "../../../util/DragManager";
-import { KeyCodes } from "../../../util/KeyCodes";
-import { CompileScript } from "../../../util/Scripting";
-import { SearchUtil } from "../../../util/SearchUtil";
-import { SnappingManager } from "../../../util/SnappingManager";
-import { undoBatch } from "../../../util/UndoManager";
-import '../../../views/DocumentDecorations.scss';
-import { EditableView } from "../../EditableView";
-import { MAX_ROW_HEIGHT } from '../../globalCssVariables.scss';
-import { DocumentIconContainer } from "../../nodes/DocumentIcon";
-import { OverlayView } from "../../OverlayView";
-import "./CollectionSchemaView.scss";
-import { CollectionView } from "../CollectionView";
-const path = require('path');
-
-// intialize cell properties
-export interface CellProps {
-    row: number;
-    col: number;
-    rowProps: CellInfo;
-    CollectionView: Opt<CollectionView>;
-    ContainingCollection: Opt<CollectionView>;
-    Document: Doc;
-    fieldKey: string;
-    renderDepth: number;
-    addDocTab: (document: Doc, where: string) => boolean;
-    pinToPres: (document: Doc) => void;
-    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined,
-        addDocument: (document: Doc | Doc[]) => boolean) => boolean;
-    isFocused: boolean;
-    changeFocusedCellByIndex: (row: number, col: number) => void;
-    setIsEditing: (isEditing: boolean) => void;
-    isEditable: boolean;
-    setPreviewDoc: (doc: Doc) => void;
-    setComputed: (script: string, doc: Doc, field: string, row: number, col: number) => boolean;
-    getField: (row: number, col?: number) => void;
-    showDoc: (doc: Doc | undefined, dataDoc?: any, screenX?: number, screenY?: number) => void;
-}
-
-@observer
-export class CollectionSchemaCell extends React.Component<CellProps> {
-    public static resolvedFieldKey(column: string, rowDoc: Doc) {
-        const fieldKey = column;
-        if (fieldKey.startsWith("*")) {
-            const rootKey = fieldKey.substring(1);
-            const allKeys = [...Array.from(Object.keys(rowDoc)), ...Array.from(Object.keys(Doc.GetProto(rowDoc)))];
-            const matchedKeys = allKeys.filter(key => key.includes(rootKey));
-            if (matchedKeys.length) return matchedKeys[0];
-        }
-        return fieldKey;
-    }
-    @observable protected _isEditing: boolean = false;
-    protected _focusRef = React.createRef<HTMLDivElement>();
-    protected _rowDoc = this.props.rowProps.original;
-    protected _rowDataDoc = Doc.GetProto(this.props.rowProps.original);
-    protected _dropDisposer?: DragManager.DragDropDisposer;
-    @observable contents: string = "";
-
-    componentDidMount() { document.addEventListener("keydown", this.onKeyDown); }
-    componentWillUnmount() { document.removeEventListener("keydown", this.onKeyDown); }
-
-    @action
-    onKeyDown = (e: KeyboardEvent): void => {
-        if (this.props.isFocused && this.props.isEditable && e.keyCode === KeyCodes.ENTER) {
-            document.removeEventListener("keydown", this.onKeyDown);
-            this._isEditing = true;
-            this.props.setIsEditing(true);
-        }
-    }
-
-    @action
-    isEditingCallback = (isEditing: boolean): void => {
-        document.removeEventListener("keydown", this.onKeyDown);
-        isEditing && document.addEventListener("keydown", this.onKeyDown);
-        this._isEditing = isEditing;
-        this.props.setIsEditing(isEditing);
-        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
-    }
-
-    @action
-    onPointerDown = async (e: React.PointerEvent): Promise<void> => {
-        this.onItemDown(e);
-        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
-        this.props.setPreviewDoc(this.props.rowProps.original);
-
-        let url: string;
-        if (url = StrCast(this.props.rowProps.row.href)) {
-            try {
-                new URL(url);
-                const temp = window.open(url)!;
-                temp.blur();
-                window.focus();
-            } catch { }
-        }
-
-        const doc = Cast(this._rowDoc[this.renderFieldKey], Doc, null);
-        doc && this.props.setPreviewDoc(doc);
-    }
-
-    @undoBatch
-    applyToDoc = (doc: Doc, row: number, col: number, run: (args?: { [name: string]: any }) => any) => {
-        const res = run({ this: doc, $r: row, $c: col, $: (r: number = 0, c: number = 0) => this.props.getField(r + row, c + col) });
-        if (!res.success) return false;
-        doc[this.renderFieldKey] = res.result;
-        return true;
-    }
-
-    private drop = (e: Event, de: DragManager.DropEvent) => {
-        if (de.complete.docDragData) {
-            if (de.complete.docDragData.draggedDocuments.length === 1) {
-                this._rowDataDoc[this.renderFieldKey] = de.complete.docDragData.draggedDocuments[0];
-            }
-            else {
-                const coll = Docs.Create.SchemaDocument([new SchemaHeaderField("title", "#f1efeb")], de.complete.docDragData.draggedDocuments, {});
-                this._rowDataDoc[this.renderFieldKey] = coll;
-            }
-            e.stopPropagation();
-        }
-    }
-
-    protected dropRef = (ele: HTMLElement | null) => {
-        this._dropDisposer?.();
-        ele && (this._dropDisposer = DragManager.MakeDropTarget(ele, this.drop.bind(this)));
-    }
-
-    returnHighlights(contents: string, positions?: number[]) {
-        if (positions) {
-            const results = [];
-            StrCast(this.props.Document._searchString);
-            const length = StrCast(this.props.Document._searchString).length;
-            const color = contents ? "black" : "grey";
-
-            results.push(<span key="-1" style={{ color }}>{contents?.slice(0, positions[0])}</span>);
-            positions.forEach((num, cur) => {
-                results.push(<span key={"start" + cur} style={{ backgroundColor: "#FFFF00", color }}>{contents?.slice(num, num + length)}</span>);
-                let end = 0;
-                cur === positions.length - 1 ? end = contents.length : end = positions[cur + 1];
-                results.push(<span key={"end" + cur} style={{ color }}>{contents?.slice(num + length, end)}</span>);
-            }
-            );
-            return results;
-        }
-        return <span style={{ color: contents ? "black" : "grey" }}>{contents ? contents?.valueOf() : "undefined"}</span>;
-    }
-
-    @computed get renderFieldKey() { return CollectionSchemaCell.resolvedFieldKey(this.props.rowProps.column.id!, this.props.rowProps.original); }
-    onItemDown = async (e: React.PointerEvent) => {
-        if (this.props.Document._searchDoc) {
-            const aliasdoc = await SearchUtil.GetAliasesOfDocument(this._rowDataDoc);
-            const targetContext = aliasdoc.length <= 0 ? undefined : Cast(aliasdoc[0].context, Doc, null);
-            DocumentManager.Instance.jumpToDocument(this._rowDoc, false, emptyFunction, targetContext,
-                undefined, undefined, undefined, () => this.props.setPreviewDoc(this._rowDoc));
-        }
-    }
-    renderCellWithType(type: string | undefined) {
-        const dragRef: React.RefObject<HTMLDivElement> = React.createRef();
-
-        const fieldKey = this.renderFieldKey;
-        const field = this._rowDoc[fieldKey];
-
-        const onPointerEnter = (e: React.PointerEvent): void => {
-            if (e.buttons === 1 && SnappingManager.GetIsDragging() && (type === "document" || type === undefined)) {
-                dragRef.current!.className = "collectionSchemaView-cellContainer doc-drag-over";
-            }
-        };
-        const onPointerLeave = (e: React.PointerEvent): void => {
-            dragRef.current!.className = "collectionSchemaView-cellContainer";
-        };
-
-        let contents = Field.toString(field as Field);
-        contents = contents === "" ? "--" : contents;
-
-        let className = "collectionSchemaView-cellWrapper";
-        if (this._isEditing) className += " editing";
-        if (this.props.isFocused && this.props.isEditable) className += " focused";
-        if (this.props.isFocused && !this.props.isEditable) className += " inactive";
-
-        const positions = [];
-        if (StrCast(this.props.Document._searchString).toLowerCase() !== "") {
-            let term = (field instanceof Promise) ? "...promise pending..." : contents.toLowerCase();
-            const search = StrCast(this.props.Document._searchString).toLowerCase();
-            let start = term.indexOf(search);
-            let tally = 0;
-            if (start !== -1) {
-                positions.push(start);
-            }
-            while (start < contents?.length && start !== -1) {
-                term = term.slice(start + search.length + 1);
-                tally += start + search.length + 1;
-                start = term.indexOf(search);
-                positions.push(tally + start);
-            }
-            if (positions.length > 1) {
-                positions.pop();
-            }
-        }
-        const placeholder = type === "number" ? "0" : contents === "" ? "--" : "undefined";
-        return (
-            <div className="collectionSchemaView-cellContainer" style={{ cursor: field instanceof Doc ? "grab" : "auto" }}
-                ref={dragRef} onPointerDown={this.onPointerDown} onClick={action(e => this._isEditing = true)} onPointerEnter={onPointerEnter} onPointerLeave={onPointerLeave}>
-                <div className={className} ref={this._focusRef} tabIndex={-1}>
-                    <div className="collectionSchemaView-cellContents" ref={type === undefined || type === "document" ? this.dropRef : null}>
-                        {!this.props.Document._searchDoc ?
-                            <EditableView
-                                editing={this._isEditing}
-                                isEditingCallback={this.isEditingCallback}
-                                display={"inline"}
-                                contents={contents}
-                                height={"auto"}
-                                maxHeight={Number(MAX_ROW_HEIGHT)}
-                                placeholder={placeholder}
-                                GetValue={() => {
-                                    const cfield = ComputedField.WithoutComputed(() => FieldValue(field));
-                                    const cscript = cfield instanceof ComputedField ? cfield.script.originalScript : undefined;
-                                    const cfinalScript = cscript?.split("return")[cscript.split("return").length - 1];
-                                    return cscript ? (cfinalScript?.endsWith(";") ? `:=${cfinalScript?.substring(0, cfinalScript.length - 2)}` : cfinalScript) :
-                                        Field.IsField(cfield) ? Field.toScriptString(cfield) : "";
-                                }}
-                                SetValue={action((value: string) => {
-                                    // sets what is displayed after the user makes an input
-                                    let retVal = false;
-                                    if (value.startsWith(":=") || value.startsWith("=:=")) {
-                                        // decides how to compute a value when given either of the above strings
-                                        const script = value.substring(value.startsWith("=:=") ? 3 : 2);
-                                        retVal = this.props.setComputed(script, value.startsWith(":=") ? this._rowDataDoc : this._rowDoc, this.renderFieldKey, this.props.row, this.props.col);
-                                    } else {
-                                        // check if the input is a number
-                                        let inputIsNum = true;
-                                        for (let s of value) {
-                                            if (isNaN(parseInt(s)) && !(s == ".") && !(s == ",")) {
-                                                inputIsNum = false;
-                                            }
-                                        }
-                                        // check if the input is a boolean
-                                        let inputIsBool: boolean = value == "false" || value == "true";
-                                        // what to do in the case 
-                                        if (!inputIsNum && !inputIsBool && !value.startsWith("=")) {
-                                            // if it's not a number, it's a string, and should be processed as such
-                                            // strips the string of quotes when it is edited to prevent quotes form being added to the text automatically 
-                                            // after each edit
-                                            let valueSansQuotes = value;
-                                            if (this._isEditing) {
-                                                const vsqLength = valueSansQuotes.length;
-                                                // get rid of outer quotes
-                                                valueSansQuotes = valueSansQuotes.substring(value.startsWith("\"") ? 1 : 0,
-                                                    valueSansQuotes.charAt(vsqLength - 1) == "\"" ? vsqLength - 1 : vsqLength);
-                                            }
-                                            let inputAsString = '"';
-                                            // escape any quotes in the string
-                                            for (const i of valueSansQuotes) {
-                                                if (i == '"') {
-                                                    inputAsString += '\\"';
-                                                } else {
-                                                    inputAsString += i;
-                                                }
-                                            }
-                                            // add a closing quote
-                                            inputAsString += '"';
-                                            //two options here: we can strip off outer quotes or we can figure out what's going on with the script
-                                            const script = CompileScript(inputAsString, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            const changeMade = inputAsString.length !== value.length || inputAsString.length - 2 !== value.length
-                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
-                                            // handle numbers and expressions
-                                        } else if (inputIsNum || value.startsWith("=")) {
-                                            //TODO: make accept numbers
-                                            const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
-                                            // if commas are not stripped, the parser only considers the numbers after the last comma
-                                            let inputSansCommas = "";
-                                            for (let s of inputscript) {
-                                                if (!(s == ",")) {
-                                                    inputSansCommas += s;
-                                                }
-                                            }
-                                            const script = CompileScript(inputSansCommas, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
-                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
-                                            // handle booleans
-                                        } else if (inputIsBool) {
-                                            const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
-                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
-                                        }
-                                    }
-                                    if (retVal) {
-                                        this._isEditing = false; // need to set this here. otherwise, the assignment of the field will invalidate & cause render() to be called with the wrong value for 'editing'
-                                        this.props.setIsEditing(false);
-                                    }
-                                    return retVal;
-                                })}
-                                OnFillDown={async (value: string) => {
-                                    const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                    script.compiled && DocListCast(this.props.Document[this.props.fieldKey]).
-                                        forEach((doc, i) => value.startsWith(":=") ?
-                                            this.props.setComputed(value.substring(2), Doc.GetProto(doc), this.renderFieldKey, i, this.props.col) :
-                                            this.applyToDoc(Doc.GetProto(doc), i, this.props.col, script.run));
-                                }}
-                            />
-                            :
-                            this.returnHighlights(contents, positions)
-                        }
-                    </div >
-                </div>
-            </div>
-        );
-    }
-
-    render() { return this.renderCellWithType(undefined); }
-}
-
-@observer
-export class CollectionSchemaNumberCell extends CollectionSchemaCell { render() { return this.renderCellWithType("number"); } }
-
-@observer
-export class CollectionSchemaBooleanCell extends CollectionSchemaCell { render() { return this.renderCellWithType("boolean"); } }
-
-@observer
-export class CollectionSchemaStringCell extends CollectionSchemaCell { render() { return this.renderCellWithType("string"); } }
-
-@observer
-export class CollectionSchemaDateCell extends CollectionSchemaCell {
-    @computed get _date(): Opt<DateField> { return this._rowDoc[this.renderFieldKey] instanceof DateField ? DateCast(this._rowDoc[this.renderFieldKey]) : undefined; }
-
-    @action
-    handleChange = (date: any) => {
-        // const script = CompileScript(date.toString(), { requiredType: "Date", addReturn: true, params: { this: Doc.name } });
-        // if (script.compiled) {
-        //     this.applyToDoc(this._document, this.props.row, this.props.col, script.run);
-        // } else {
-        // ^ DateCast is always undefined for some reason, but that is what the field should be set to
-        this._rowDoc[this.renderFieldKey] = new DateField(date as Date);
-        //}
-    }
-
-    render() {
-        return !this.props.isFocused ? <span onPointerDown={this.onPointerDown}>{this._date ? Field.toString(this._date as Field) : "--"}</span> :
-            <DatePicker
-                selected={this._date?.date || new Date}
-                onSelect={date => this.handleChange(date)}
-                onChange={date => this.handleChange(date)}
-            />;
-    }
-}
-
-@observer
-export class CollectionSchemaDocCell extends CollectionSchemaCell {
-
-    _overlayDisposer?: () => void;
-
-    @computed get _doc() { return FieldValue(Cast(this._rowDoc[this.renderFieldKey], Doc)); }
-
-    @action
-    onSetValue = (value: string) => {
-        this._doc && (Doc.GetProto(this._doc).title = value);
-
-        const script = CompileScript(value, {
-            addReturn: true,
-            typecheck: true,
-            transformer: DocumentIconContainer.getTransformer()
-        });
-
-        const results = script.compiled && script.run();
-        if (results && results.success) {
-            this._rowDoc[this.renderFieldKey] = results.result;
-            return true;
-        }
-        return false;
-    }
-
-    componentWillUnmount() { this.onBlur(); }
-
-    onBlur = () => { this._overlayDisposer?.(); };
-    onFocus = () => {
-        this.onBlur();
-        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
-    }
-
-    @action
-    isEditingCallback = (isEditing: boolean): void => {
-        document.removeEventListener("keydown", this.onKeyDown);
-        isEditing && document.addEventListener("keydown", this.onKeyDown);
-        this._isEditing = isEditing;
-        this.props.setIsEditing(isEditing);
-        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
-    }
-
-    render() {
-        return !this._doc ? this.renderCellWithType("document") :
-            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1}
-                onPointerDown={this.onPointerDown}
-            >
-                <div className="collectionSchemaView-cellContents-document"
-                    style={{ padding: "5.9px" }}
-                    ref={this.dropRef}
-                    onFocus={this.onFocus}
-                    onBlur={this.onBlur}
-                >
-                    <EditableView
-                        editing={this._isEditing}
-                        isEditingCallback={this.isEditingCallback}
-                        display={"inline"}
-                        contents={this._doc.title || "--"}
-                        height={"auto"}
-                        maxHeight={Number(MAX_ROW_HEIGHT)}
-                        GetValue={() => StrCast(this._doc?.title)}
-                        SetValue={action((value: string) => {
-                            this.onSetValue(value);
-                            return true;
-                        })}
-                    />
-                </div >
-                <div onClick={() => this._doc && this.props.addDocTab(this._doc, "add:right")} className="collectionSchemaView-cellContents-docButton">
-                    <FontAwesomeIcon icon="external-link-alt" size="lg" />
-                </div>
-            </div>;
-    }
-}
-
-@observer
-export class CollectionSchemaImageCell extends CollectionSchemaCell {
-
-    choosePath(url: URL) {
-        if (url.protocol === "data") return url.href;
-        if (url.href.indexOf(window.location.origin) === -1) return Utils.CorsProxy(url.href);
-        if (!/\.(png|jpg|jpeg|gif|webp)$/.test(url.href.toLowerCase())) return url.href;//Why is this here
-
-        const ext = path.extname(url.href);
-        return url.href.replace(ext, "_o" + path.extname(url.href));
-    }
-
-    render() {
-        const field = Cast(this._rowDoc[this.renderFieldKey], ImageField, null); // retrieve the primary image URL that is being rendered from the data doc
-        const alts = DocListCast(this._rowDoc[this.renderFieldKey + "-alternates"]); // retrieve alternate documents that may be rendered as alternate images
-        const altpaths = alts.map(doc => Cast(doc[Doc.LayoutFieldKey(doc)], ImageField, null)?.url).filter(url => url).map(url => this.choosePath(url)); // access the primary layout data of the alternate documents
-        const paths = field ? [this.choosePath(field.url), ...altpaths] : altpaths;
-        const url = paths.length ? paths : [Utils.CorsProxy("http://www.cs.brown.edu/~bcz/noImage.png")];
-
-        const aspect = Doc.NativeAspect(this._rowDoc);
-        let width = Math.min(75, this.props.rowProps.width);
-        const height = Math.min(75, width / aspect);
-        width = height * aspect;
-
-        const reference = React.createRef<HTMLDivElement>();
-        return <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-            <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
-                <img src={url[0]}
-                    width={paths.length ? width : "20px"}
-                    height={paths.length ? height : "20px"} />
-            </div >
-        </div>;
-    }
-}
-
-
-@observer
-export class CollectionSchemaListCell extends CollectionSchemaCell {
-    _overlayDisposer?: () => void;
-
-    @computed get _field() { return this._rowDoc[this.renderFieldKey]; }
-    @computed get _optionsList() { return this._field as List<any>; }
-    @observable private _opened = false;
-    @observable private _text = "select an item";
-    @observable private _selectedNum = 0;
-
-    @action
-    onSetValue = (value: string) => {
-        // change if its a document
-        this._optionsList[this._selectedNum] = this._text = value;
-
-        (this._field as List<any>).splice(this._selectedNum, 1, value);
-    }
-
-    @action
-    onSelected = (element: string, index: number) => {
-        this._text = element;
-        this._selectedNum = index;
-    }
-
-    onFocus = () => {
-        this._overlayDisposer?.();
-        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
-    }
-
-    render() {
-        const link = false;
-        const reference = React.createRef<HTMLDivElement>();
-
-        if (this._optionsList?.length) {
-            const options = !this._opened ? (null) :
-                <div>
-                    {this._optionsList.map((element, index) => {
-                        const val = Field.toString(element);
-                        return <div className="collectionSchemaView-dropdownOption" key={index} style={{ padding: "6px" }} onPointerDown={(e) => this.onSelected(StrCast(element), index)} >
-                            {val}
-                        </div>;
-                    })}
-                </div>;
-
-            const plainText = <div style={{ padding: "5.9px" }}>{this._text}</div>;
-            const textarea = <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} style={{ padding: "5.9px" }} ref={this.dropRef} >
-                <EditableView
-                    editing={this._isEditing}
-                    isEditingCallback={this.isEditingCallback}
-                    display={"inline"}
-                    contents={this._text}
-                    height={"auto"}
-                    maxHeight={Number(MAX_ROW_HEIGHT)}
-                    GetValue={() => this._text}
-                    SetValue={action((value: string) => {
-                        // add special for params 
-                        this.onSetValue(value);
-                        return true;
-                    })}
-                />
-            </div >;
-
-            //☰
-            return (
-                <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-                    <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
-                        <div className="collectionSchemaView-dropDownWrapper">
-                            <button type="button" className="collectionSchemaView-dropdownButton" style={{ right: "length", position: "relative" }}
-                                onClick={action(e => this._opened = !this._opened)} >
-                                <FontAwesomeIcon icon={this._opened ? "caret-up" : "caret-down"} size="sm" />
-                            </button>
-                            <div className="collectionSchemaView-dropdownText"> {link ? plainText : textarea} </div>
-                        </div>
-                        {options}
-                    </div >
-                </div>
-            );
-        }
-        return this.renderCellWithType("list");
-    }
-}
-
-
-@observer
-export class CollectionSchemaCheckboxCell extends CollectionSchemaCell {
-    @computed get _isChecked() { return BoolCast(this._rowDoc[this.renderFieldKey]); }
-
-    render() {
-        const reference = React.createRef<HTMLDivElement>();
-        return (
-            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-                <input type="checkbox" checked={this._isChecked} onChange={e => this._rowDoc[this.renderFieldKey] = e.target.checked} />
-            </div>
-        );
-    }
-}
-
-
-@observer
-export class CollectionSchemaButtons extends CollectionSchemaCell {
-    render() {
-        return !this.props.Document._searchDoc || ![DocumentType.PDF, DocumentType.RTF].includes(StrCast(this._rowDoc.type) as DocumentType) ? <></> :
-            <div style={{ paddingTop: 8, paddingLeft: 3 }} >
-                <button style={{ padding: 2, left: 77 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, true)}>
-                    <FontAwesomeIcon icon="arrow-up" size="sm" />
-                </button>
-                <button style={{ padding: 2 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, false)} >
-                    <FontAwesomeIcon icon="arrow-down" size="sm" />
-                </button>
-            </div>;
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx b/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
deleted file mode 100644
index b2115b22e..000000000
--- a/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
+++ /dev/null
@@ -1,518 +0,0 @@
-import React = require("react");
-import { IconProp, library } from "@fortawesome/fontawesome-svg-core";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action, computed, observable, runInAction } from "mobx";
-import { observer } from "mobx-react";
-import { Doc, DocListCast, Opt } from "../../../../fields/Doc";
-import { listSpec } from "../../../../fields/Schema";
-import { PastelSchemaPalette, SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
-import { ScriptField } from "../../../../fields/ScriptField";
-import { Cast, StrCast } from "../../../../fields/Types";
-import { undoBatch } from "../../../util/UndoManager";
-import { SearchBox } from "../../search/SearchBox";
-import { ColumnType } from "./CollectionSchemaView";
-import "./CollectionSchemaView.scss";
-import { CollectionView } from "../CollectionView";
-
-const higflyout = require("@hig/flyout");
-export const { anchorPoints } = higflyout;
-export const Flyout = higflyout.default;
-
-
-export interface AddColumnHeaderProps {
-    createColumn: () => void;
-}
-
-@observer
-export class CollectionSchemaAddColumnHeader extends React.Component<AddColumnHeaderProps> {
-    render() {
-        return (
-            <button className="add-column" onClick={() => this.props.createColumn()}><FontAwesomeIcon icon="plus" size="sm" /></button>
-        );
-    }
-}
-
-
-export interface ColumnMenuProps {
-    columnField: SchemaHeaderField;
-    // keyValue: string;
-    possibleKeys: string[];
-    existingKeys: string[];
-    // keyType: ColumnType;
-    typeConst: boolean;
-    menuButtonContent: JSX.Element;
-    addNew: boolean;
-    onSelect: (oldKey: string, newKey: string, addnew: boolean) => void;
-    setIsEditing: (isEditing: boolean) => void;
-    deleteColumn: (column: string) => void;
-    onlyShowOptions: boolean;
-    setColumnType: (column: SchemaHeaderField, type: ColumnType) => void;
-    setColumnSort: (column: SchemaHeaderField, desc: boolean | undefined) => void;
-    anchorPoint?: any;
-    setColumnColor: (column: SchemaHeaderField, color: string) => void;
-}
-@observer
-export class CollectionSchemaColumnMenu extends React.Component<ColumnMenuProps> {
-    @observable private _isOpen: boolean = false;
-    @observable private _node: HTMLDivElement | null = null;
-
-    componentDidMount() { document.addEventListener("pointerdown", this.detectClick); }
-
-    componentWillUnmount() { document.removeEventListener("pointerdown", this.detectClick); }
-
-    @action
-    detectClick = (e: PointerEvent) => {
-        !this._node?.contains(e.target as Node) && this.props.setIsEditing(this._isOpen = false);
-    }
-
-    @action
-    toggleIsOpen = (): void => {
-        this.props.setIsEditing(this._isOpen = !this._isOpen);
-    }
-
-    changeColumnType = (type: ColumnType) => {
-        this.props.setColumnType(this.props.columnField, type);
-    }
-
-    changeColumnSort = (desc: boolean | undefined) => {
-        this.props.setColumnSort(this.props.columnField, desc);
-    }
-
-    changeColumnColor = (color: string) => {
-        this.props.setColumnColor(this.props.columnField, color);
-    }
-
-    @action
-    setNode = (node: HTMLDivElement): void => {
-        if (node) {
-            this._node = node;
-        }
-    }
-
-    renderTypes = () => {
-        if (this.props.typeConst) return (null);
-
-        const type = this.props.columnField.type;
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Column type:</label>
-                <div className="columnMenu-types">
-                    <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Any)}>
-                        <FontAwesomeIcon icon={"align-justify"} size="sm" />
-                        Any
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Number)}>
-                        <FontAwesomeIcon icon={"hashtag"} size="sm" />
-                        Number
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.String)}>
-                        <FontAwesomeIcon icon={"font"} size="sm" />
-                        Text
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Boolean)}>
-                        <FontAwesomeIcon icon={"check-square"} size="sm" />
-                        Checkbox
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.List)}>
-                        <FontAwesomeIcon icon={"list-ul"} size="sm" />
-                        List
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Doc)}>
-                        <FontAwesomeIcon icon={"file"} size="sm" />
-                        Document
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Image)}>
-                        <FontAwesomeIcon icon={"image"} size="sm" />
-                        Image
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Date)}>
-                        <FontAwesomeIcon icon={"calendar"} size="sm" />
-                        Date
-                    </div>
-                </div>
-            </div >
-        );
-    }
-
-    renderSorting = () => {
-        const sort = this.props.columnField.desc;
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Sort by:</label>
-                <div className="columnMenu-sort">
-                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.changeColumnSort(true)}>
-                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
-                        Sort descending
-                    </div>
-                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.changeColumnSort(false)}>
-                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
-                        Sort ascending
-                    </div>
-                    <div className="columnMenu-option" onClick={() => this.changeColumnSort(undefined)}>
-                        <FontAwesomeIcon icon="times" size="sm" />
-                        Clear sorting
-                    </div>
-                </div>
-            </div>
-        );
-    }
-
-    renderColors = () => {
-        const selected = this.props.columnField.color;
-
-        const pink = PastelSchemaPalette.get("pink2");
-        const purple = PastelSchemaPalette.get("purple2");
-        const blue = PastelSchemaPalette.get("bluegreen1");
-        const yellow = PastelSchemaPalette.get("yellow4");
-        const red = PastelSchemaPalette.get("red2");
-        const gray = "#f1efeb";
-
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Color:</label>
-                <div className="columnMenu-colors">
-                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.changeColumnColor(pink!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.changeColumnColor(purple!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.changeColumnColor(blue!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.changeColumnColor(yellow!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.changeColumnColor(red!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.changeColumnColor(gray)}></div>
-                </div>
-            </div>
-        );
-    }
-
-    renderContent = () => {
-        return (
-            <div className="collectionSchema-header-menuOptions">
-                {this.props.onlyShowOptions ? <></> :
-                    <>
-                        {this.renderTypes()}
-                        {this.renderSorting()}
-                        {this.renderColors()}
-                        <div className="collectionSchema-headerMenu-group">
-                            <button onClick={() => this.props.deleteColumn(this.props.columnField.heading)}>Delete Column</button>
-                        </div>
-                    </>
-                }
-            </div>
-        );
-    }
-
-    render() {
-        return (
-            <div className="collectionSchema-header-menu" ref={this.setNode}>
-                <Flyout anchorPoint={this.props.anchorPoint ? this.props.anchorPoint : anchorPoints.TOP_CENTER} content={this.renderContent()}>
-                    <div className="collectionSchema-header-toggler" onClick={() => this.toggleIsOpen()}>{this.props.menuButtonContent}</div>
-                </ Flyout >
-            </div>
-        );
-    }
-}
-
-
-export interface KeysDropdownProps {
-    keyValue: string;
-    possibleKeys: string[];
-    existingKeys: string[];
-    canAddNew: boolean;
-    addNew: boolean;
-    onSelect: (oldKey: string, newKey: string, addnew: boolean, filter?: string) => void;
-    setIsEditing: (isEditing: boolean) => void;
-    width?: string;
-    docs?: Doc[];
-    Document: Doc;
-    dataDoc: Doc | undefined;
-    fieldKey: string;
-    ContainingCollectionDoc: Doc | undefined;
-    ContainingCollectionView: Opt<CollectionView>;
-    active?: (outsideReaction?: boolean) => boolean;
-    openHeader: (column: any, screenx: number, screeny: number) => void;
-    col: SchemaHeaderField;
-    icon: IconProp;
-}
-@observer
-export class KeysDropdown extends React.Component<KeysDropdownProps> {
-    @observable private _key: string = this.props.keyValue;
-    @observable private _searchTerm: string = this.props.keyValue;
-    @observable private _isOpen: boolean = false;
-    @observable private _node: HTMLDivElement | null = null;
-    @observable private _inputRef: React.RefObject<HTMLInputElement> = React.createRef();
-
-    @action setSearchTerm = (value: string): void => { this._searchTerm = value; };
-    @action setKey = (key: string): void => { this._key = key; };
-    @action setIsOpen = (isOpen: boolean): void => { this._isOpen = isOpen; };
-
-    @action
-    onSelect = (key: string): void => {
-        this.props.onSelect(this._key, key, this.props.addNew);
-        this.setKey(key);
-        this._isOpen = false;
-        this.props.setIsEditing(false);
-    }
-
-    @action
-    setNode = (node: HTMLDivElement): void => {
-        if (node) {
-            this._node = node;
-        }
-    }
-
-    componentDidMount() {
-        document.addEventListener("pointerdown", this.detectClick);
-        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
-        if (filters?.some(filter => filter.split(":")[0] === this._key)) {
-            runInAction(() => this.closeResultsVisibility = "contents");
-        }
-    }
-
-    @action
-    detectClick = (e: PointerEvent): void => {
-        if (this._node && this._node.contains(e.target as Node)) {
-        } else {
-            this._isOpen = false;
-            this.props.setIsEditing(false);
-        }
-    }
-
-    private tempfilter: string = "";
-    @undoBatch
-    onKeyDown = (e: React.KeyboardEvent): void => {
-        if (e.key === "Enter") {
-            if (this._searchTerm.includes(":")) {
-                const colpos = this._searchTerm.indexOf(":");
-                const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
-                if (temp === "") {
-                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
-                    this.updateFilter();
-                }
-                else {
-                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
-                    this.tempfilter = temp;
-                    Doc.setDocFilter(this.props.Document, this._key, temp, "check");
-                    this.props.col.setColor("green");
-                    this.closeResultsVisibility = "contents";
-                }
-            }
-            else {
-                Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
-                this.updateFilter();
-                if (this.showKeys.length) {
-                    this.onSelect(this.showKeys[0]);
-                } else if (this._searchTerm !== "" && this.props.canAddNew) {
-                    this.setSearchTerm(this._searchTerm || this._key);
-                    this.onSelect(this._searchTerm);
-                }
-            }
-        }
-    }
-
-    onChange = (val: string): void => {
-        this.setSearchTerm(val);
-    }
-
-    @action
-    onFocus = (e: React.FocusEvent): void => {
-        this._isOpen = true;
-        this.props.setIsEditing(true);
-    }
-
-    @computed get showKeys() {
-        const whitelistKeys = ["context", "author", "*lastModified", "text", "data", "tags", "creationDate"];
-        const keyOptions = this._searchTerm === "" ? this.props.possibleKeys : this.props.possibleKeys.filter(key => key.toUpperCase().indexOf(this._searchTerm.toUpperCase()) > -1);
-        const showKeys = new Set<string>();
-        [...keyOptions, ...whitelistKeys].forEach(key => (!Doc.UserDoc().noviceMode ||
-            whitelistKeys.includes(key)
-            || ((!key.startsWith("_") && key[0] === key[0].toUpperCase()) || key[0] === "#")) ? showKeys.add(key) : null);
-        return Array.from(showKeys.keys()).filter(key => !this._searchTerm || key.includes(this._searchTerm));
-    }
-    @action
-    renderOptions = (): JSX.Element[] | JSX.Element => {
-        if (!this._isOpen) {
-            this.defaultMenuHeight = 0;
-            return <></>;
-        }
-        const options = this.showKeys.map(key => {
-            return <div key={key} className="key-option" style={{
-                border: "1px solid lightgray",
-                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
-            }}
-                onPointerDown={e => {
-                    e.stopPropagation();
-                }}
-                onClick={() => {
-                    this.onSelect(key);
-                    this.setSearchTerm("");
-                }}>{key}</div>;
-        });
-
-        // if search term does not already exist as a group type, give option to create new group type
-
-        if (this._key !== this._searchTerm.slice(0, this._key.length)) {
-            if (this._searchTerm !== "" && this.props.canAddNew) {
-                options.push(<div key={""} className="key-option" style={{
-                    border: "1px solid lightgray", width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
-                }}
-                    onClick={() => { this.onSelect(this._searchTerm); this.setSearchTerm(""); }}>
-                    Create "{this._searchTerm}" key</div>);
-            }
-        }
-
-        if (options.length === 0) {
-            this.defaultMenuHeight = 0;
-        }
-        else {
-            if (this.props.docs) {
-                const panesize = this.props.docs.length * 30;
-                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-            else {
-                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-        }
-        return options;
-    }
-
-    docSafe: Doc[] = [];
-
-    @action
-    renderFilterOptions = (): JSX.Element[] | JSX.Element => {
-        if (!this._isOpen || !this.props.dataDoc) {
-            this.defaultMenuHeight = 0;
-            return <></>;
-        }
-        const keyOptions: string[] = [];
-        const colpos = this._searchTerm.indexOf(":");
-        const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
-        if (this.docSafe.length === 0) {
-            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
-        }
-        const docs = this.docSafe;
-        docs.forEach((doc) => {
-            const key = StrCast(doc[this._key]);
-            if (keyOptions.includes(key) === false && key.includes(temp) && key !== "") {
-                keyOptions.push(key);
-            }
-        });
-
-        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
-        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
-            this.props.col.setColor("rgb(241, 239, 235)");
-            this.closeResultsVisibility = "none";
-        }
-        for (let i = 0; i < (filters?.length ?? 0) - 1; i++) {
-            if (filters![i] === this.props.col.heading && keyOptions.includes(filters![i].split(":")[1]) === false) {
-                keyOptions.push(filters![i + 1]);
-            }
-        }
-        const options = keyOptions.map(key => {
-            let bool = false;
-            if (filters !== undefined) {
-                const ind = filters.findIndex(filter => filter.split(":")[0] === key);
-                const fields = ind === -1 ? undefined : filters[ind].split(":");
-                bool = fields ? fields[1] === "check" : false;
-            }
-            return <div key={key} className="key-option" style={{
-                border: "1px solid lightgray", paddingLeft: 5, textAlign: "left",
-                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white", backgroundColor: "white",
-            }}
-            >
-                <input type="checkbox"
-                    onPointerDown={e => e.stopPropagation()}
-                    onClick={e => e.stopPropagation()}
-                    onChange={(e) => {
-                        e.target.checked === true ? Doc.setDocFilter(this.props.Document, this._key, key, "check") : Doc.setDocFilter(this.props.Document, this._key, key, "remove");
-                        e.target.checked === true ? this.closeResultsVisibility = "contents" : console.log("");
-                        e.target.checked === true ? this.props.col.setColor("green") : this.updateFilter();
-                        e.target.checked === true && SearchBox.Instance.filter === true ? Doc.setDocFilter(docs[0], this._key, key, "check") : Doc.setDocFilter(docs[0], this._key, key, "remove");
-                    }}
-                    checked={bool}
-                />
-                <span style={{ paddingLeft: 4 }}>
-                    {key}
-                </span>
-
-            </div>;
-        });
-        if (options.length === 0) {
-            this.defaultMenuHeight = 0;
-        }
-        else {
-            if (this.props.docs) {
-                const panesize = this.props.docs.length * 30;
-                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-            else {
-                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-
-        }
-        return options;
-    }
-
-    @observable defaultMenuHeight = 0;
-
-
-    updateFilter() {
-        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
-        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
-            this.props.col.setColor("rgb(241, 239, 235)");
-            this.closeResultsVisibility = "none";
-        }
-    }
-
-    @computed get scriptField() {
-        const scriptText = "setDocFilter(containingTreeView, heading, this.title, checked)";
-        const script = ScriptField.MakeScript(scriptText, { this: Doc.name, heading: "string", checked: "string", containingTreeView: Doc.name });
-        return script ? () => script : undefined;
-    }
-    filterBackground = () => "rgba(105, 105, 105, 0.432)";
-    @observable filterOpen: boolean | undefined = undefined;
-    closeResultsVisibility: string = "none";
-
-    removeFilters = (e: React.PointerEvent): void => {
-        const keyOptions: string[] = [];
-        if (this.docSafe.length === 0 && this.props.dataDoc) {
-            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
-        }
-        const docs = this.docSafe;
-        docs.forEach((doc) => {
-            const key = StrCast(doc[this._key]);
-            if (keyOptions.includes(key) === false) {
-                keyOptions.push(key);
-            }
-        });
-
-        Doc.setDocFilter(this.props.Document, this._key, "", "remove");
-        this.props.col.setColor("rgb(241, 239, 235)");
-        this.closeResultsVisibility = "none";
-    }
-    render() {
-        return (
-            <div style={{ display: "flex" }} ref={this.setNode}>
-                <FontAwesomeIcon onClick={e => { this.props.openHeader(this.props.col, e.clientX, e.clientY); e.stopPropagation(); }} icon={this.props.icon} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} />
-
-                {/* <FontAwesomeIcon icon={fa.faSearchMinus} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} onClick={e => {
-                    runInAction(() => { this._isOpen === undefined ? this._isOpen = true : this._isOpen = !this._isOpen })
-                }} /> */}
-
-                <div className="keys-dropdown" style={{ zIndex: 1, width: this.props.width, maxWidth: this.props.width }}>
-                    <input className="keys-search" style={{ width: "100%" }}
-                        ref={this._inputRef} type="text" value={this._searchTerm} placeholder="Column key" onKeyDown={this.onKeyDown}
-                        onChange={e => this.onChange(e.target.value)}
-                        onClick={(e) => { e.stopPropagation(); this._inputRef.current?.focus(); }}
-                        onFocus={this.onFocus} ></input>
-                    <div style={{ display: this.closeResultsVisibility }}>
-                        <FontAwesomeIcon onPointerDown={this.removeFilters} icon={"times-circle"} size="lg"
-                            style={{ cursor: "hand", color: "grey", padding: 2, left: -20, top: -1, height: 15, position: "relative" }} />
-                    </div>
-                    {!this._isOpen ? (null) : <div className="keys-options-wrapper" style={{
-                        width: this.props.width, maxWidth: this.props.width, height: "auto",
-                    }}>
-                        {this._searchTerm.includes(":") ? this.renderFilterOptions() : this.renderOptions()}
-                    </div>}
-                </div >
-            </div>
-        );
-    }
-}
diff --git a/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx b/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
deleted file mode 100644
index 456c38c68..000000000
--- a/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
+++ /dev/null
@@ -1,128 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action } from "mobx";
-import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
-import { Doc } from "../../../../fields/Doc";
-import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
-import { Cast, FieldValue, StrCast } from "../../../../fields/Types";
-import { DocumentManager } from "../../../util/DocumentManager";
-import { DragManager, dropActionType, SetupDrag } from "../../../util/DragManager";
-import { SnappingManager } from "../../../util/SnappingManager";
-import { Transform } from "../../../util/Transform";
-import { undoBatch } from "../../../util/UndoManager";
-import { ContextMenu } from "../../ContextMenu";
-import "./CollectionSchemaView.scss";
-
-export interface MovableColumnProps {
-    columnRenderer: TableCellRenderer;
-    columnValue: SchemaHeaderField;
-    allColumns: SchemaHeaderField[];
-    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columns: SchemaHeaderField[]) => void;
-    ScreenToLocalTransform: () => Transform;
-}
-export class MovableColumn extends React.Component<MovableColumnProps> {
-    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
-    private _colDropDisposer?: DragManager.DragDropDisposer;
-    private _startDragPosition: { x: number, y: number } = { x: 0, y: 0 };
-    private _sensitivity: number = 16;
-    private _dragRef: React.RefObject<HTMLDivElement> = React.createRef();
-
-    onPointerEnter = (e: React.PointerEvent): void => {
-        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
-            this._header!.current!.className = "collectionSchema-col-wrapper";
-            document.addEventListener("pointermove", this.onDragMove, true);
-        }
-    }
-    onPointerLeave = (e: React.PointerEvent): void => {
-        this._header!.current!.className = "collectionSchema-col-wrapper";
-        document.removeEventListener("pointermove", this.onDragMove, true);
-        !e.buttons && document.removeEventListener("pointermove", this.onPointerMove);
-    }
-    onDragMove = (e: PointerEvent): void => {
-        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
-        const before = x[0] < bounds[0];
-        this._header!.current!.className = "collectionSchema-col-wrapper";
-        if (before) this._header!.current!.className += " col-before";
-        if (!before) this._header!.current!.className += " col-after";
-        e.stopPropagation();
-    }
-
-    createColDropTarget = (ele: HTMLDivElement) => {
-        this._colDropDisposer?.();
-        if (ele) {
-            this._colDropDisposer = DragManager.MakeDropTarget(ele, this.colDrop.bind(this));
-        }
-    }
-
-    colDrop = (e: Event, de: DragManager.DropEvent) => {
-        document.removeEventListener("pointermove", this.onDragMove, true);
-        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
-        const before = x[0] < bounds[0];
-        const colDragData = de.complete.columnDragData;
-        if (colDragData) {
-            e.stopPropagation();
-            this.props.reorderColumns(colDragData.colKey, this.props.columnValue, before, this.props.allColumns);
-            return true;
-        }
-        return false;
-    }
-
-    onPointerMove = (e: PointerEvent) => {
-        const onRowMove = (e: PointerEvent) => {
-            e.stopPropagation();
-            e.preventDefault();
-
-            document.removeEventListener("pointermove", onRowMove);
-            document.removeEventListener('pointerup', onRowUp);
-            const dragData = new DragManager.ColumnDragData(this.props.columnValue);
-            DragManager.StartColumnDrag(this._dragRef.current!, dragData, e.x, e.y);
-        };
-        const onRowUp = (): void => {
-            document.removeEventListener("pointermove", onRowMove);
-            document.removeEventListener('pointerup', onRowUp);
-        };
-        if (e.buttons === 1) {
-            const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX - this._startDragPosition.x, e.clientY - this._startDragPosition.y);
-            if (Math.abs(dx) + Math.abs(dy) > this._sensitivity) {
-                document.removeEventListener("pointermove", this.onPointerMove);
-                e.stopPropagation();
-
-                document.addEventListener("pointermove", onRowMove);
-                document.addEventListener("pointerup", onRowUp);
-            }
-        }
-    }
-
-    onPointerUp = (e: React.PointerEvent) => {
-        document.removeEventListener("pointermove", this.onPointerMove);
-    }
-
-    @action
-    onPointerDown = (e: React.PointerEvent, ref: React.RefObject<HTMLDivElement>) => {
-        this._dragRef = ref;
-        const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX, e.clientY);
-        if (!(e.target as any)?.tagName.includes("INPUT")) {
-            this._startDragPosition = { x: dx, y: dy };
-            document.addEventListener("pointermove", this.onPointerMove);
-        }
-    }
-
-
-    render() {
-        const reference = React.createRef<HTMLDivElement>();
-
-        return (
-            <div className="collectionSchema-col" ref={this.createColDropTarget}>
-                <div className="collectionSchema-col-wrapper" ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
-                    <div className="col-dragger" ref={reference} onPointerDown={e => this.onPointerDown(e, reference)} onPointerUp={this.onPointerUp}>
-                        {this.props.columnRenderer}
-                    </div>
-                </div>
-            </div>
-        );
-    }
-}
diff --git a/src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx b/src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx
deleted file mode 100644
index f48906ba5..000000000
--- a/src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx
+++ /dev/null
@@ -1,147 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action } from "mobx";
-import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
-import { Doc } from "../../../../fields/Doc";
-import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
-import { Cast, FieldValue, StrCast } from "../../../../fields/Types";
-import { DocumentManager } from "../../../util/DocumentManager";
-import { DragManager, dropActionType, SetupDrag } from "../../../util/DragManager";
-import { SnappingManager } from "../../../util/SnappingManager";
-import { Transform } from "../../../util/Transform";
-import { undoBatch } from "../../../util/UndoManager";
-import { ContextMenu } from "../../ContextMenu";
-import "./CollectionSchemaView.scss";
-
-export interface MovableRowProps {
-    rowInfo: RowInfo;
-    ScreenToLocalTransform: () => Transform;
-    addDoc: (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => boolean;
-    removeDoc: (doc: Doc | Doc[]) => boolean;
-    rowFocused: boolean;
-    textWrapRow: (doc: Doc) => void;
-    rowWrapped: boolean;
-    dropAction: string;
-    addDocTab: any;
-}
-
-export class MovableRow extends React.Component<MovableRowProps> {
-    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
-    private _rowDropDisposer?: DragManager.DragDropDisposer;
-
-    // Event listeners are only necessary when the user is hovering over the table
-    // Create one when the mouse starts hovering...
-    onPointerEnter = (e: React.PointerEvent): void => {
-        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
-            this._header!.current!.className = "collectionSchema-row-wrapper";
-            document.addEventListener("pointermove", this.onDragMove, true);
-        }
-    }
-    // ... and delete it when the mouse leaves
-    onPointerLeave = (e: React.PointerEvent): void => {
-        this._header!.current!.className = "collectionSchema-row-wrapper";
-        document.removeEventListener("pointermove", this.onDragMove, true);
-    }
-    // The method for the event listener, reorders columns when dragged to their new locations.
-    onDragMove = (e: PointerEvent): void => {
-        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
-        const before = x[1] < bounds[1];
-        this._header!.current!.className = "collectionSchema-row-wrapper";
-        if (before) this._header!.current!.className += " row-above";
-        if (!before) this._header!.current!.className += " row-below";
-        e.stopPropagation();
-    }
-    componentWillUnmount() {
-
-        this._rowDropDisposer?.();
-    }
-    //
-    createRowDropTarget = (ele: HTMLDivElement) => {
-        this._rowDropDisposer?.();
-        if (ele) {
-            this._rowDropDisposer = DragManager.MakeDropTarget(ele, this.rowDrop.bind(this));
-        }
-    }
-    // Controls what hppens when a row is dragged and dropped
-    rowDrop = (e: Event, de: DragManager.DropEvent) => {
-        this.onPointerLeave(e as any);
-        const rowDoc = FieldValue(Cast(this.props.rowInfo.original, Doc));
-        if (!rowDoc) return false;
-
-        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
-        const before = x[1] < bounds[1];
-
-        const docDragData = de.complete.docDragData;
-        if (docDragData) {
-            e.stopPropagation();
-            if (docDragData.draggedDocuments[0] === rowDoc) return true;
-            const addDocument = (doc: Doc | Doc[]) => this.props.addDoc(doc, rowDoc, before);
-            const movedDocs = docDragData.draggedDocuments;
-            return (docDragData.dropAction || docDragData.userDropAction) ?
-                docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before) || added, false)
-                : (docDragData.moveDocument) ?
-                    movedDocs.reduce((added: boolean, d) => docDragData.moveDocument?.(d, rowDoc, addDocument) || added, false)
-                    : docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before), false);
-        }
-        return false;
-    }
-
-    onRowContextMenu = (e: React.MouseEvent): void => {
-        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
-        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
-    }
-
-    @undoBatch
-    @action
-    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
-        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
-        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
-    }
-
-    @action
-    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
-        console.log("yes");
-        if (e.key === "Backspace" || e.key === "Delete") {
-            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
-        }
-    }
-
-    render() {
-        const { children = null, rowInfo } = this.props;
-
-        if (!rowInfo) {
-            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
-        }
-
-        const { original } = rowInfo;
-        const doc = FieldValue(Cast(original, Doc));
-
-        if (!doc) return (null);
-
-        const reference = React.createRef<HTMLDivElement>();
-        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
-
-        let className = "collectionSchema-row";
-        if (this.props.rowFocused) className += " row-focused";
-        if (this.props.rowWrapped) className += " row-wrapped";
-
-        return (
-            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
-                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
-                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
-                        <div className="row-dragger">
-                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
-                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
-                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
-                        </div>
-                        {children}
-                    </ReactTableDefaults.TrComponent>
-                </div>
-            </div>
-        );
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaView.scss b/src/client/views/collections/schemaView/CollectionSchemaView.scss
deleted file mode 100644
index b57fee0e4..000000000
--- a/src/client/views/collections/schemaView/CollectionSchemaView.scss
+++ /dev/null
@@ -1,552 +0,0 @@
-@import "../../globalCssVariables";
-.collectionSchemaView-container {
-    border-width: $COLLECTION_BORDER_WIDTH;
-    border-color: $intermediate-color;
-    border-style: solid;
-    border-radius: $border-radius;
-    box-sizing: border-box;
-    position: relative;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    margin-top: 0;
-    transition: top 0.5s;
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: nowrap;
-    touch-action: none;
-    div {
-        touch-action: none;
-    }
-    .collectionSchemaView-tableContainer {
-        width: 100%;
-        height: 100%;
-    }
-    .collectionSchemaView-dividerDragger {
-        position: relative;
-        height: 100%;
-        width: $SCHEMA_DIVIDER_WIDTH;
-        z-index: 20;
-        right: 0;
-        top: 0;
-        background: gray;
-        cursor: col-resize;
-    }
-    // .documentView-node:first-child {
-    //     background: $light-color;
-    // }
-}
-
-.collectionSchemaView-searchContainer {
-    border-width: $COLLECTION_BORDER_WIDTH;
-    border-color: $intermediate-color;
-    border-style: solid;
-    border-radius: $border-radius;
-    box-sizing: border-box;
-    position: relative;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    margin-top: 0;
-    transition: top 0.5s;
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: nowrap;
-    touch-action: none;
-    padding: 2px;
-    div {
-        touch-action: none;
-    }
-    .collectionSchemaView-tableContainer {
-        width: 100%;
-        height: 100%;
-    }
-    .collectionSchemaView-dividerDragger {
-        position: relative;
-        height: 100%;
-        width: 20px;
-        z-index: 20;
-        right: 0;
-        top: 0;
-        background: gray;
-        cursor: col-resize;
-    }
-    // .documentView-node:first-child {
-    //     background: $light-color;
-    // }
-}
-
-.ReactTable {
-    width: 100%;
-    background: white;
-    box-sizing: border-box;
-    border: none !important;
-    float: none !important;
-    .rt-table {
-        height: 100%;
-        display: -webkit-inline-box;
-        direction: ltr;
-        overflow: visible;
-    }
-    .rt-noData {
-        display: none;
-    }
-    .rt-thead {
-        width: 100%;
-        z-index: 100;
-        overflow-y: visible;
-        &.-header {
-            font-size: 12px;
-            height: 30px;
-            box-shadow: none;
-            z-index: 100;
-            overflow-y: visible;
-        }
-        .rt-resizable-header-content {
-            height: 100%;
-            overflow: visible;
-        }
-        .rt-th {
-            padding: 0;
-            border: solid lightgray;
-            border-width: 0 1px;
-            border-bottom: 2px solid lightgray;
-        }
-    }
-    .rt-th {
-        font-size: 13px;
-        text-align: center;
-        &:last-child {
-            overflow: visible;
-        }
-    }
-    .rt-tbody {
-        width: 100%;
-        direction: rtl;
-        overflow: visible;
-        .rt-td {
-            border-right: 1px solid rgba(0, 0, 0, 0.2);
-        }
-    }
-    .rt-tr-group {
-        direction: ltr;
-        flex: 0 1 auto;
-        min-height: 30px;
-        border: 0 !important;
-    }
-    .rt-tr {
-        width: 100%;
-        min-height: 30px;
-    }
-    .rt-td {
-        padding: 0;
-        font-size: 13px;
-        text-align: center;
-        white-space: nowrap;
-        display: flex;
-        align-items: center;
-        .imageBox-cont {
-            position: relative;
-            max-height: 100%;
-        }
-        .imageBox-cont img {
-            object-fit: contain;
-            max-width: 100%;
-            height: 100%;
-        }
-        .videoBox-cont {
-            object-fit: contain;
-            width: auto;
-            height: 100%;
-        }
-    }
-    .rt-td.rt-expandable {
-        display: flex;
-        align-items: center;
-        height: inherit;
-    }
-    .rt-resizer {
-        width: 8px;
-        right: -4px;
-    }
-    .rt-resizable-header {
-        padding: 0;
-        height: 30px;
-    }
-    .rt-resizable-header:last-child {
-        overflow: visible;
-        .rt-resizer {
-            width: 5px !important;
-        }
-    }
-}
-
-.documentView-node-topmost {
-    text-align: left;
-    transform-origin: center top;
-    display: inline-block;
-}
-
-.collectionSchema-col {
-    height: 100%;
-}
-
-.collectionSchema-header-menu {
-    height: auto;
-    z-index: 100;
-    position: absolute;
-    background: white;
-    padding: 5px;
-    position: fixed;
-    background: white;
-    border: black 1px solid;
-    .collectionSchema-header-toggler {
-        z-index: 100;
-        width: 100%;
-        height: 100%;
-        padding: 4px;
-        letter-spacing: 2px;
-        text-transform: uppercase;
-        svg {
-            margin-right: 4px;
-        }
-    }
-}
-
-.collectionSchemaView-header {
-    height: 100%;
-    color: gray;
-    z-index: 100;
-    overflow-y: visible;
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: wrap;
-}
-
-button.add-column {
-    width: 28px;
-}
-
-.collectionSchema-header-menuOptions {
-    color: black;
-    width: 180px;
-    text-align: left;
-    .collectionSchema-headerMenu-group {
-        padding: 7px 0;
-        border-bottom: 1px solid lightgray;
-        cursor: pointer;
-        &:first-child {
-            padding-top: 0;
-        }
-        &:last-child {
-            border: none;
-            text-align: center;
-            padding: 12px 0 0 0;
-        }
-    }
-    label {
-        color: $main-accent;
-        font-weight: normal;
-        letter-spacing: 2px;
-        text-transform: uppercase;
-    }
-    input {
-        color: black;
-        width: 100%;
-    }
-    .columnMenu-option {
-        cursor: pointer;
-        padding: 3px;
-        background-color: white;
-        transition: background-color 0.2s;
-        &:hover {
-            background-color: $light-color-secondary;
-        }
-        &.active {
-            font-weight: bold;
-            border: 2px solid $light-color-secondary;
-        }
-        svg {
-            color: gray;
-            margin-right: 5px;
-            width: 10px;
-        }
-    }
-    .keys-dropdown {
-        position: relative;
-        //width: 100%;
-        background-color: white;
-        input {
-            border: 2px solid $light-color-secondary;
-            padding: 3px;
-            height: 28px;
-            font-weight: bold;
-            letter-spacing: "2px";
-            text-transform: "uppercase";
-            &:focus {
-                font-weight: normal;
-            }
-        }
-        .keys-options-wrapper {
-            width: 100%;
-            max-height: 150px;
-            overflow-y: scroll;
-            position: absolute;
-            top: 28px;
-            box-shadow: 0 10px 16px rgba(0, 0, 0, 0.1);
-            background-color: white;
-            .key-option {
-                background-color: white;
-                border: 1px solid lightgray;
-                padding: 2px 3px;
-                &:not(:first-child) {
-                    border-top: 0;
-                }
-                &:hover {
-                    background-color: $light-color-secondary;
-                }
-            }
-        }
-    }
-    .columnMenu-colors {
-        display: flex;
-        justify-content: space-between;
-        flex-wrap: wrap;
-        .columnMenu-colorPicker {
-            cursor: pointer;
-            width: 20px;
-            height: 20px;
-            border-radius: 10px;
-            &.active {
-                border: 2px solid white;
-                box-shadow: 0 0 0 2px lightgray;
-            }
-        }
-    }
-}
-
-.collectionSchema-row {
-    height: 100%;
-    background-color: white;
-    &.row-focused .rt-td {
-        background-color: #bfffc0; //$light-color-secondary;
-    }
-    &.row-wrapped {
-        .rt-td {
-            white-space: normal;
-        }
-    }
-    .row-dragger {
-        display: flex;
-        justify-content: space-around;
-        //flex: 50 0 auto;
-        width: 0;
-        max-width: 50px;
-        //height: 100%;
-        min-height: 30px;
-        align-items: center;
-        color: lightgray;
-        background-color: white;
-        transition: color 0.1s ease;
-        .row-option {
-            // padding: 5px;
-            cursor: pointer;
-            position: absolute;
-            transition: color 0.1s ease;
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-            z-index: 2;
-            &:hover {
-                color: gray;
-            }
-        }
-    }
-    .collectionSchema-row-wrapper {
-        &.row-above {
-            border-top: 1px solid red;
-        }
-        &.row-below {
-            border-bottom: 1px solid red;
-        }
-        &.row-inside {
-            border: 1px solid red;
-        }
-        .row-dragging {
-            background-color: blue;
-        }
-    }
-}
-
-.collectionSchemaView-cellContainer {
-    width: 100%;
-    height: unset;
-}
-
-.collectionSchemaView-cellWrapper {
-    height: 100%;
-    padding: 4px;
-    text-align: left;
-    padding-left: 19px;
-    position: relative;
-    &:focus {
-        outline: none;
-    }
-    &.editing {
-        padding: 0;
-        input {
-            outline: 0;
-            border: none;
-            background-color: rgb(255, 217, 217);
-            width: 100%;
-            height: 100%;
-            padding: 2px 3px;
-            min-height: 26px;
-        }
-    }
-    &.focused {
-        &.inactive {
-            border: none;
-        }
-    }
-    p {
-        width: 100%;
-        height: 100%;
-    }
-    &:hover .collectionSchemaView-cellContents-docExpander {
-        display: block;
-    }
-    .collectionSchemaView-cellContents-document {
-        display: inline-block;
-    }
-    .collectionSchemaView-cellContents-docButton {
-        float: right;
-        width: "15px";
-        height: "15px";
-    }
-    .collectionSchemaView-dropdownWrapper {
-        border: grey;
-        border-style: solid;
-        border-width: 1px;
-        height: 30px;
-        .collectionSchemaView-dropdownButton {
-            //display: inline-block;
-            float: left;
-            height: 100%;
-        }
-        .collectionSchemaView-dropdownText {
-            display: inline-block;
-            //float: right;
-            height: 100%;
-            display: "flex";
-            font-size: 13;
-            justify-content: "center";
-            align-items: "center";
-        }
-    }
-    .collectionSchemaView-dropdownContainer {
-        position: absolute;
-        border: 1px solid rgba(0, 0, 0, 0.04);
-        box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14);
-        .collectionSchemaView-dropdownOption:hover {
-            background-color: rgba(0, 0, 0, 0.14);
-            cursor: pointer;
-        }
-    }
-}
-
-.collectionSchemaView-cellContents-docExpander {
-    height: 30px;
-    width: 30px;
-    display: none;
-    position: absolute;
-    top: 0;
-    right: 0;
-    background-color: lightgray;
-}
-
-.doc-drag-over {
-    background-color: red;
-}
-
-.collectionSchemaView-toolbar {
-    z-index: 100;
-}
-
-.collectionSchemaView-toolbar {
-    height: 30px;
-    display: flex;
-    justify-content: flex-end;
-    padding: 0 10px;
-    border-bottom: 2px solid gray;
-    .collectionSchemaView-toolbar-item {
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-    }
-}
-
-#preview-schema-checkbox-div {
-    margin-left: 20px;
-    font-size: 12px;
-}
-
-.collectionSchemaView-table {
-    width: 100%;
-    height: 100%;
-    overflow: auto;
-    padding: 3px;
-}
-
-.rt-td.rt-expandable {
-    overflow: visible;
-    position: relative;
-    height: 100%;
-    z-index: 1;
-}
-
-.reactTable-sub {
-    background-color: rgb(252, 252, 252);
-    width: 100%;
-    .rt-thead {
-        display: none;
-    }
-    .row-dragger {
-        background-color: rgb(252, 252, 252);
-    }
-    .rt-table {
-        background-color: rgb(252, 252, 252);
-    }
-    .collectionSchemaView-table {
-        width: 100%;
-        border: solid 1px;
-        overflow: visible;
-        padding: 0px;
-    }
-}
-
-.collectionSchemaView-expander {
-    height: 100%;
-    min-height: 30px;
-    position: absolute;
-    color: gray;
-    width: 20;
-    height: auto;
-    left: 55;
-    svg {
-        position: absolute;
-        top: 50%;
-        left: 10;
-        transform: translate(-50%, -50%);
-    }
-}
-
-.collectionSchemaView-addRow {
-    color: gray;
-    letter-spacing: 2px;
-    text-transform: uppercase;
-    cursor: pointer;
-    font-size: 10.5px;
-    margin-left: 50px;
-    margin-top: 10px;
-}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaView.tsx b/src/client/views/collections/schemaView/CollectionSchemaView.tsx
deleted file mode 100644
index ef28f75c8..000000000
--- a/src/client/views/collections/schemaView/CollectionSchemaView.tsx
+++ /dev/null
@@ -1,575 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { action, computed, observable, untracked } from "mobx";
-import { observer } from "mobx-react";
-import Measure from "react-measure";
-import { Resize } from "react-table";
-import "react-table/react-table.css";
-import { Doc, Opt } from "../../../../fields/Doc";
-import { List } from "../../../../fields/List";
-import { listSpec } from "../../../../fields/Schema";
-import { PastelSchemaPalette, SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
-import { Cast, NumCast } from "../../../../fields/Types";
-import { TraceMobx } from "../../../../fields/util";
-import { emptyFunction, emptyPath, returnFalse, setupMoveUpEvents, returnEmptyDoclist, returnTrue } from "../../../../Utils";
-import { SelectionManager } from "../../../util/SelectionManager";
-import { SnappingManager } from "../../../util/SnappingManager";
-import { Transform } from "../../../util/Transform";
-import { undoBatch } from "../../../util/UndoManager";
-import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../globalCssVariables.scss';
-import { ContextMenu } from "../../ContextMenu";
-import { ContextMenuProps } from "../../ContextMenuItem";
-import '../../../views/DocumentDecorations.scss';
-import { DocumentView } from "../../nodes/DocumentView";
-import { DefaultStyleProvider } from "../../StyleProvider";
-import "./CollectionSchemaView.scss";
-import { CollectionSubView } from "../CollectionSubView";
-import { SchemaTable } from "./SchemaTable";
-import { DocUtils } from "../../../documents/Documents";
-// bcz: need to add drag and drop of rows and columns.  This seems like it might work for rows: https://codesandbox.io/s/l94mn1q657
-
-export enum ColumnType {
-    Any,
-    Number,
-    String,
-    Boolean,
-    Doc,
-    Image,
-    List,
-    Date
-}
-// this map should be used for keys that should have a const type of value
-const columnTypes: Map<string, ColumnType> = new Map([
-    ["title", ColumnType.String],
-    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
-    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
-    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
-]);
-
-@observer
-export class CollectionSchemaView extends CollectionSubView(doc => doc) {
-    private _previewCont?: HTMLDivElement;
-
-    @observable _previewDoc: Doc | undefined = undefined;
-    @observable _focusedTable: Doc = this.props.Document;
-    @observable _col: any = "";
-    @observable _menuWidth = 0;
-    @observable _headerOpen = false;
-    @observable _headerIsEditing = false;
-    @observable _menuHeight = 0;
-    @observable _pointerX = 0;
-    @observable _pointerY = 0;
-    @observable _openTypes: boolean = false;
-
-    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
-    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
-    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
-    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
-    @computed get scale() { return this.props.ScreenToLocalTransform().Scale; }
-    @computed get columns() { return Cast(this.props.Document._schemaHeaders, listSpec(SchemaHeaderField), []); }
-    set columns(columns: SchemaHeaderField[]) { this.props.Document._schemaHeaders = new List<SchemaHeaderField>(columns); }
-
-    @computed get menuCoordinates() {
-        let searchx = 0;
-        let searchy = 0;
-        if (this.props.Document._searchDoc) {
-            const el = document.getElementsByClassName("collectionSchemaView-searchContainer")[0];
-            if (el !== undefined) {
-                const rect = el.getBoundingClientRect();
-                searchx = rect.x;
-                searchy = rect.y;
-            }
-        }
-        const x = Math.max(0, Math.min(document.body.clientWidth - this._menuWidth, this._pointerX)) - searchx;
-        const y = Math.max(0, Math.min(document.body.clientHeight - this._menuHeight, this._pointerY)) - searchy;
-        return this.props.ScreenToLocalTransform().transformPoint(x, y);
-    }
-
-    get documentKeys() {
-        const docs = this.childDocs;
-        const keys: { [key: string]: boolean } = {};
-        // bcz: ugh.  this is untracked since otherwise a large collection of documents will blast the server for all their fields.
-        //  then as each document's fields come back, we update the documents _proxies.  Each time we do this, the whole schema will be
-        //  invalidated and re-rendered.   This workaround will inquire all of the document fields before the options button is clicked.
-        //  then by the time the options button is clicked, all of the fields should be in place.  If a new field is added while this menu
-        //  is displayed (unlikely) it won't show up until something else changes.
-        //TODO Types
-        untracked(() => docs.map(doc => Doc.GetAllPrototypes(doc).map(proto => Object.keys(proto).forEach(key => keys[key] = false))));
-
-        this.columns.forEach(key => keys[key.heading] = true);
-        return Array.from(Object.keys(keys));
-    }
-
-    @action setHeaderIsEditing = (isEditing: boolean) => this._headerIsEditing = isEditing;
-
-    @undoBatch
-    setColumnType = action((columnField: SchemaHeaderField, type: ColumnType): void => {
-        this._openTypes = false;
-        if (columnTypes.get(columnField.heading)) return;
-
-        const columns = this.columns;
-        const index = columns.indexOf(columnField);
-        if (index > -1) {
-            columnField.setType(NumCast(type));
-            columns[index] = columnField;
-            this.columns = columns;
-        }
-    });
-
-    @undoBatch
-    setColumnColor = (columnField: SchemaHeaderField, color: string): void => {
-        const columns = this.columns;
-        const index = columns.indexOf(columnField);
-        if (index > -1) {
-            columnField.setColor(color);
-            columns[index] = columnField;
-            this.columns = columns; // need to set the columns to trigger rerender
-        }
-    }
-
-    @undoBatch
-    @action
-    setColumnSort = (columnField: SchemaHeaderField, descending: boolean | undefined) => {
-        const columns = this.columns;
-        columns.forEach(col => col.setDesc(undefined));
-
-        const index = columns.findIndex(c => c.heading === columnField.heading);
-        const column = columns[index];
-        column.setDesc(descending);
-        columns[index] = column;
-        this.columns = columns;
-    }
-
-    renderTypes = (col: any) => {
-        if (columnTypes.get(col.heading)) return (null);
-
-        const type = col.type;
-
-        const anyType = <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Any)}>
-            <FontAwesomeIcon icon={"align-justify"} size="sm" />
-                Any
-            </div>;
-
-        const numType = <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Number)}>
-            <FontAwesomeIcon icon={"hashtag"} size="sm" />
-                Number
-            </div>;
-
-        const textType = <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.String)}>
-            <FontAwesomeIcon icon={"font"} size="sm" />
-            Text
-            </div>;
-
-        const boolType = <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Boolean)}>
-            <FontAwesomeIcon icon={"check-square"} size="sm" />
-            Checkbox
-            </div>;
-
-        const listType = <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.List)}>
-            <FontAwesomeIcon icon={"list-ul"} size="sm" />
-            List
-            </div>;
-
-        const docType = <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Doc)}>
-            <FontAwesomeIcon icon={"file"} size="sm" />
-            Document
-            </div>;
-
-        const imageType = <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Image)}>
-            <FontAwesomeIcon icon={"image"} size="sm" />
-            Image
-            </div>;
-
-        const dateType = <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Date)}>
-            <FontAwesomeIcon icon={"calendar"} size="sm" />
-                Date
-                </div>;
-
-
-        const allColumnTypes = <div className="columnMenu-types">
-            {anyType}
-            {numType}
-            {textType}
-            {boolType}
-            {listType}
-            {docType}
-            {imageType}
-            {dateType}
-        </div>;
-
-        const justColType = type === ColumnType.Any ? anyType : type === ColumnType.Number ? numType :
-            type === ColumnType.String ? textType : type === ColumnType.Boolean ? boolType :
-                type === ColumnType.List ? listType : type === ColumnType.Doc ? docType :
-                    type === ColumnType.Date ? dateType : imageType;
-
-        return (
-            <div className="collectionSchema-headerMenu-group" onClick={action(() => this._openTypes = !this._openTypes)}>
-                <div>
-                    <label style={{ cursor: "pointer" }}>Column type:</label>
-                    <FontAwesomeIcon icon={"caret-down"} size="lg" style={{ float: "right", transform: `rotate(${this._openTypes ? "180deg" : 0})`, transition: "0.2s all ease" }} />
-                </div>
-                {this._openTypes ? allColumnTypes : justColType}
-            </div >
-        );
-    }
-
-    renderSorting = (col: any) => {
-        const sort = col.desc;
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Sort by:</label>
-                <div className="columnMenu-sort">
-                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.setColumnSort(col, true)}>
-                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
-                        Sort descending
-                    </div>
-                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.setColumnSort(col, false)}>
-                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
-                        Sort ascending
-                    </div>
-                    <div className="columnMenu-option" onClick={() => this.setColumnSort(col, undefined)}>
-                        <FontAwesomeIcon icon="times" size="sm" />
-                        Clear sorting
-                    </div>
-                </div>
-            </div>
-        );
-    }
-
-    renderColors = (col: any) => {
-        const selected = col.color;
-
-        const pink = PastelSchemaPalette.get("pink2");
-        const purple = PastelSchemaPalette.get("purple2");
-        const blue = PastelSchemaPalette.get("bluegreen1");
-        const yellow = PastelSchemaPalette.get("yellow4");
-        const red = PastelSchemaPalette.get("red2");
-        const gray = "#f1efeb";
-
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Color:</label>
-                <div className="columnMenu-colors">
-                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.setColumnColor(col, pink!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.setColumnColor(col, purple!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.setColumnColor(col, blue!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.setColumnColor(col, yellow!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.setColumnColor(col, red!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.setColumnColor(col, gray)}></div>
-                </div>
-            </div>
-        );
-    }
-
-    @undoBatch
-    @action
-    changeColumns = (oldKey: string, newKey: string, addNew: boolean, filter?: string) => {
-        const columns = this.columns;
-        if (columns === undefined) {
-            this.columns = new List<SchemaHeaderField>([new SchemaHeaderField(newKey, "f1efeb")]);
-        } else {
-            if (addNew) {
-                columns.push(new SchemaHeaderField(newKey, "f1efeb"));
-                this.columns = columns;
-            } else {
-                const index = columns.map(c => c.heading).indexOf(oldKey);
-                if (index > -1) {
-                    const column = columns[index];
-                    column.setHeading(newKey);
-                    columns[index] = column;
-                    this.columns = columns;
-                    if (filter) {
-                        Doc.setDocFilter(this.props.Document, newKey, filter, "match");
-                    }
-                    else {
-                        this.props.Document._docFilters = undefined;
-                    }
-                }
-            }
-        }
-    }
-
-    @action
-    openHeader = (col: any, screenx: number, screeny: number) => {
-        this._col = col;
-        this._headerOpen = true;
-        this._pointerX = screenx;
-        this._pointerY = screeny;
-    }
-
-    @action
-    closeHeader = () => { this._headerOpen = false; }
-
-    @undoBatch
-    @action
-    deleteColumn = (key: string) => {
-        const columns = this.columns;
-        if (columns === undefined) {
-            this.columns = new List<SchemaHeaderField>([]);
-        } else {
-            const index = columns.map(c => c.heading).indexOf(key);
-            if (index > -1) {
-                columns.splice(index, 1);
-                this.columns = columns;
-            }
-        }
-        this.closeHeader();
-    }
-
-    getPreviewTransform = (): Transform => {
-        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - NumCast(COLLECTION_BORDER_WIDTH) - this.tableWidth, - this.borderWidth);
-    }
-
-    @action
-    onHeaderClick = (e: React.PointerEvent) => {
-        e.stopPropagation();
-    }
-
-    @action
-    onWheel(e: React.WheelEvent) {
-        const scale = this.props.ScreenToLocalTransform().Scale;
-        this.props.isContentActive(true) && e.stopPropagation();
-    }
-
-    @computed get renderMenuContent() {
-        TraceMobx();
-        return <div className="collectionSchema-header-menuOptions">
-            {this.renderTypes(this._col)}
-            {this.renderColors(this._col)}
-            <div className="collectionSchema-headerMenu-group">
-                <button onClick={() => { this.deleteColumn(this._col.heading); }}
-                >Delete Column</button>
-            </div>
-        </div>;
-    }
-
-    private createTarget = (ele: HTMLDivElement) => {
-        this._previewCont = ele;
-        super.CreateDropTarget(ele);
-    }
-
-    isFocused = (doc: Doc, outsideReaction: boolean): boolean => this.props.isSelected(outsideReaction) && doc === this._focusedTable;
-
-    @action setFocused = (doc: Doc) => this._focusedTable = doc;
-
-    @action setPreviewDoc = (doc: Opt<Doc>) => {
-        SelectionManager.SelectSchemaView(this, doc);
-        this._previewDoc = doc;
-    }
-
-    //toggles preview side-panel of schema
-    @action
-    toggleExpander = () => {
-        this.props.Document.schemaPreviewWidth = this.previewWidth() === 0 ? Math.min(this.tableWidth / 3, 200) : 0;
-    }
-
-    onDividerDown = (e: React.PointerEvent) => {
-        setupMoveUpEvents(this, e, this.onDividerMove, emptyFunction, this.toggleExpander);
-    }
-    @action
-    onDividerMove = (e: PointerEvent, down: number[], delta: number[]) => {
-        const nativeWidth = this._previewCont!.getBoundingClientRect();
-        const minWidth = 40;
-        const maxWidth = 1000;
-        const movedWidth = this.props.ScreenToLocalTransform().transformDirection(nativeWidth.right - e.clientX, 0)[0];
-        const width = movedWidth < minWidth ? minWidth : movedWidth > maxWidth ? maxWidth : movedWidth;
-        this.props.Document.schemaPreviewWidth = width;
-        return false;
-    }
-
-    onPointerDown = (e: React.PointerEvent): void => {
-        if (e.button === 0 && !e.altKey && !e.ctrlKey && !e.metaKey) {
-            if (this.props.isSelected(true)) e.stopPropagation();
-            else this.props.select(false);
-        }
-    }
-
-    @computed
-    get previewDocument(): Doc | undefined { return this._previewDoc; }
-
-    @computed
-    get dividerDragger() {
-        return this.previewWidth() === 0 ? (null) :
-            <div className="collectionSchemaView-dividerDragger" onPointerDown={this.onDividerDown} >
-                <div className="collectionSchemaView-dividerDragger" />
-            </div>;
-    }
-
-    @computed
-    get previewPanel() {
-        return <div ref={this.createTarget} style={{ width: `${this.previewWidth()}px` }}>
-            {!this.previewDocument ? (null) :
-                <DocumentView
-                    Document={this.previewDocument}
-                    DataDoc={undefined}
-                    fitContentsToDoc={returnTrue}
-                    freezeDimensions={true}
-                    dontCenter={"y"}
-                    focus={DocUtils.DefaultFocus}
-                    renderDepth={this.props.renderDepth}
-                    rootSelected={this.rootSelected}
-                    PanelWidth={this.previewWidth}
-                    PanelHeight={this.previewHeight}
-                    isContentActive={returnTrue}
-                    isDocumentActive={returnFalse}
-                    ScreenToLocalTransform={this.getPreviewTransform}
-                    docFilters={this.docFilters}
-                    docRangeFilters={this.docRangeFilters}
-                    searchFilterDocs={this.searchFilterDocs}
-                    styleProvider={DefaultStyleProvider}
-                    layerProvider={undefined}
-                    docViewPath={returnEmptyDoclist}
-                    ContainingCollectionDoc={this.props.CollectionView?.props.Document}
-                    ContainingCollectionView={this.props.CollectionView}
-                    moveDocument={this.props.moveDocument}
-                    addDocument={this.props.addDocument}
-                    removeDocument={this.props.removeDocument}
-                    whenChildContentsActiveChanged={this.props.whenChildContentsActiveChanged}
-                    addDocTab={this.props.addDocTab}
-                    pinToPres={this.props.pinToPres}
-                    bringToFront={returnFalse}
-                />}
-        </div>;
-    }
-
-    @computed
-    get schemaTable() {
-        return <SchemaTable
-            Document={this.props.Document}
-            PanelHeight={this.props.PanelHeight}
-            PanelWidth={this.props.PanelWidth}
-            childDocs={this.childDocs}
-            CollectionView={this.props.CollectionView}
-            ContainingCollectionView={this.props.ContainingCollectionView}
-            ContainingCollectionDoc={this.props.ContainingCollectionDoc}
-            fieldKey={this.props.fieldKey}
-            renderDepth={this.props.renderDepth}
-            moveDocument={this.props.moveDocument}
-            ScreenToLocalTransform={this.props.ScreenToLocalTransform}
-            active={this.props.isContentActive}
-            onDrop={this.onExternalDrop}
-            addDocTab={this.props.addDocTab}
-            pinToPres={this.props.pinToPres}
-            isSelected={this.props.isSelected}
-            isFocused={this.isFocused}
-            setFocused={this.setFocused}
-            setPreviewDoc={this.setPreviewDoc}
-            deleteDocument={this.props.removeDocument}
-            addDocument={this.props.addDocument}
-            dataDoc={this.props.DataDoc}
-            columns={this.columns}
-            documentKeys={this.documentKeys}
-            headerIsEditing={this._headerIsEditing}
-            openHeader={this.openHeader}
-            onClick={this.onTableClick}
-            onPointerDown={emptyFunction}
-            onResizedChange={this.onResizedChange}
-            setColumns={this.setColumns}
-            reorderColumns={this.reorderColumns}
-            changeColumns={this.changeColumns}
-            setHeaderIsEditing={this.setHeaderIsEditing}
-            changeColumnSort={this.setColumnSort}
-        />;
-    }
-
-    @computed
-    public get schemaToolbar() {
-        return <div className="collectionSchemaView-toolbar">
-            <div className="collectionSchemaView-toolbar-item">
-                <div id="preview-schema-checkbox-div">
-                    <input type="checkbox" key={"Show Preview"} checked={this.previewWidth() !== 0} onChange={this.toggleExpander} />
-                    Show Preview
-                </div>
-            </div>
-        </div>;
-    }
-
-    onSpecificMenu = (e: React.MouseEvent) => {
-        if ((e.target as any)?.className?.includes?.("collectionSchemaView-cell") || (e.target instanceof HTMLSpanElement)) {
-            const cm = ContextMenu.Instance;
-            const options = cm.findByDescription("Options...");
-            const optionItems: ContextMenuProps[] = options && "subitems" in options ? options.subitems : [];
-            optionItems.push({ description: "remove", event: () => this._previewDoc && this.props.removeDocument?.(this._previewDoc), icon: "trash" });
-            !options && cm.addItem({ description: "Options...", subitems: optionItems, icon: "compass" });
-            cm.displayMenu(e.clientX, e.clientY);
-            (e.nativeEvent as any).SchemaHandled = true; // not sure why this is needed, but if you right-click quickly on a cell, the Document/Collection contextMenu handlers still fire without this.
-            e.stopPropagation();
-        }
-    }
-
-    @action
-    onTableClick = (e: React.MouseEvent): void => {
-        if (!(e.target as any)?.className?.includes?.("collectionSchemaView-cell") && !(e.target instanceof HTMLSpanElement)) {
-            this.setPreviewDoc(undefined);
-        } else {
-            e.stopPropagation();
-        }
-        this.setFocused(this.props.Document);
-        this.closeHeader();
-    }
-
-    onResizedChange = (newResized: Resize[], event: any) => {
-        const columns = this.columns;
-        newResized.forEach(resized => {
-            const index = columns.findIndex(c => c.heading === resized.id);
-            const column = columns[index];
-            column.setWidth(resized.value);
-            columns[index] = column;
-        });
-        this.columns = columns;
-    }
-
-    @action
-    setColumns = (columns: SchemaHeaderField[]) => this.columns = columns
-
-    @undoBatch
-    reorderColumns = (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => {
-        const columns = [...columnsValues];
-        const oldIndex = columns.indexOf(toMove);
-        const relIndex = columns.indexOf(relativeTo);
-        const newIndex = (oldIndex > relIndex && !before) ? relIndex + 1 : (oldIndex < relIndex && before) ? relIndex - 1 : relIndex;
-
-        if (oldIndex === newIndex) return;
-
-        columns.splice(newIndex, 0, columns.splice(oldIndex, 1)[0]);
-        this.columns = columns;
-    }
-
-    onZoomMenu = (e: React.WheelEvent) => this.props.isContentActive(true) && e.stopPropagation();
-
-    render() {
-        TraceMobx();
-        if (!this.props.isContentActive()) setTimeout(() => this.closeHeader(), 0);
-        const menuContent = this.renderMenuContent;
-        const menu = <div className="collectionSchema-header-menu"
-            onWheel={e => this.onZoomMenu(e)}
-            onPointerDown={e => this.onHeaderClick(e)}
-            style={{ transform: `translate(${(this.menuCoordinates[0])}px, ${(this.menuCoordinates[1])}px)` }}>
-            <Measure offset onResize={action((r: any) => {
-                const dim = this.props.ScreenToLocalTransform().inverse().transformDirection(r.offset.width, r.offset.height);
-                this._menuWidth = dim[0]; this._menuHeight = dim[1];
-            })}>
-                {({ measureRef }) => <div ref={measureRef}> {menuContent} </div>}
-            </Measure>
-        </div>;
-        return <div className={"collectionSchemaView" + (this.props.Document._searchDoc ? "-searchContainer" : "-container")}
-            style={{
-                overflow: this.props.scrollOverflow === true ? "scroll" : undefined, backgroundColor: "white",
-                pointerEvents: this.props.Document._searchDoc !== undefined && !this.props.isContentActive() && !SnappingManager.GetIsDragging() ? "none" : undefined,
-                width: name === "collectionSchemaView-searchContainer" ? "auto" : this.props.PanelWidth() || "100%", height: this.props.PanelHeight() || "100%", position: "relative",
-            }}  >
-            <div className="collectionSchemaView-tableContainer"
-                style={{ width: `calc(100% - ${this.previewWidth()}px)` }}
-                onContextMenu={this.onSpecificMenu}
-                onPointerDown={this.onPointerDown}
-                onWheel={e => this.props.isContentActive(true) && e.stopPropagation()}
-                onDrop={e => this.onExternalDrop(e, {})}
-                ref={this.createTarget}>
-                {this.schemaTable}
-            </div>
-            {this.dividerDragger}
-            {!this.previewWidth() ? (null) : this.previewPanel}
-            {this._headerOpen && this.props.isContentActive() ? menu : null}
-        </div>;
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/SchemaTable.tsx b/src/client/views/collections/schemaView/SchemaTable.tsx
deleted file mode 100644
index 0d5c9e077..000000000
--- a/src/client/views/collections/schemaView/SchemaTable.tsx
+++ /dev/null
@@ -1,601 +0,0 @@
-import React = require("react");
-import { IconProp } from '@fortawesome/fontawesome-svg-core';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { action, computed, observable } from "mobx";
-import { observer } from "mobx-react";
-import ReactTable, { CellInfo, Column, ComponentPropsGetterR, Resize, SortingRule } from "react-table";
-import "react-table/react-table.css";
-import { DateField } from "../../../../fields/DateField";
-import { AclPrivate, AclReadonly, DataSym, Doc, DocListCast, Field, Opt } from "../../../../fields/Doc";
-import { Id } from "../../../../fields/FieldSymbols";
-import { List } from "../../../../fields/List";
-import { listSpec } from "../../../../fields/Schema";
-import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
-import { ComputedField } from "../../../../fields/ScriptField";
-import { Cast, FieldValue, NumCast, StrCast } from "../../../../fields/Types";
-import { ImageField } from "../../../../fields/URLField";
-import { GetEffectiveAcl } from "../../../../fields/util";
-import { emptyFunction, emptyPath, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue } from "../../../../Utils";
-import { Docs, DocumentOptions, DocUtils } from "../../../documents/Documents";
-import { DocumentType } from "../../../documents/DocumentTypes";
-import { CompileScript, Transformer, ts } from "../../../util/Scripting";
-import { Transform } from "../../../util/Transform";
-import { undoBatch } from "../../../util/UndoManager";
-import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../globalCssVariables.scss';
-import { ContextMenu } from "../../ContextMenu";
-import '../../../views/DocumentDecorations.scss';
-import { DocumentView } from "../../nodes/DocumentView";
-import { DefaultStyleProvider } from "../../StyleProvider";
-import { CellProps, CollectionSchemaButtons, CollectionSchemaCell, CollectionSchemaCheckboxCell, CollectionSchemaDateCell, CollectionSchemaDocCell, CollectionSchemaImageCell, CollectionSchemaListCell, CollectionSchemaNumberCell, CollectionSchemaStringCell } from "./CollectionSchemaCells";
-import { CollectionSchemaAddColumnHeader, KeysDropdown } from "./CollectionSchemaHeaders";
-import { MovableColumn } from "./CollectionSchemaMovableColumn";
-import { MovableRow } from "./CollectionSchemaMovableRow";
-import "./CollectionSchemaView.scss";
-import { CollectionView } from "../CollectionView";
-
-
-enum ColumnType {
-    Any,
-    Number,
-    String,
-    Boolean,
-    Doc,
-    Image,
-    List,
-    Date
-}
-
-// this map should be used for keys that should have a const type of value
-const columnTypes: Map<string, ColumnType> = new Map([
-    ["title", ColumnType.String],
-    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
-    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
-    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
-]);
-
-export interface SchemaTableProps {
-    Document: Doc; // child doc
-    dataDoc?: Doc;
-    PanelHeight: () => number;
-    PanelWidth: () => number;
-    childDocs?: Doc[];
-    CollectionView: Opt<CollectionView>;
-    ContainingCollectionView: Opt<CollectionView>;
-    ContainingCollectionDoc: Opt<Doc>;
-    fieldKey: string;
-    renderDepth: number;
-    deleteDocument?: (document: Doc | Doc[]) => boolean;
-    addDocument?: (document: Doc | Doc[]) => boolean;
-    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (document: Doc | Doc[]) => boolean) => boolean;
-    ScreenToLocalTransform: () => Transform;
-    active: (outsideReaction: boolean | undefined) => boolean;
-    onDrop: (e: React.DragEvent<Element>, options: DocumentOptions, completed?: (() => void) | undefined) => void;
-    addDocTab: (document: Doc, where: string) => boolean;
-    pinToPres: (document: Doc) => void;
-    isSelected: (outsideReaction?: boolean) => boolean;
-    isFocused: (document: Doc, outsideReaction: boolean) => boolean;
-    setFocused: (document: Doc) => void;
-    setPreviewDoc: (document: Opt<Doc>) => void;
-    columns: SchemaHeaderField[];
-    documentKeys: any[];
-    headerIsEditing: boolean;
-    openHeader: (column: any, screenx: number, screeny: number) => void;
-    onClick: (e: React.MouseEvent) => void;
-    onPointerDown: (e: React.PointerEvent) => void;
-    onResizedChange: (newResized: Resize[], event: any) => void;
-    setColumns: (columns: SchemaHeaderField[]) => void;
-    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => void;
-    changeColumns: (oldKey: string, newKey: string, addNew: boolean) => void;
-    setHeaderIsEditing: (isEditing: boolean) => void;
-    changeColumnSort: (columnField: SchemaHeaderField, descending: boolean | undefined) => void;
-}
-
-@observer
-export class SchemaTable extends React.Component<SchemaTableProps> {
-    @observable _cellIsEditing: boolean = false;
-    @observable _focusedCell: { row: number, col: number } = { row: 0, col: 0 };
-    @observable _openCollections: Set<number> = new Set;
-
-    @observable _showDoc: Doc | undefined;
-    @observable _showDataDoc: any = "";
-    @observable _showDocPos: number[] = [];
-
-    @observable _showTitleDropdown: boolean = false;
-
-    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
-    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
-    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
-
-    @computed get childDocs() {
-        if (this.props.childDocs) return this.props.childDocs;
-
-        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
-        return DocListCast(doc[this.props.fieldKey]);
-    }
-    set childDocs(docs: Doc[]) {
-        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
-        doc[this.props.fieldKey] = new List<Doc>(docs);
-    }
-
-    @computed get textWrappedRows() {
-        return Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
-    }
-    set textWrappedRows(textWrappedRows: string[]) {
-        this.props.Document.textwrappedSchemaRows = new List<string>(textWrappedRows);
-    }
-
-    @computed get resized(): { id: string, value: number }[] {
-        return this.props.columns.reduce((resized, shf) => {
-            (shf.width > -1) && resized.push({ id: shf.heading, value: shf.width });
-            return resized;
-        }, [] as { id: string, value: number }[]);
-    }
-    @computed get sorted(): SortingRule[] {
-        return this.props.columns.reduce((sorted, shf) => {
-            shf.desc !== undefined && sorted.push({ id: shf.heading, desc: shf.desc });
-            return sorted;
-        }, [] as SortingRule[]);
-    }
-
-    @action
-    changeSorting = (col: any) => {
-        this.props.changeColumnSort(col, col.desc === true ? false : col.desc === false ? undefined : true);
-    }
-
-    @action
-    changeTitleMode = () => this._showTitleDropdown = !this._showTitleDropdown
-
-    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
-    @computed get tableColumns(): Column<Doc>[] {
-        const possibleKeys = this.props.documentKeys.filter(key => this.props.columns.findIndex(existingKey => existingKey.heading.toUpperCase() === key.toUpperCase()) === -1);
-        const columns: Column<Doc>[] = [];
-        const tableIsFocused = this.props.isFocused(this.props.Document, false);
-        const focusedRow = this._focusedCell.row;
-        const focusedCol = this._focusedCell.col;
-        const isEditable = !this.props.headerIsEditing;
-
-        columns.push({
-            expander: true, Header: "", width: 58,
-            Expander: (rowInfo) => {
-                return rowInfo.original.type !== DocumentType.COL ? (null) :
-                    <div className="collectionSchemaView-expander" onClick={action(() => (this._openCollections[rowInfo.isExpanded ? "delete" : "add"])(rowInfo.viewIndex))}>
-                        <FontAwesomeIcon icon={rowInfo.isExpanded ? "caret-down" : "caret-right"} size="lg" />
-                    </div>;
-            }
-        });
-        columns.push(...this.props.columns.map(col => {
-            const icon: IconProp = this.getColumnType(col) === ColumnType.Number ? "hashtag" : this.getColumnType(col) === ColumnType.String ? "font" :
-                this.getColumnType(col) === ColumnType.Boolean ? "check-square" : this.getColumnType(col) === ColumnType.Doc ? "file" :
-                    this.getColumnType(col) === ColumnType.Image ? "image" : this.getColumnType(col) === ColumnType.List ? "list-ul" :
-                        this.getColumnType(col) === ColumnType.Date ? "calendar" : "align-justify";
-
-            const keysDropdown = <KeysDropdown
-                keyValue={col.heading}
-                possibleKeys={possibleKeys}
-                existingKeys={this.props.columns.map(c => c.heading)}
-                canAddNew={true}
-                addNew={false}
-                onSelect={this.props.changeColumns}
-                setIsEditing={this.props.setHeaderIsEditing}
-                docs={this.props.childDocs}
-                Document={this.props.Document}
-                dataDoc={this.props.dataDoc}
-                fieldKey={this.props.fieldKey}
-                ContainingCollectionDoc={this.props.ContainingCollectionDoc}
-                ContainingCollectionView={this.props.ContainingCollectionView}
-                active={this.props.active}
-                openHeader={this.props.openHeader}
-                icon={icon}
-                col={col}
-                // try commenting this out
-                width={"100%"}
-            />;
-
-            const sortIcon = col.desc === undefined ? "caret-right" : col.desc === true ? "caret-down" : "caret-up";
-            const header = <div className="collectionSchemaView-menuOptions-wrapper" style={{ background: col.color, padding: "2px", display: "flex", cursor: "default", height: "100%", }}>
-                {keysDropdown}
-                <div onClick={e => this.changeSorting(col)} style={{ width: 21, padding: 1, display: "inline", zIndex: 1, background: "inherit", cursor: "hand" }}>
-                    <FontAwesomeIcon icon={sortIcon} size="lg" />
-                </div>
-            </div>;
-
-            return {
-                Header: <MovableColumn columnRenderer={header} columnValue={col} allColumns={this.props.columns} reorderColumns={this.props.reorderColumns} ScreenToLocalTransform={this.props.ScreenToLocalTransform} />,
-                accessor: (doc: Doc) => doc ? Field.toString(doc[col.heading] as Field) : 0,
-                id: col.heading,
-                Cell: (rowProps: CellInfo) => {
-                    const rowIndex = rowProps.index;
-                    const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
-                    const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
-
-                    const props: CellProps = {
-                        row: rowIndex,
-                        col: columnIndex,
-                        rowProps: rowProps,
-                        isFocused: isFocused,
-                        changeFocusedCellByIndex: this.changeFocusedCellByIndex,
-                        CollectionView: this.props.CollectionView,
-                        ContainingCollection: this.props.ContainingCollectionView,
-                        Document: this.props.Document,
-                        fieldKey: this.props.fieldKey,
-                        renderDepth: this.props.renderDepth,
-                        addDocTab: this.props.addDocTab,
-                        pinToPres: this.props.pinToPres,
-                        moveDocument: this.props.moveDocument,
-                        setIsEditing: this.setCellIsEditing,
-                        isEditable: isEditable,
-                        setPreviewDoc: this.props.setPreviewDoc,
-                        setComputed: this.setComputed,
-                        getField: this.getField,
-                        showDoc: this.showDoc,
-                    };
-
-
-                    switch (this.getColumnType(col, rowProps.original, rowProps.column.id)) {
-                        case ColumnType.Number: return <CollectionSchemaNumberCell {...props} />;
-                        case ColumnType.String: return <CollectionSchemaStringCell {...props} />;
-                        case ColumnType.Boolean: return <CollectionSchemaCheckboxCell {...props} />;
-                        case ColumnType.Doc: return <CollectionSchemaDocCell {...props} />;
-                        case ColumnType.Image: return <CollectionSchemaImageCell {...props} />;
-                        case ColumnType.List: return <CollectionSchemaListCell {...props} />;
-                        case ColumnType.Date: return <CollectionSchemaDateCell {...props} />;
-                        default:
-                            return <CollectionSchemaCell {...props} />;
-                    }
-                },
-                minWidth: 200,
-            };
-        }));
-        columns.push({
-            Header: <CollectionSchemaAddColumnHeader createColumn={this.createColumn} />,
-            accessor: (doc: Doc) => 0,
-            id: "add",
-            Cell: (rowProps: CellInfo) => {
-                const rowIndex = rowProps.index;
-                const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
-                const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
-                return <CollectionSchemaButtons  {...{
-                    row: rowProps.index,
-                    col: columnIndex,
-                    rowProps: rowProps,
-                    isFocused: isFocused,
-                    changeFocusedCellByIndex: this.changeFocusedCellByIndex,
-                    CollectionView: this.props.CollectionView,
-                    ContainingCollection: this.props.ContainingCollectionView,
-                    Document: this.props.Document,
-                    fieldKey: this.props.fieldKey,
-                    renderDepth: this.props.renderDepth,
-                    addDocTab: this.props.addDocTab,
-                    pinToPres: this.props.pinToPres,
-                    moveDocument: this.props.moveDocument,
-                    setIsEditing: this.setCellIsEditing,
-                    isEditable: isEditable,
-                    setPreviewDoc: this.props.setPreviewDoc,
-                    setComputed: this.setComputed,
-                    getField: this.getField,
-                    showDoc: this.showDoc,
-                }} />;
-            },
-            width: 28,
-            resizable: false
-        });
-        return columns;
-    }
-
-
-    constructor(props: SchemaTableProps) {
-        super(props);
-        if (this.props.Document._schemaHeaders === undefined) {
-            this.props.Document._schemaHeaders = new List<SchemaHeaderField>([new SchemaHeaderField("title", "#f1efeb"), new SchemaHeaderField("author", "#f1efeb"), new SchemaHeaderField("*lastModified", "#f1efeb", ColumnType.Date),
-            new SchemaHeaderField("text", "#f1efeb", ColumnType.String), new SchemaHeaderField("type", "#f1efeb"), new SchemaHeaderField("context", "#f1efeb", ColumnType.Doc)]);
-        }
-    }
-
-    componentDidMount() {
-        document.addEventListener("keydown", this.onKeyDown);
-    }
-
-    componentWillUnmount() {
-        document.removeEventListener("keydown", this.onKeyDown);
-    }
-
-    tableAddDoc = (doc: Doc, relativeTo?: Doc, before?: boolean) => {
-        const tableDoc = this.props.Document[DataSym];
-        const effectiveAcl = GetEffectiveAcl(tableDoc);
-
-        if (effectiveAcl !== AclPrivate && effectiveAcl !== AclReadonly) {
-            doc.context = this.props.Document;
-            tableDoc[this.props.fieldKey + "-lastModified"] = new DateField(new Date(Date.now()));
-            return Doc.AddDocToList(this.props.Document, this.props.fieldKey, doc, relativeTo, before);
-        }
-        return false;
-    }
-
-    private getTrProps: ComponentPropsGetterR = (state, rowInfo) => {
-        return !rowInfo ? {} : {
-            ScreenToLocalTransform: this.props.ScreenToLocalTransform,
-            addDoc: this.tableAddDoc,
-            removeDoc: this.props.deleteDocument,
-            rowInfo,
-            rowFocused: !this.props.headerIsEditing && rowInfo.index === this._focusedCell.row && this.props.isFocused(this.props.Document, true),
-            textWrapRow: this.toggleTextWrapRow,
-            rowWrapped: this.textWrappedRows.findIndex(id => rowInfo.original[Id] === id) > -1,
-            dropAction: StrCast(this.props.Document.childDropAction),
-            addDocTab: this.props.addDocTab
-        };
-    }
-
-    private getTdProps: ComponentPropsGetterR = (state, rowInfo, column, instance) => {
-        if (!rowInfo || column) return {};
-
-        const row = rowInfo.index;
-        //@ts-ignore
-        const col = this.columns.map(c => c.heading).indexOf(column!.id);
-        const isFocused = this._focusedCell.row === row && this._focusedCell.col === col && this.props.isFocused(this.props.Document, true);
-        // TODO: editing border doesn't work :(
-        return {
-            style: { border: !this.props.headerIsEditing && isFocused ? "2px solid rgb(255, 160, 160)" : "1px solid #f1efeb" }
-        };
-    }
-
-    @action setCellIsEditing = (isEditing: boolean) => this._cellIsEditing = isEditing;
-
-    @action
-    onKeyDown = (e: KeyboardEvent): void => {
-        if (!this._cellIsEditing && !this.props.headerIsEditing && this.props.isFocused(this.props.Document, true)) {// && this.props.isSelected(true)) {
-            const direction = e.key === "Tab" ? "tab" : e.which === 39 ? "right" : e.which === 37 ? "left" : e.which === 38 ? "up" : e.which === 40 ? "down" : "";
-            this._focusedCell = this.changeFocusedCellByDirection(direction, this._focusedCell.row, this._focusedCell.col);
-
-            if (direction) {
-                const pdoc = FieldValue(this.childDocs[this._focusedCell.row]);
-                pdoc && this.props.setPreviewDoc(pdoc);
-                e.stopPropagation();
-            }
-        } else if (e.keyCode === 27) {
-            this.props.setPreviewDoc(undefined);
-            e.stopPropagation(); // stopPropagation for left/right arrows 
-        }
-    }
-
-    changeFocusedCellByDirection = (direction: string, curRow: number, curCol: number) => {
-        switch (direction) {
-            case "tab": return { row: (curRow + 1 === this.childDocs.length ? 0 : curRow + 1), col: curCol + 1 === this.props.columns.length ? 0 : curCol + 1 };
-            case "right": return { row: curRow, col: curCol + 1 === this.props.columns.length ? curCol : curCol + 1 };
-            case "left": return { row: curRow, col: curCol === 0 ? curCol : curCol - 1 };
-            case "up": return { row: curRow === 0 ? curRow : curRow - 1, col: curCol };
-            case "down": return { row: curRow + 1 === this.childDocs.length ? curRow : curRow + 1, col: curCol };
-        }
-        return this._focusedCell;
-    }
-
-    @action
-    changeFocusedCellByIndex = (row: number, col: number): void => {
-        if (this._focusedCell.row !== row || this._focusedCell.col !== col) {
-            this._focusedCell = { row: row, col: col };
-        }
-        this.props.setFocused(this.props.Document);
-    }
-
-    @undoBatch
-    createRow = action(() => {
-        this.props.addDocument?.(Docs.Create.TextDocument("", { title: "", _width: 100, _height: 30 }));
-        this._focusedCell = { row: this.childDocs.length, col: this._focusedCell.col };
-    });
-
-    @undoBatch
-    @action
-    createColumn = () => {
-        let index = 0;
-        let found = this.props.columns.findIndex(col => col.heading.toUpperCase() === "New field".toUpperCase()) > -1;
-        while (found) {
-            index++;
-            found = this.props.columns.findIndex(col => col.heading.toUpperCase() === ("New field (" + index + ")").toUpperCase()) > -1;
-        }
-        this.props.columns.push(new SchemaHeaderField(`New field ${index ? "(" + index + ")" : ""}`, "#f1efeb"));
-    }
-
-    @action
-    getColumnType = (column: SchemaHeaderField, doc?: Doc, field?: string): ColumnType => {
-        if (doc && field && column.type === ColumnType.Any) {
-            const val = doc[CollectionSchemaCell.resolvedFieldKey(field, doc)];
-            if (val instanceof ImageField) return ColumnType.Image;
-            if (val instanceof Doc) return ColumnType.Doc;
-            if (val instanceof DateField) return ColumnType.Date;
-            if (val instanceof List) return ColumnType.List;
-        }
-        if (column.type && column.type !== 0) {
-            return column.type;
-        }
-        if (columnTypes.get(column.heading)) {
-            return column.type = columnTypes.get(column.heading)!;
-        }
-        return column.type = ColumnType.Any;
-    }
-
-    @undoBatch
-    @action
-    toggleTextwrap = async () => {
-        const textwrappedRows = Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
-        if (textwrappedRows.length) {
-            this.props.Document.textwrappedSchemaRows = new List<string>([]);
-        } else {
-            const docs = DocListCast(this.props.Document[this.props.fieldKey]);
-            const allRows = docs instanceof Doc ? [docs[Id]] : docs.map(doc => doc[Id]);
-            this.props.Document.textwrappedSchemaRows = new List<string>(allRows);
-        }
-    }
-
-    @action
-    toggleTextWrapRow = (doc: Doc): void => {
-        const textWrapped = this.textWrappedRows;
-        const index = textWrapped.findIndex(id => doc[Id] === id);
-
-        index > -1 ? textWrapped.splice(index, 1) : textWrapped.push(doc[Id]);
-
-        this.textWrappedRows = textWrapped;
-    }
-
-    @computed
-    get reactTable() {
-        const children = this.childDocs;
-        const hasCollectionChild = children.reduce((found, doc) => found || doc.type === DocumentType.COL, false);
-        const expanded: { [name: string]: any } = {};
-        Array.from(this._openCollections.keys()).map(col => expanded[col.toString()] = true);
-        const rerender = [...this.textWrappedRows]; // TODO: get component to rerender on text wrap change without needign to console.log :((((
-
-        return <ReactTable
-            style={{ position: "relative" }}
-            data={children}
-            page={0}
-            pageSize={children.length}
-            showPagination={false}
-            columns={this.tableColumns}
-            getTrProps={this.getTrProps}
-            getTdProps={this.getTdProps}
-            sortable={false}
-            TrComponent={MovableRow}
-            sorted={this.sorted}
-            expanded={expanded}
-            resized={this.resized}
-            onResizedChange={this.props.onResizedChange}
-            // if it has a child, render another table with the children
-            SubComponent={!hasCollectionChild ? undefined : row => (row.original.type !== DocumentType.COL) ? (null) :
-                <div style={{ paddingLeft: 57 + "px" }} className="reactTable-sub"><SchemaTable {...this.props} Document={row.original} dataDoc={undefined} childDocs={undefined} /></div>}
-
-        />;
-    }
-
-    onContextMenu = (e: React.MouseEvent): void => {
-        ContextMenu.Instance.addItem({ description: "Toggle text wrapping", event: this.toggleTextwrap, icon: "table" });
-    }
-
-    getField = (row: number, col?: number) => {
-        const docs = this.childDocs;
-
-        row = row % docs.length;
-        while (row < 0) row += docs.length;
-        const columns = this.props.columns;
-        const doc = docs[row];
-        if (col === undefined) {
-            return doc;
-        }
-        if (col >= 0 && col < columns.length) {
-            const column = this.props.columns[col].heading;
-            return doc[column];
-        }
-        return undefined;
-    }
-
-    createTransformer = (row: number, col: number): Transformer => {
-        const self = this;
-        const captures: { [name: string]: Field } = {};
-
-        const transformer: ts.TransformerFactory<ts.SourceFile> = context => {
-            return root => {
-                function visit(node: ts.Node) {
-                    node = ts.visitEachChild(node, visit, context);
-                    if (ts.isIdentifier(node)) {
-                        const isntPropAccess = !ts.isPropertyAccessExpression(node.parent) || node.parent.expression === node;
-                        const isntPropAssign = !ts.isPropertyAssignment(node.parent) || node.parent.name !== node;
-                        if (isntPropAccess && isntPropAssign) {
-                            if (node.text === "$r") {
-                                return ts.createNumericLiteral(row.toString());
-                            } else if (node.text === "$c") {
-                                return ts.createNumericLiteral(col.toString());
-                            } else if (node.text === "$") {
-                                if (ts.isCallExpression(node.parent)) {
-                                    // captures.doc = self.props.Document;
-                                    // captures.key = self.props.fieldKey;
-                                }
-                            }
-                        }
-                    }
-
-                    return node;
-                }
-                return ts.visitNode(root, visit);
-            };
-        };
-
-        // const getVars = () => {
-        //     return { capturedVariables: captures };
-        // };
-
-        return { transformer, /*getVars*/ };
-    }
-
-    setComputed = (script: string, doc: Doc, field: string, row: number, col: number): boolean => {
-        script =
-            `const $ = (row:number, col?:number) => {
-                const rval = (doc as any)[key][row + ${row}];
-                return col === undefined ? rval : rval[(doc as any)._schemaHeaders[col + ${col}].heading];
-            }
-            return ${script}`;
-        const compiled = CompileScript(script, { params: { this: Doc.name }, capturedVariables: { doc: this.props.Document, key: this.props.fieldKey }, typecheck: false, transformer: this.createTransformer(row, col) });
-        if (compiled.compiled) {
-            doc[field] = new ComputedField(compiled);
-            return true;
-        }
-        return false;
-    }
-
-    @action
-    showDoc = (doc: Doc | undefined, dataDoc?: Doc, screenX?: number, screenY?: number) => {
-        this._showDoc = doc;
-        if (dataDoc && screenX && screenY) {
-            this._showDocPos = this.props.ScreenToLocalTransform().transformPoint(screenX, screenY);
-        }
-    }
-
-    onOpenClick = () => {
-        this._showDoc && this.props.addDocTab(this._showDoc, "add:right");
-    }
-
-    getPreviewTransform = (): Transform => {
-        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - 4 - this.tableWidth, - this.borderWidth);
-    }
-
-    render() {
-        const preview = "";
-        return <div className="collectionSchemaView-table"
-            onPointerDown={this.props.onPointerDown} onClick={this.props.onClick} onWheel={e => this.props.active(true) && e.stopPropagation()}
-            onDrop={e => this.props.onDrop(e, {})} onContextMenu={this.onContextMenu} >
-            {this.reactTable}
-            {this.props.Document._chromeHidden ? undefined : <div className="collectionSchemaView-addRow" onClick={this.createRow}>+ new</div>}
-            {!this._showDoc ? (null) :
-                <div className="collectionSchemaView-documentPreview" ref="overlay"
-                    style={{
-                        position: "absolute", width: 150, height: 150,
-                        background: "dimGray", display: "block", top: 0, left: 0,
-                        transform: `translate(${this._showDocPos[0]}px, ${this._showDocPos[1] - 180}px)`
-                    }} >
-                    <DocumentView
-                        Document={this._showDoc}
-                        DataDoc={this._showDataDoc}
-                        styleProvider={DefaultStyleProvider}
-                        layerProvider={undefined}
-                        docViewPath={returnEmptyDoclist}
-                        freezeDimensions={true}
-                        focus={DocUtils.DefaultFocus}
-                        renderDepth={this.props.renderDepth}
-                        rootSelected={returnFalse}
-                        isContentActive={returnTrue}
-                        isDocumentActive={returnFalse}
-                        PanelWidth={() => 150}
-                        PanelHeight={() => 150}
-                        ScreenToLocalTransform={this.getPreviewTransform}
-                        docFilters={returnEmptyFilter}
-                        docRangeFilters={returnEmptyFilter}
-                        searchFilterDocs={returnEmptyDoclist}
-                        ContainingCollectionDoc={this.props.CollectionView?.props.Document}
-                        ContainingCollectionView={this.props.CollectionView}
-                        moveDocument={this.props.moveDocument}
-                        whenChildContentsActiveChanged={emptyFunction}
-                        addDocTab={this.props.addDocTab}
-                        pinToPres={this.props.pinToPres}
-                        bringToFront={returnFalse}>
-                    </DocumentView>
-                </div>}
-        </div>;
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx
index ecf4c0901..34488ffbe 100644
--- a/src/client/views/nodes/DocumentContentsView.tsx
+++ b/src/client/views/nodes/DocumentContentsView.tsx
@@ -8,7 +8,7 @@ import { emptyPath, OmitKeys, Without } from "../../../Utils";
 import { DirectoryImportBox } from "../../util/Import & Export/DirectoryImportBox";
 import { CollectionDockingView } from "../collections/CollectionDockingView";
 import { CollectionFreeFormView } from "../collections/collectionFreeForm/CollectionFreeFormView";
-import { CollectionSchemaView } from "../collections/schemaView/CollectionSchemaView";
+import { CollectionSchemaView } from "../collections/collectionSchema/CollectionSchemaView";
 import { CollectionView } from "../collections/CollectionView";
 import { InkingStroke } from "../InkingStroke";
 import { PresElementBox } from "../presentationview/PresElementBox";
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index a671c955d..6a2325342 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -18,7 +18,7 @@ import { SetupDrag } from '../../util/DragManager';
 import { SearchUtil } from '../../util/SearchUtil';
 import { Transform } from '../../util/Transform';
 import { CollectionDockingView } from "../collections/CollectionDockingView";
-import { CollectionSchemaView, ColumnType } from "../collections/schemaView/CollectionSchemaView";
+import { CollectionSchemaView, ColumnType } from "../collections/collectionSchema/CollectionSchemaView";
 import { CollectionViewType } from '../collections/CollectionView';
 import { ViewBoxBaseComponent } from "../DocComponent";
 import { FieldView, FieldViewProps } from '../nodes/FieldView';
@@ -522,7 +522,7 @@ export class SearchBox extends ViewBoxBaseComponent<FieldViewProps, SearchBoxDoc
                             {`${Doc.CurrentUserEmail}`}
                             <div className="searchBox-logoff" onClick={() => window.location.assign(Utils.prepend("/logout"))}>
                                 Logoff
-                        </div>
+                            </div>
                         </div>
                         <div className="searchBox-lozenge" onClick={() => DocServer.UPDATE_SERVER_CACHE()}>
                             {`UI project`}
@@ -534,10 +534,10 @@ export class SearchBox extends ViewBoxBaseComponent<FieldViewProps, SearchBoxDoc
                             </select>
                             <div className="searchBox-dashboards" onClick={undoBatch(() => CurrentUserUtils.createNewDashboard(Doc.UserDoc()))}>
                                 New
-                        </div>
+                            </div>
                             <div className="searchBox-dashboards" onClick={undoBatch(() => CurrentUserUtils.snapshotDashboard(Doc.UserDoc()))}>
                                 Snapshot
-                        </div>
+                            </div>
                         </div>
                     </div>
                     <div className="searchBox-query" >
diff --git a/src/fields/SchemaHeaderField.ts b/src/fields/SchemaHeaderField.ts
index 74cf934f2..a53fa542e 100644
--- a/src/fields/SchemaHeaderField.ts
+++ b/src/fields/SchemaHeaderField.ts
@@ -3,7 +3,7 @@ import { serializable, primitive } from "serializr";
 import { ObjectField } from "./ObjectField";
 import { Copy, ToScriptString, ToString, OnUpdate } from "./FieldSymbols";
 import { scriptingGlobal } from "../client/util/Scripting";
-import { ColumnType } from "../client/views/collections/schemaView/CollectionSchemaView";
+import { ColumnType } from "../client/views/collections/collectionSchema/CollectionSchemaView";
 
 export const PastelSchemaPalette = new Map<string, string>([
     // ["pink1", "#FFB4E8"],
-- 
cgit v1.2.3-70-g09d2


From 21c5e8d623fccc4d750e202eba501587bc1a1f16 Mon Sep 17 00:00:00 2001
From: geireann <geireann_lindfield_roberts@brown.edu>
Date: Mon, 12 Jul 2021 13:57:08 -0400
Subject: Revert "Merge pull request #13 from
 brown-dash/revert-12-schema-view-En-Hua"

This reverts commit ac561d34fa56584a10c401900e76a8a2e06a0cf6, reversing
changes made to 0443cb9267d808513e181e3130d69dde8e73018e.
---
 .idea/.gitignore                                   |   3 +
 .idea/Dash-Web.iml                                 |   9 +
 .idea/modules.xml                                  |   8 +
 .idea/vcs.xml                                      |   6 +
 src/client/util/SelectionManager.ts                |   2 +-
 .../views/collections/CollectionSchemaCells.tsx    | 529 -----------------
 .../views/collections/CollectionSchemaHeaders.tsx  | 518 -----------------
 .../CollectionSchemaMovableTableHOC.tsx            | 258 ---------
 .../views/collections/CollectionSchemaView.scss    | 641 ---------------------
 .../views/collections/CollectionSchemaView.tsx     | 575 ------------------
 src/client/views/collections/CollectionView.tsx    |   2 +-
 src/client/views/collections/SchemaTable.tsx       | 599 -------------------
 .../schemaView/CollectionSchemaCells.tsx           | 585 +++++++++++++++++++
 .../schemaView/CollectionSchemaHeaders.tsx         | 518 +++++++++++++++++
 .../schemaView/CollectionSchemaMovableColumn.tsx   | 128 ++++
 .../schemaView/CollectionSchemaMovableRow.tsx      | 147 +++++
 .../schemaView/CollectionSchemaView.scss           | 552 ++++++++++++++++++
 .../schemaView/CollectionSchemaView.tsx            | 575 ++++++++++++++++++
 .../views/collections/schemaView/SchemaTable.tsx   | 601 +++++++++++++++++++
 src/client/views/nodes/DocumentContentsView.tsx    |   2 +-
 src/client/views/search/SearchBox.tsx              |   4 +-
 src/fields/SchemaHeaderField.ts                    |   2 +-
 22 files changed, 3138 insertions(+), 3126 deletions(-)
 create mode 100644 .idea/.gitignore
 create mode 100644 .idea/Dash-Web.iml
 create mode 100644 .idea/modules.xml
 create mode 100644 .idea/vcs.xml
 delete mode 100644 src/client/views/collections/CollectionSchemaCells.tsx
 delete mode 100644 src/client/views/collections/CollectionSchemaHeaders.tsx
 delete mode 100644 src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
 delete mode 100644 src/client/views/collections/CollectionSchemaView.scss
 delete mode 100644 src/client/views/collections/CollectionSchemaView.tsx
 delete mode 100644 src/client/views/collections/SchemaTable.tsx
 create mode 100644 src/client/views/collections/schemaView/CollectionSchemaCells.tsx
 create mode 100644 src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
 create mode 100644 src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
 create mode 100644 src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx
 create mode 100644 src/client/views/collections/schemaView/CollectionSchemaView.scss
 create mode 100644 src/client/views/collections/schemaView/CollectionSchemaView.tsx
 create mode 100644 src/client/views/collections/schemaView/SchemaTable.tsx

(limited to 'src')

diff --git a/.idea/.gitignore b/.idea/.gitignore
new file mode 100644
index 000000000..26d33521a
--- /dev/null
+++ b/.idea/.gitignore
@@ -0,0 +1,3 @@
+# Default ignored files
+/shelf/
+/workspace.xml
diff --git a/.idea/Dash-Web.iml b/.idea/Dash-Web.iml
new file mode 100644
index 000000000..d6ebd4805
--- /dev/null
+++ b/.idea/Dash-Web.iml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="JAVA_MODULE" version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
\ No newline at end of file
diff --git a/.idea/modules.xml b/.idea/modules.xml
new file mode 100644
index 000000000..35c51c015
--- /dev/null
+++ b/.idea/modules.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/Dash-Web.iml" filepath="$PROJECT_DIR$/.idea/Dash-Web.iml" />
+    </modules>
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
new file mode 100644
index 000000000..35eb1ddfb
--- /dev/null
+++ b/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/src/client/util/SelectionManager.ts b/src/client/util/SelectionManager.ts
index ca5ef75d2..a624d5b7c 100644
--- a/src/client/util/SelectionManager.ts
+++ b/src/client/util/SelectionManager.ts
@@ -1,7 +1,7 @@
 import { action, observable, ObservableMap } from "mobx";
 import { computedFn } from "mobx-utils";
 import { Doc, Opt } from "../../fields/Doc";
-import { CollectionSchemaView } from "../views/collections/CollectionSchemaView";
+import { CollectionSchemaView } from "../views/collections/schemaView/CollectionSchemaView";
 import { CollectionViewType } from "../views/collections/CollectionView";
 import { DocumentView } from "../views/nodes/DocumentView";
 
diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
deleted file mode 100644
index 2e6186680..000000000
--- a/src/client/views/collections/CollectionSchemaCells.tsx
+++ /dev/null
@@ -1,529 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action, computed, observable } from "mobx";
-import { observer } from "mobx-react";
-import DatePicker from "react-datepicker";
-import "react-datepicker/dist/react-datepicker.css";
-import { CellInfo } from "react-table";
-import "react-table/react-table.css";
-import { DateField } from "../../../fields/DateField";
-import { Doc, DocListCast, Field, Opt } from "../../../fields/Doc";
-import { Id } from "../../../fields/FieldSymbols";
-import { List } from "../../../fields/List";
-import { SchemaHeaderField } from "../../../fields/SchemaHeaderField";
-import { ComputedField } from "../../../fields/ScriptField";
-import { BoolCast, Cast, DateCast, FieldValue, NumCast, StrCast } from "../../../fields/Types";
-import { ImageField } from "../../../fields/URLField";
-import { Utils, emptyFunction } from "../../../Utils";
-import { Docs } from "../../documents/Documents";
-import { DocumentType } from "../../documents/DocumentTypes";
-import { DocumentManager } from "../../util/DocumentManager";
-import { DragManager } from "../../util/DragManager";
-import { KeyCodes } from "../../util/KeyCodes";
-import { CompileScript } from "../../util/Scripting";
-import { SearchUtil } from "../../util/SearchUtil";
-import { SnappingManager } from "../../util/SnappingManager";
-import { undoBatch } from "../../util/UndoManager";
-import '../DocumentDecorations.scss';
-import { EditableView } from "../EditableView";
-import { MAX_ROW_HEIGHT } from '../globalCssVariables.scss';
-import { DocumentIconContainer } from "../nodes/DocumentIcon";
-import { OverlayView } from "../OverlayView";
-import "./CollectionSchemaView.scss";
-import { CollectionView } from "./CollectionView";
-const path = require('path');
-
-export interface CellProps {
-    row: number;
-    col: number;
-    rowProps: CellInfo;
-    CollectionView: Opt<CollectionView>;
-    ContainingCollection: Opt<CollectionView>;
-    Document: Doc;
-    fieldKey: string;
-    renderDepth: number;
-    addDocTab: (document: Doc, where: string) => boolean;
-    pinToPres: (document: Doc) => void;
-    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined,
-        addDocument: (document: Doc | Doc[]) => boolean) => boolean;
-    isFocused: boolean;
-    changeFocusedCellByIndex: (row: number, col: number) => void;
-    setIsEditing: (isEditing: boolean) => void;
-    isEditable: boolean;
-    setPreviewDoc: (doc: Doc) => void;
-    setComputed: (script: string, doc: Doc, field: string, row: number, col: number) => boolean;
-    getField: (row: number, col?: number) => void;
-    showDoc: (doc: Doc | undefined, dataDoc?: any, screenX?: number, screenY?: number) => void;
-}
-
-@observer
-export class CollectionSchemaCell extends React.Component<CellProps> {
-    public static resolvedFieldKey(column: string, rowDoc: Doc) {
-        const fieldKey = column;
-        if (fieldKey.startsWith("*")) {
-            const rootKey = fieldKey.substring(1);
-            const allKeys = [...Array.from(Object.keys(rowDoc)), ...Array.from(Object.keys(Doc.GetProto(rowDoc)))];
-            const matchedKeys = allKeys.filter(key => key.includes(rootKey));
-            if (matchedKeys.length) return matchedKeys[0];
-        }
-        return fieldKey;
-    }
-    @observable protected _isEditing: boolean = false;
-    protected _focusRef = React.createRef<HTMLDivElement>();
-    protected _rowDoc = this.props.rowProps.original;
-    protected _rowDataDoc = Doc.GetProto(this.props.rowProps.original);
-    protected _dropDisposer?: DragManager.DragDropDisposer;
-    @observable contents: string = "";
-
-    componentDidMount() { document.addEventListener("keydown", this.onKeyDown); }
-    componentWillUnmount() { document.removeEventListener("keydown", this.onKeyDown); }
-
-    @action
-    onKeyDown = (e: KeyboardEvent): void => {
-        if (this.props.isFocused && this.props.isEditable && e.keyCode === KeyCodes.ENTER) {
-            document.removeEventListener("keydown", this.onKeyDown);
-            this._isEditing = true;
-            this.props.setIsEditing(true);
-        }
-    }
-
-    @action
-    isEditingCallback = (isEditing: boolean): void => {
-        document.removeEventListener("keydown", this.onKeyDown);
-        isEditing && document.addEventListener("keydown", this.onKeyDown);
-        this._isEditing = isEditing;
-        this.props.setIsEditing(isEditing);
-        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
-    }
-
-    @action
-    onPointerDown = async (e: React.PointerEvent): Promise<void> => {
-        this.onItemDown(e);
-        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
-        this.props.setPreviewDoc(this.props.rowProps.original);
-
-        let url: string;
-        if (url = StrCast(this.props.rowProps.row.href)) {
-            try {
-                new URL(url);
-                const temp = window.open(url)!;
-                temp.blur();
-                window.focus();
-            } catch { }
-        }
-
-        const doc = Cast(this._rowDoc[this.renderFieldKey], Doc, null);
-        doc && this.props.setPreviewDoc(doc);
-    }
-
-    @undoBatch
-    applyToDoc = (doc: Doc, row: number, col: number, run: (args?: { [name: string]: any }) => any) => {
-        const res = run({ this: doc, $r: row, $c: col, $: (r: number = 0, c: number = 0) => this.props.getField(r + row, c + col) });
-        if (!res.success) return false;
-        doc[this.renderFieldKey] = res.result;
-        return true;
-    }
-
-    private drop = (e: Event, de: DragManager.DropEvent) => {
-        if (de.complete.docDragData) {
-            if (de.complete.docDragData.draggedDocuments.length === 1) {
-                this._rowDataDoc[this.renderFieldKey] = de.complete.docDragData.draggedDocuments[0];
-            }
-            else {
-                const coll = Docs.Create.SchemaDocument([new SchemaHeaderField("title", "#f1efeb")], de.complete.docDragData.draggedDocuments, {});
-                this._rowDataDoc[this.renderFieldKey] = coll;
-            }
-            e.stopPropagation();
-        }
-    }
-
-    protected dropRef = (ele: HTMLElement | null) => {
-        this._dropDisposer?.();
-        ele && (this._dropDisposer = DragManager.MakeDropTarget(ele, this.drop.bind(this)));
-    }
-
-    returnHighlights(contents: string, positions?: number[]) {
-        if (positions) {
-            const results = [];
-            StrCast(this.props.Document._searchString);
-            const length = StrCast(this.props.Document._searchString).length;
-            const color = contents ? "black" : "grey";
-
-            results.push(<span key="-1" style={{ color }}>{contents?.slice(0, positions[0])}</span>);
-            positions.forEach((num, cur) => {
-                results.push(<span key={"start" + cur} style={{ backgroundColor: "#FFFF00", color }}>{contents?.slice(num, num + length)}</span>);
-                let end = 0;
-                cur === positions.length - 1 ? end = contents.length : end = positions[cur + 1];
-                results.push(<span key={"end" + cur} style={{ color }}>{contents?.slice(num + length, end)}</span>);
-            }
-            );
-            return results;
-        }
-        return <span style={{ color: contents ? "black" : "grey" }}>{contents ? contents?.valueOf() : "undefined"}</span>;
-    }
-
-    @computed get renderFieldKey() { return CollectionSchemaCell.resolvedFieldKey(this.props.rowProps.column.id!, this.props.rowProps.original); }
-    onItemDown = async (e: React.PointerEvent) => {
-        if (this.props.Document._searchDoc) {
-            const aliasdoc = await SearchUtil.GetAliasesOfDocument(this._rowDataDoc);
-            const targetContext = aliasdoc.length <= 0 ? undefined : Cast(aliasdoc[0].context, Doc, null);
-            DocumentManager.Instance.jumpToDocument(this._rowDoc, false, emptyFunction, targetContext,
-                undefined, undefined, undefined, () => this.props.setPreviewDoc(this._rowDoc));
-        }
-    }
-    renderCellWithType(type: string | undefined) {
-        const dragRef: React.RefObject<HTMLDivElement> = React.createRef();
-
-        const fieldKey = this.renderFieldKey;
-        const field = this._rowDoc[fieldKey];
-
-        const onPointerEnter = (e: React.PointerEvent): void => {
-            if (e.buttons === 1 && SnappingManager.GetIsDragging() && (type === "document" || type === undefined)) {
-                dragRef.current!.className = "collectionSchemaView-cellContainer doc-drag-over";
-            }
-        };
-        const onPointerLeave = (e: React.PointerEvent): void => {
-            dragRef.current!.className = "collectionSchemaView-cellContainer";
-        };
-
-        let contents = Field.toString(field as Field);
-        contents = contents === "" ? "--" : contents;
-
-        let className = "collectionSchemaView-cellWrapper";
-        if (this._isEditing) className += " editing";
-        if (this.props.isFocused && this.props.isEditable) className += " focused";
-        if (this.props.isFocused && !this.props.isEditable) className += " inactive";
-
-        const positions = [];
-        if (StrCast(this.props.Document._searchString).toLowerCase() !== "") {
-            let term = (field instanceof Promise) ? "...promise pending..." : contents.toLowerCase();
-            const search = StrCast(this.props.Document._searchString).toLowerCase();
-            let start = term.indexOf(search);
-            let tally = 0;
-            if (start !== -1) {
-                positions.push(start);
-            }
-            while (start < contents?.length && start !== -1) {
-                term = term.slice(start + search.length + 1);
-                tally += start + search.length + 1;
-                start = term.indexOf(search);
-                positions.push(tally + start);
-            }
-            if (positions.length > 1) {
-                positions.pop();
-            }
-        }
-        const placeholder = type === "number" ? "0" : contents === "" ? "--" : "undefined";
-        return (
-            <div className="collectionSchemaView-cellContainer" style={{ cursor: field instanceof Doc ? "grab" : "auto" }}
-                ref={dragRef} onPointerDown={this.onPointerDown} onClick={action(e => this._isEditing = true)} onPointerEnter={onPointerEnter} onPointerLeave={onPointerLeave}>
-                <div className={className} ref={this._focusRef} tabIndex={-1}>
-                    <div className="collectionSchemaView-cellContents" ref={type === undefined || type === "document" ? this.dropRef : null}>
-                        {!this.props.Document._searchDoc ?
-                            <EditableView
-                                editing={this._isEditing}
-                                isEditingCallback={this.isEditingCallback}
-                                display={"inline"}
-                                contents={contents}
-                                height={"auto"}
-                                maxHeight={Number(MAX_ROW_HEIGHT)}
-                                placeholder={placeholder}
-                                GetValue={() => {
-                                    const cfield = ComputedField.WithoutComputed(() => FieldValue(field));
-                                    const cscript = cfield instanceof ComputedField ? cfield.script.originalScript : undefined;
-                                    const cfinalScript = cscript?.split("return")[cscript.split("return").length - 1];
-                                    return cscript ? (cfinalScript?.endsWith(";") ? `:=${cfinalScript?.substring(0, cfinalScript.length - 2)}` : cfinalScript) :
-                                        Field.IsField(cfield) ? Field.toScriptString(cfield) : "";
-                                }}
-                                SetValue={action((value: string) => {
-                                    let retVal = false;
-                                    if (value.startsWith(":=") || value.startsWith("=:=")) {
-                                        const script = value.substring(value.startsWith("=:=") ? 3 : 2);
-                                        retVal = this.props.setComputed(script, value.startsWith(":=") ? this._rowDataDoc : this._rowDoc, this.renderFieldKey, this.props.row, this.props.col);
-                                    } else {
-                                        const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
-                                        const script = CompileScript(inputscript, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                        script.compiled && (retVal = this.applyToDoc(inputscript.length !== value.length ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
-                                    }
-                                    if (retVal) {
-                                        this._isEditing = false; // need to set this here. otherwise, the assignment of the field will invalidate & cause render() to be called with the wrong value for 'editing'
-                                        this.props.setIsEditing(false);
-                                    }
-                                    return retVal;
-                                })}
-                                OnFillDown={async (value: string) => {
-                                    const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                    script.compiled && DocListCast(this.props.Document[this.props.fieldKey]).
-                                        forEach((doc, i) => value.startsWith(":=") ?
-                                            this.props.setComputed(value.substring(2), Doc.GetProto(doc), this.renderFieldKey, i, this.props.col) :
-                                            this.applyToDoc(Doc.GetProto(doc), i, this.props.col, script.run));
-                                }}
-                            />
-                            :
-                            this.returnHighlights(contents, positions)
-                        }
-                    </div >
-                </div>
-            </div>
-        );
-    }
-
-    render() { return this.renderCellWithType(undefined); }
-}
-
-@observer
-export class CollectionSchemaNumberCell extends CollectionSchemaCell { render() { return this.renderCellWithType("number"); } }
-
-@observer
-export class CollectionSchemaBooleanCell extends CollectionSchemaCell { render() { return this.renderCellWithType("boolean"); } }
-
-@observer
-export class CollectionSchemaStringCell extends CollectionSchemaCell { render() { return this.renderCellWithType("string"); } }
-
-@observer
-export class CollectionSchemaDateCell extends CollectionSchemaCell {
-    @computed get _date(): Opt<DateField> { return this._rowDoc[this.renderFieldKey] instanceof DateField ? DateCast(this._rowDoc[this.renderFieldKey]) : undefined; }
-
-    @action
-    handleChange = (date: any) => {
-        // const script = CompileScript(date.toString(), { requiredType: "Date", addReturn: true, params: { this: Doc.name } });
-        // if (script.compiled) {
-        //     this.applyToDoc(this._document, this.props.row, this.props.col, script.run);
-        // } else {
-        // ^ DateCast is always undefined for some reason, but that is what the field should be set to
-        this._rowDoc[this.renderFieldKey] = new DateField(date as Date);
-        //}
-    }
-
-    render() {
-        return !this.props.isFocused ? <span onPointerDown={this.onPointerDown}>{this._date ? Field.toString(this._date as Field) : "--"}</span> :
-            <DatePicker
-                selected={this._date?.date || new Date}
-                onSelect={date => this.handleChange(date)}
-                onChange={date => this.handleChange(date)}
-            />;
-    }
-}
-
-@observer
-export class CollectionSchemaDocCell extends CollectionSchemaCell {
-
-    _overlayDisposer?: () => void;
-
-    @computed get _doc() { return FieldValue(Cast(this._rowDoc[this.renderFieldKey], Doc)); }
-
-    @action
-    onSetValue = (value: string) => {
-        this._doc && (Doc.GetProto(this._doc).title = value);
-
-        const script = CompileScript(value, {
-            addReturn: true,
-            typecheck: false,
-            transformer: DocumentIconContainer.getTransformer()
-        });
-
-        const results = script.compiled && script.run();
-        if (results && results.success) {
-            this._rowDoc[this.renderFieldKey] = results.result;
-            return true;
-        }
-        return false;
-    }
-
-    componentWillUnmount() { this.onBlur(); }
-
-    onBlur = () => { this._overlayDisposer?.(); };
-    onFocus = () => {
-        this.onBlur();
-        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
-    }
-
-    @action
-    isEditingCallback = (isEditing: boolean): void => {
-        document.removeEventListener("keydown", this.onKeyDown);
-        isEditing && document.addEventListener("keydown", this.onKeyDown);
-        this._isEditing = isEditing;
-        this.props.setIsEditing(isEditing);
-        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
-    }
-
-    render() {
-        return !this._doc ? this.renderCellWithType("document") :
-            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1}
-                onPointerDown={this.onPointerDown}
-            >
-                <div className="collectionSchemaView-cellContents-document"
-                    style={{ padding: "5.9px" }}
-                    ref={this.dropRef}
-                    onFocus={this.onFocus}
-                    onBlur={this.onBlur}
-                >
-                    <EditableView
-                        editing={this._isEditing}
-                        isEditingCallback={this.isEditingCallback}
-                        display={"inline"}
-                        contents={this._doc.title || "--"}
-                        height={"auto"}
-                        maxHeight={Number(MAX_ROW_HEIGHT)}
-                        GetValue={() => StrCast(this._doc?.title)}
-                        SetValue={action((value: string) => {
-                            this.onSetValue(value);
-                            return true;
-                        })}
-                    />
-                </div >
-                <div onClick={() => this._doc && this.props.addDocTab(this._doc, "add:right")} className="collectionSchemaView-cellContents-docButton">
-                    <FontAwesomeIcon icon="external-link-alt" size="lg" />
-                </div>
-            </div>;
-    }
-}
-
-@observer
-export class CollectionSchemaImageCell extends CollectionSchemaCell {
-
-    choosePath(url: URL) {
-        if (url.protocol === "data") return url.href;
-        if (url.href.indexOf(window.location.origin) === -1) return Utils.CorsProxy(url.href);
-        if (!/\.(png|jpg|jpeg|gif|webp)$/.test(url.href.toLowerCase())) return url.href;//Why is this here
-
-        const ext = path.extname(url.href);
-        return url.href.replace(ext, "_o" + path.extname(url.href));
-    }
-
-    render() {
-        const field = Cast(this._rowDoc[this.renderFieldKey], ImageField, null); // retrieve the primary image URL that is being rendered from the data doc
-        const alts = DocListCast(this._rowDoc[this.renderFieldKey + "-alternates"]); // retrieve alternate documents that may be rendered as alternate images
-        const altpaths = alts.map(doc => Cast(doc[Doc.LayoutFieldKey(doc)], ImageField, null)?.url).filter(url => url).map(url => this.choosePath(url)); // access the primary layout data of the alternate documents
-        const paths = field ? [this.choosePath(field.url), ...altpaths] : altpaths;
-        const url = paths.length ? paths : [Utils.CorsProxy("http://www.cs.brown.edu/~bcz/noImage.png")];
-
-        const aspect = Doc.NativeAspect(this._rowDoc);
-        let width = Math.min(75, this.props.rowProps.width);
-        const height = Math.min(75, width / aspect);
-        width = height * aspect;
-
-        const reference = React.createRef<HTMLDivElement>();
-        return <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-            <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
-                <img src={url[0]}
-                    width={paths.length ? width : "20px"}
-                    height={paths.length ? height : "20px"} />
-            </div >
-        </div>;
-    }
-}
-
-
-@observer
-export class CollectionSchemaListCell extends CollectionSchemaCell {
-    _overlayDisposer?: () => void;
-
-    @computed get _field() { return this._rowDoc[this.renderFieldKey]; }
-    @computed get _optionsList() { return this._field as List<any>; }
-    @observable private _opened = false;
-    @observable private _text = "select an item";
-    @observable private _selectedNum = 0;
-
-    @action
-    onSetValue = (value: string) => {
-        // change if its a document
-        this._optionsList[this._selectedNum] = this._text = value;
-
-        (this._field as List<any>).splice(this._selectedNum, 1, value);
-    }
-
-    @action
-    onSelected = (element: string, index: number) => {
-        this._text = element;
-        this._selectedNum = index;
-    }
-
-    onFocus = () => {
-        this._overlayDisposer?.();
-        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
-    }
-
-    render() {
-        const link = false;
-        const reference = React.createRef<HTMLDivElement>();
-
-        if (this._optionsList?.length) {
-            const options = !this._opened ? (null) :
-                <div>
-                    {this._optionsList.map((element, index) => {
-                        const val = Field.toString(element);
-                        return <div className="collectionSchemaView-dropdownOption" key={index} style={{ padding: "6px" }} onPointerDown={(e) => this.onSelected(StrCast(element), index)} >
-                            {val}
-                        </div>;
-                    })}
-                </div>;
-
-            const plainText = <div style={{ padding: "5.9px" }}>{this._text}</div>;
-            const textarea = <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} style={{ padding: "5.9px" }} ref={this.dropRef} >
-                <EditableView
-                    editing={this._isEditing}
-                    isEditingCallback={this.isEditingCallback}
-                    display={"inline"}
-                    contents={this._text}
-                    height={"auto"}
-                    maxHeight={Number(MAX_ROW_HEIGHT)}
-                    GetValue={() => this._text}
-                    SetValue={action((value: string) => {
-                        // add special for params 
-                        this.onSetValue(value);
-                        return true;
-                    })}
-                />
-            </div >;
-
-            //☰
-            return (
-                <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-                    <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
-                        <div className="collectionSchemaView-dropDownWrapper">
-                            <button type="button" className="collectionSchemaView-dropdownButton" style={{ right: "length", position: "relative" }}
-                                onClick={action(e => this._opened = !this._opened)} >
-                                <FontAwesomeIcon icon={this._opened ? "caret-up" : "caret-down"} size="sm" />
-                            </button>
-                            <div className="collectionSchemaView-dropdownText"> {link ? plainText : textarea} </div>
-                        </div>
-                        {options}
-                    </div >
-                </div>
-            );
-        }
-        return this.renderCellWithType("list");
-    }
-}
-
-
-@observer
-export class CollectionSchemaCheckboxCell extends CollectionSchemaCell {
-    @computed get _isChecked() { return BoolCast(this._rowDoc[this.renderFieldKey]); }
-
-    render() {
-        const reference = React.createRef<HTMLDivElement>();
-        return (
-            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-                <input type="checkbox" checked={this._isChecked} onChange={e => this._rowDoc[this.renderFieldKey] = e.target.checked} />
-            </div>
-        );
-    }
-}
-
-
-@observer
-export class CollectionSchemaButtons extends CollectionSchemaCell {
-    render() {
-        return !this.props.Document._searchDoc || ![DocumentType.PDF, DocumentType.RTF].includes(StrCast(this._rowDoc.type) as DocumentType) ? <></> :
-            <div style={{ paddingTop: 8, paddingLeft: 3 }} >
-                <button style={{ padding: 2, left: 77 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, true)}>
-                    <FontAwesomeIcon icon="arrow-up" size="sm" />
-                </button>
-                <button style={{ padding: 2 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, false)} >
-                    <FontAwesomeIcon icon="arrow-down" size="sm" />
-                </button>
-            </div>;
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/CollectionSchemaHeaders.tsx b/src/client/views/collections/CollectionSchemaHeaders.tsx
deleted file mode 100644
index 3b52e6408..000000000
--- a/src/client/views/collections/CollectionSchemaHeaders.tsx
+++ /dev/null
@@ -1,518 +0,0 @@
-import React = require("react");
-import { IconProp, library } from "@fortawesome/fontawesome-svg-core";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action, computed, observable, runInAction } from "mobx";
-import { observer } from "mobx-react";
-import { Doc, DocListCast, Opt } from "../../../fields/Doc";
-import { listSpec } from "../../../fields/Schema";
-import { PastelSchemaPalette, SchemaHeaderField } from "../../../fields/SchemaHeaderField";
-import { ScriptField } from "../../../fields/ScriptField";
-import { Cast, StrCast } from "../../../fields/Types";
-import { undoBatch } from "../../util/UndoManager";
-import { SearchBox } from "../search/SearchBox";
-import { ColumnType } from "./CollectionSchemaView";
-import "./CollectionSchemaView.scss";
-import { CollectionView } from "./CollectionView";
-
-const higflyout = require("@hig/flyout");
-export const { anchorPoints } = higflyout;
-export const Flyout = higflyout.default;
-
-
-export interface AddColumnHeaderProps {
-    createColumn: () => void;
-}
-
-@observer
-export class CollectionSchemaAddColumnHeader extends React.Component<AddColumnHeaderProps> {
-    render() {
-        return (
-            <button className="add-column" onClick={() => this.props.createColumn()}><FontAwesomeIcon icon="plus" size="sm" /></button>
-        );
-    }
-}
-
-
-export interface ColumnMenuProps {
-    columnField: SchemaHeaderField;
-    // keyValue: string;
-    possibleKeys: string[];
-    existingKeys: string[];
-    // keyType: ColumnType;
-    typeConst: boolean;
-    menuButtonContent: JSX.Element;
-    addNew: boolean;
-    onSelect: (oldKey: string, newKey: string, addnew: boolean) => void;
-    setIsEditing: (isEditing: boolean) => void;
-    deleteColumn: (column: string) => void;
-    onlyShowOptions: boolean;
-    setColumnType: (column: SchemaHeaderField, type: ColumnType) => void;
-    setColumnSort: (column: SchemaHeaderField, desc: boolean | undefined) => void;
-    anchorPoint?: any;
-    setColumnColor: (column: SchemaHeaderField, color: string) => void;
-}
-@observer
-export class CollectionSchemaColumnMenu extends React.Component<ColumnMenuProps> {
-    @observable private _isOpen: boolean = false;
-    @observable private _node: HTMLDivElement | null = null;
-
-    componentDidMount() { document.addEventListener("pointerdown", this.detectClick); }
-
-    componentWillUnmount() { document.removeEventListener("pointerdown", this.detectClick); }
-
-    @action
-    detectClick = (e: PointerEvent) => {
-        !this._node?.contains(e.target as Node) && this.props.setIsEditing(this._isOpen = false);
-    }
-
-    @action
-    toggleIsOpen = (): void => {
-        this.props.setIsEditing(this._isOpen = !this._isOpen);
-    }
-
-    changeColumnType = (type: ColumnType) => {
-        this.props.setColumnType(this.props.columnField, type);
-    }
-
-    changeColumnSort = (desc: boolean | undefined) => {
-        this.props.setColumnSort(this.props.columnField, desc);
-    }
-
-    changeColumnColor = (color: string) => {
-        this.props.setColumnColor(this.props.columnField, color);
-    }
-
-    @action
-    setNode = (node: HTMLDivElement): void => {
-        if (node) {
-            this._node = node;
-        }
-    }
-
-    renderTypes = () => {
-        if (this.props.typeConst) return (null);
-
-        const type = this.props.columnField.type;
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Column type:</label>
-                <div className="columnMenu-types">
-                    <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Any)}>
-                        <FontAwesomeIcon icon={"align-justify"} size="sm" />
-                        Any
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Number)}>
-                        <FontAwesomeIcon icon={"hashtag"} size="sm" />
-                        Number
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.String)}>
-                        <FontAwesomeIcon icon={"font"} size="sm" />
-                        Text
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Boolean)}>
-                        <FontAwesomeIcon icon={"check-square"} size="sm" />
-                        Checkbox
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.List)}>
-                        <FontAwesomeIcon icon={"list-ul"} size="sm" />
-                        List
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Doc)}>
-                        <FontAwesomeIcon icon={"file"} size="sm" />
-                        Document
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Image)}>
-                        <FontAwesomeIcon icon={"image"} size="sm" />
-                        Image
-                    </div>
-                    <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Date)}>
-                        <FontAwesomeIcon icon={"calendar"} size="sm" />
-                        Date
-                    </div>
-                </div>
-            </div >
-        );
-    }
-
-    renderSorting = () => {
-        const sort = this.props.columnField.desc;
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Sort by:</label>
-                <div className="columnMenu-sort">
-                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.changeColumnSort(true)}>
-                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
-                        Sort descending
-                    </div>
-                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.changeColumnSort(false)}>
-                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
-                        Sort ascending
-                    </div>
-                    <div className="columnMenu-option" onClick={() => this.changeColumnSort(undefined)}>
-                        <FontAwesomeIcon icon="times" size="sm" />
-                        Clear sorting
-                    </div>
-                </div>
-            </div>
-        );
-    }
-
-    renderColors = () => {
-        const selected = this.props.columnField.color;
-
-        const pink = PastelSchemaPalette.get("pink2");
-        const purple = PastelSchemaPalette.get("purple2");
-        const blue = PastelSchemaPalette.get("bluegreen1");
-        const yellow = PastelSchemaPalette.get("yellow4");
-        const red = PastelSchemaPalette.get("red2");
-        const gray = "#f1efeb";
-
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Color:</label>
-                <div className="columnMenu-colors">
-                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.changeColumnColor(pink!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.changeColumnColor(purple!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.changeColumnColor(blue!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.changeColumnColor(yellow!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.changeColumnColor(red!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.changeColumnColor(gray)}></div>
-                </div>
-            </div>
-        );
-    }
-
-    renderContent = () => {
-        return (
-            <div className="collectionSchema-header-menuOptions">
-                {this.props.onlyShowOptions ? <></> :
-                    <>
-                        {this.renderTypes()}
-                        {this.renderSorting()}
-                        {this.renderColors()}
-                        <div className="collectionSchema-headerMenu-group">
-                            <button onClick={() => this.props.deleteColumn(this.props.columnField.heading)}>Delete Column</button>
-                        </div>
-                    </>
-                }
-            </div>
-        );
-    }
-
-    render() {
-        return (
-            <div className="collectionSchema-header-menu" ref={this.setNode}>
-                <Flyout anchorPoint={this.props.anchorPoint ? this.props.anchorPoint : anchorPoints.TOP_CENTER} content={this.renderContent()}>
-                    <div className="collectionSchema-header-toggler" onClick={() => this.toggleIsOpen()}>{this.props.menuButtonContent}</div>
-                </ Flyout >
-            </div>
-        );
-    }
-}
-
-
-export interface KeysDropdownProps {
-    keyValue: string;
-    possibleKeys: string[];
-    existingKeys: string[];
-    canAddNew: boolean;
-    addNew: boolean;
-    onSelect: (oldKey: string, newKey: string, addnew: boolean, filter?: string) => void;
-    setIsEditing: (isEditing: boolean) => void;
-    width?: string;
-    docs?: Doc[];
-    Document: Doc;
-    dataDoc: Doc | undefined;
-    fieldKey: string;
-    ContainingCollectionDoc: Doc | undefined;
-    ContainingCollectionView: Opt<CollectionView>;
-    active?: (outsideReaction?: boolean) => boolean;
-    openHeader: (column: any, screenx: number, screeny: number) => void;
-    col: SchemaHeaderField;
-    icon: IconProp;
-}
-@observer
-export class KeysDropdown extends React.Component<KeysDropdownProps> {
-    @observable private _key: string = this.props.keyValue;
-    @observable private _searchTerm: string = this.props.keyValue;
-    @observable private _isOpen: boolean = false;
-    @observable private _node: HTMLDivElement | null = null;
-    @observable private _inputRef: React.RefObject<HTMLInputElement> = React.createRef();
-
-    @action setSearchTerm = (value: string): void => { this._searchTerm = value; };
-    @action setKey = (key: string): void => { this._key = key; };
-    @action setIsOpen = (isOpen: boolean): void => { this._isOpen = isOpen; };
-
-    @action
-    onSelect = (key: string): void => {
-        this.props.onSelect(this._key, key, this.props.addNew);
-        this.setKey(key);
-        this._isOpen = false;
-        this.props.setIsEditing(false);
-    }
-
-    @action
-    setNode = (node: HTMLDivElement): void => {
-        if (node) {
-            this._node = node;
-        }
-    }
-
-    componentDidMount() {
-        document.addEventListener("pointerdown", this.detectClick);
-        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
-        if (filters?.some(filter => filter.split(":")[0] === this._key)) {
-            runInAction(() => this.closeResultsVisibility = "contents");
-        }
-    }
-
-    @action
-    detectClick = (e: PointerEvent): void => {
-        if (this._node && this._node.contains(e.target as Node)) {
-        } else {
-            this._isOpen = false;
-            this.props.setIsEditing(false);
-        }
-    }
-
-    private tempfilter: string = "";
-    @undoBatch
-    onKeyDown = (e: React.KeyboardEvent): void => {
-        if (e.key === "Enter") {
-            if (this._searchTerm.includes(":")) {
-                const colpos = this._searchTerm.indexOf(":");
-                const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
-                if (temp === "") {
-                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
-                    this.updateFilter();
-                }
-                else {
-                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
-                    this.tempfilter = temp;
-                    Doc.setDocFilter(this.props.Document, this._key, temp, "check");
-                    this.props.col.setColor("green");
-                    this.closeResultsVisibility = "contents";
-                }
-            }
-            else {
-                Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
-                this.updateFilter();
-                if (this.showKeys.length) {
-                    this.onSelect(this.showKeys[0]);
-                } else if (this._searchTerm !== "" && this.props.canAddNew) {
-                    this.setSearchTerm(this._searchTerm || this._key);
-                    this.onSelect(this._searchTerm);
-                }
-            }
-        }
-    }
-
-    onChange = (val: string): void => {
-        this.setSearchTerm(val);
-    }
-
-    @action
-    onFocus = (e: React.FocusEvent): void => {
-        this._isOpen = true;
-        this.props.setIsEditing(true);
-    }
-
-    @computed get showKeys() {
-        const whitelistKeys = ["context", "author", "*lastModified", "text", "data", "tags", "creationDate"];
-        const keyOptions = this._searchTerm === "" ? this.props.possibleKeys : this.props.possibleKeys.filter(key => key.toUpperCase().indexOf(this._searchTerm.toUpperCase()) > -1);
-        const showKeys = new Set<string>();
-        [...keyOptions, ...whitelistKeys].forEach(key => (!Doc.UserDoc().noviceMode ||
-            whitelistKeys.includes(key)
-            || ((!key.startsWith("_") && key[0] === key[0].toUpperCase()) || key[0] === "#")) ? showKeys.add(key) : null);
-        return Array.from(showKeys.keys()).filter(key => !this._searchTerm || key.includes(this._searchTerm));
-    }
-    @action
-    renderOptions = (): JSX.Element[] | JSX.Element => {
-        if (!this._isOpen) {
-            this.defaultMenuHeight = 0;
-            return <></>;
-        }
-        const options = this.showKeys.map(key => {
-            return <div key={key} className="key-option" style={{
-                border: "1px solid lightgray",
-                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
-            }}
-                onPointerDown={e => {
-                    e.stopPropagation();
-                }}
-                onClick={() => {
-                    this.onSelect(key);
-                    this.setSearchTerm("");
-                }}>{key}</div>;
-        });
-
-        // if search term does not already exist as a group type, give option to create new group type
-
-        if (this._key !== this._searchTerm.slice(0, this._key.length)) {
-            if (this._searchTerm !== "" && this.props.canAddNew) {
-                options.push(<div key={""} className="key-option" style={{
-                    border: "1px solid lightgray", width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
-                }}
-                    onClick={() => { this.onSelect(this._searchTerm); this.setSearchTerm(""); }}>
-                    Create "{this._searchTerm}" key</div>);
-            }
-        }
-
-        if (options.length === 0) {
-            this.defaultMenuHeight = 0;
-        }
-        else {
-            if (this.props.docs) {
-                const panesize = this.props.docs.length * 30;
-                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-            else {
-                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-        }
-        return options;
-    }
-
-    docSafe: Doc[] = [];
-
-    @action
-    renderFilterOptions = (): JSX.Element[] | JSX.Element => {
-        if (!this._isOpen || !this.props.dataDoc) {
-            this.defaultMenuHeight = 0;
-            return <></>;
-        }
-        const keyOptions: string[] = [];
-        const colpos = this._searchTerm.indexOf(":");
-        const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
-        if (this.docSafe.length === 0) {
-            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
-        }
-        const docs = this.docSafe;
-        docs.forEach((doc) => {
-            const key = StrCast(doc[this._key]);
-            if (keyOptions.includes(key) === false && key.includes(temp) && key !== "") {
-                keyOptions.push(key);
-            }
-        });
-
-        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
-        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
-            this.props.col.setColor("rgb(241, 239, 235)");
-            this.closeResultsVisibility = "none";
-        }
-        for (let i = 0; i < (filters?.length ?? 0) - 1; i++) {
-            if (filters![i] === this.props.col.heading && keyOptions.includes(filters![i].split(":")[1]) === false) {
-                keyOptions.push(filters![i + 1]);
-            }
-        }
-        const options = keyOptions.map(key => {
-            let bool = false;
-            if (filters !== undefined) {
-                const ind = filters.findIndex(filter => filter.split(":")[0] === key);
-                const fields = ind === -1 ? undefined : filters[ind].split(":");
-                bool = fields ? fields[1] === "check" : false;
-            }
-            return <div key={key} className="key-option" style={{
-                border: "1px solid lightgray", paddingLeft: 5, textAlign: "left",
-                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white", backgroundColor: "white",
-            }}
-            >
-                <input type="checkbox"
-                    onPointerDown={e => e.stopPropagation()}
-                    onClick={e => e.stopPropagation()}
-                    onChange={(e) => {
-                        e.target.checked === true ? Doc.setDocFilter(this.props.Document, this._key, key, "check") : Doc.setDocFilter(this.props.Document, this._key, key, "remove");
-                        e.target.checked === true ? this.closeResultsVisibility = "contents" : console.log("");
-                        e.target.checked === true ? this.props.col.setColor("green") : this.updateFilter();
-                        e.target.checked === true && SearchBox.Instance.filter === true ? Doc.setDocFilter(docs[0], this._key, key, "check") : Doc.setDocFilter(docs[0], this._key, key, "remove");
-                    }}
-                    checked={bool}
-                />
-                <span style={{ paddingLeft: 4 }}>
-                    {key}
-                </span>
-
-            </div>;
-        });
-        if (options.length === 0) {
-            this.defaultMenuHeight = 0;
-        }
-        else {
-            if (this.props.docs) {
-                const panesize = this.props.docs.length * 30;
-                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-            else {
-                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
-            }
-
-        }
-        return options;
-    }
-
-    @observable defaultMenuHeight = 0;
-
-
-    updateFilter() {
-        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
-        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
-            this.props.col.setColor("rgb(241, 239, 235)");
-            this.closeResultsVisibility = "none";
-        }
-    }
-
-    @computed get scriptField() {
-        const scriptText = "setDocFilter(containingTreeView, heading, this.title, checked)";
-        const script = ScriptField.MakeScript(scriptText, { this: Doc.name, heading: "string", checked: "string", containingTreeView: Doc.name });
-        return script ? () => script : undefined;
-    }
-    filterBackground = () => "rgba(105, 105, 105, 0.432)";
-    @observable filterOpen: boolean | undefined = undefined;
-    closeResultsVisibility: string = "none";
-
-    removeFilters = (e: React.PointerEvent): void => {
-        const keyOptions: string[] = [];
-        if (this.docSafe.length === 0 && this.props.dataDoc) {
-            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
-        }
-        const docs = this.docSafe;
-        docs.forEach((doc) => {
-            const key = StrCast(doc[this._key]);
-            if (keyOptions.includes(key) === false) {
-                keyOptions.push(key);
-            }
-        });
-
-        Doc.setDocFilter(this.props.Document, this._key, "", "remove");
-        this.props.col.setColor("rgb(241, 239, 235)");
-        this.closeResultsVisibility = "none";
-    }
-    render() {
-        return (
-            <div style={{ display: "flex" }} ref={this.setNode}>
-                <FontAwesomeIcon onClick={e => { this.props.openHeader(this.props.col, e.clientX, e.clientY); e.stopPropagation(); }} icon={this.props.icon} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} />
-
-                {/* <FontAwesomeIcon icon={fa.faSearchMinus} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} onClick={e => {
-                    runInAction(() => { this._isOpen === undefined ? this._isOpen = true : this._isOpen = !this._isOpen })
-                }} /> */}
-
-                <div className="keys-dropdown" style={{ zIndex: 1, width: this.props.width, maxWidth: this.props.width }}>
-                    <input className="keys-search" style={{ width: "100%" }}
-                        ref={this._inputRef} type="text" value={this._searchTerm} placeholder="Column key" onKeyDown={this.onKeyDown}
-                        onChange={e => this.onChange(e.target.value)}
-                        onClick={(e) => { e.stopPropagation(); this._inputRef.current?.focus(); }}
-                        onFocus={this.onFocus} ></input>
-                    <div style={{ display: this.closeResultsVisibility }}>
-                        <FontAwesomeIcon onPointerDown={this.removeFilters} icon={"times-circle"} size="lg"
-                            style={{ cursor: "hand", color: "grey", padding: 2, left: -20, top: -1, height: 15, position: "relative" }} />
-                    </div>
-                    {!this._isOpen ? (null) : <div className="keys-options-wrapper" style={{
-                        width: this.props.width, maxWidth: this.props.width, height: "auto",
-                    }}>
-                        {this._searchTerm.includes(":") ? this.renderFilterOptions() : this.renderOptions()}
-                    </div>}
-                </div >
-            </div>
-        );
-    }
-}
diff --git a/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx b/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
deleted file mode 100644
index 881246bd4..000000000
--- a/src/client/views/collections/CollectionSchemaMovableTableHOC.tsx
+++ /dev/null
@@ -1,258 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action } from "mobx";
-import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
-import { Doc } from "../../../fields/Doc";
-import { SchemaHeaderField } from "../../../fields/SchemaHeaderField";
-import { Cast, FieldValue, StrCast } from "../../../fields/Types";
-import { DocumentManager } from "../../util/DocumentManager";
-import { DragManager, dropActionType, SetupDrag } from "../../util/DragManager";
-import { SnappingManager } from "../../util/SnappingManager";
-import { Transform } from "../../util/Transform";
-import { undoBatch } from "../../util/UndoManager";
-import { ContextMenu } from "../ContextMenu";
-import "./CollectionSchemaView.scss";
-
-export interface MovableColumnProps {
-    columnRenderer: TableCellRenderer;
-    columnValue: SchemaHeaderField;
-    allColumns: SchemaHeaderField[];
-    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columns: SchemaHeaderField[]) => void;
-    ScreenToLocalTransform: () => Transform;
-}
-export class MovableColumn extends React.Component<MovableColumnProps> {
-    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
-    private _colDropDisposer?: DragManager.DragDropDisposer;
-    private _startDragPosition: { x: number, y: number } = { x: 0, y: 0 };
-    private _sensitivity: number = 16;
-    private _dragRef: React.RefObject<HTMLDivElement> = React.createRef();
-
-    onPointerEnter = (e: React.PointerEvent): void => {
-        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
-            this._header!.current!.className = "collectionSchema-col-wrapper";
-            document.addEventListener("pointermove", this.onDragMove, true);
-        }
-    }
-    onPointerLeave = (e: React.PointerEvent): void => {
-        this._header!.current!.className = "collectionSchema-col-wrapper";
-        document.removeEventListener("pointermove", this.onDragMove, true);
-        !e.buttons && document.removeEventListener("pointermove", this.onPointerMove);
-    }
-    onDragMove = (e: PointerEvent): void => {
-        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
-        const before = x[0] < bounds[0];
-        this._header!.current!.className = "collectionSchema-col-wrapper";
-        if (before) this._header!.current!.className += " col-before";
-        if (!before) this._header!.current!.className += " col-after";
-        e.stopPropagation();
-    }
-
-    createColDropTarget = (ele: HTMLDivElement) => {
-        this._colDropDisposer?.();
-        if (ele) {
-            this._colDropDisposer = DragManager.MakeDropTarget(ele, this.colDrop.bind(this));
-        }
-    }
-
-    colDrop = (e: Event, de: DragManager.DropEvent) => {
-        document.removeEventListener("pointermove", this.onDragMove, true);
-        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
-        const before = x[0] < bounds[0];
-        const colDragData = de.complete.columnDragData;
-        if (colDragData) {
-            e.stopPropagation();
-            this.props.reorderColumns(colDragData.colKey, this.props.columnValue, before, this.props.allColumns);
-            return true;
-        }
-        return false;
-    }
-
-    onPointerMove = (e: PointerEvent) => {
-        const onRowMove = (e: PointerEvent) => {
-            e.stopPropagation();
-            e.preventDefault();
-
-            document.removeEventListener("pointermove", onRowMove);
-            document.removeEventListener('pointerup', onRowUp);
-            const dragData = new DragManager.ColumnDragData(this.props.columnValue);
-            DragManager.StartColumnDrag(this._dragRef.current!, dragData, e.x, e.y);
-        };
-        const onRowUp = (): void => {
-            document.removeEventListener("pointermove", onRowMove);
-            document.removeEventListener('pointerup', onRowUp);
-        };
-        if (e.buttons === 1) {
-            const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX - this._startDragPosition.x, e.clientY - this._startDragPosition.y);
-            if (Math.abs(dx) + Math.abs(dy) > this._sensitivity) {
-                document.removeEventListener("pointermove", this.onPointerMove);
-                e.stopPropagation();
-
-                document.addEventListener("pointermove", onRowMove);
-                document.addEventListener("pointerup", onRowUp);
-            }
-        }
-    }
-
-    onPointerUp = (e: React.PointerEvent) => {
-        document.removeEventListener("pointermove", this.onPointerMove);
-    }
-
-    @action
-    onPointerDown = (e: React.PointerEvent, ref: React.RefObject<HTMLDivElement>) => {
-        this._dragRef = ref;
-        const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX, e.clientY);
-        if (!(e.target as any)?.tagName.includes("INPUT")) {
-            this._startDragPosition = { x: dx, y: dy };
-            document.addEventListener("pointermove", this.onPointerMove);
-        }
-    }
-
-
-    render() {
-        const reference = React.createRef<HTMLDivElement>();
-
-        return (
-            <div className="collectionSchema-col" ref={this.createColDropTarget}>
-                <div className="collectionSchema-col-wrapper" ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
-                    <div className="col-dragger" ref={reference} onPointerDown={e => this.onPointerDown(e, reference)} onPointerUp={this.onPointerUp}>
-                        {this.props.columnRenderer}
-                    </div>
-                </div>
-            </div>
-        );
-    }
-}
-
-export interface MovableRowProps {
-    rowInfo: RowInfo;
-    ScreenToLocalTransform: () => Transform;
-    addDoc: (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => boolean;
-    removeDoc: (doc: Doc | Doc[]) => boolean;
-    rowFocused: boolean;
-    textWrapRow: (doc: Doc) => void;
-    rowWrapped: boolean;
-    dropAction: string;
-    addDocTab: any;
-}
-
-export class MovableRow extends React.Component<MovableRowProps> {
-    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
-    private _rowDropDisposer?: DragManager.DragDropDisposer;
-
-    onPointerEnter = (e: React.PointerEvent): void => {
-        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
-            this._header!.current!.className = "collectionSchema-row-wrapper";
-            document.addEventListener("pointermove", this.onDragMove, true);
-        }
-    }
-    onPointerLeave = (e: React.PointerEvent): void => {
-        this._header!.current!.className = "collectionSchema-row-wrapper";
-        document.removeEventListener("pointermove", this.onDragMove, true);
-    }
-    onDragMove = (e: PointerEvent): void => {
-        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
-        const before = x[1] < bounds[1];
-        this._header!.current!.className = "collectionSchema-row-wrapper";
-        if (before) this._header!.current!.className += " row-above";
-        if (!before) this._header!.current!.className += " row-below";
-        e.stopPropagation();
-    }
-    componentWillUnmount() {
-
-        this._rowDropDisposer?.();
-    }
-
-    createRowDropTarget = (ele: HTMLDivElement) => {
-        this._rowDropDisposer?.();
-        if (ele) {
-            this._rowDropDisposer = DragManager.MakeDropTarget(ele, this.rowDrop.bind(this));
-        }
-    }
-
-    rowDrop = (e: Event, de: DragManager.DropEvent) => {
-        this.onPointerLeave(e as any);
-        const rowDoc = FieldValue(Cast(this.props.rowInfo.original, Doc));
-        if (!rowDoc) return false;
-
-        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
-        const rect = this._header!.current!.getBoundingClientRect();
-        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
-        const before = x[1] < bounds[1];
-
-        const docDragData = de.complete.docDragData;
-        if (docDragData) {
-            e.stopPropagation();
-            if (docDragData.draggedDocuments[0] === rowDoc) return true;
-            const addDocument = (doc: Doc | Doc[]) => this.props.addDoc(doc, rowDoc, before);
-            const movedDocs = docDragData.draggedDocuments;
-            return (docDragData.dropAction || docDragData.userDropAction) ?
-                docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before) || added, false)
-                : (docDragData.moveDocument) ?
-                    movedDocs.reduce((added: boolean, d) => docDragData.moveDocument?.(d, rowDoc, addDocument) || added, false)
-                    : docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before), false);
-        }
-        return false;
-    }
-
-    onRowContextMenu = (e: React.MouseEvent): void => {
-        e.preventDefault();
-        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
-        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
-    }
-
-    @undoBatch
-    @action
-    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
-        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
-        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
-    }
-
-    @action
-    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
-        console.log("yes");
-        if (e.key === "Backspace" || e.key === "Delete") {
-            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
-        }
-    }
-
-    render() {
-        const { children = null, rowInfo } = this.props;
-
-        if (!rowInfo) {
-            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
-        }
-
-        const { original } = rowInfo;
-        const doc = FieldValue(Cast(original, Doc));
-
-        if (!doc) return (null);
-
-        const reference = React.createRef<HTMLDivElement>();
-        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
-
-        let className = "collectionSchema-row";
-        if (this.props.rowFocused) className += " row-focused";
-        if (this.props.rowWrapped) className += " row-wrapped";
-
-        return (
-            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
-                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
-                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
-                        <div className="row-dragger">
-                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
-                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
-                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
-                        </div>
-                        {children}
-                    </ReactTableDefaults.TrComponent>
-                </div>
-            </div>
-        );
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/CollectionSchemaView.scss b/src/client/views/collections/CollectionSchemaView.scss
deleted file mode 100644
index 2bdd280ec..000000000
--- a/src/client/views/collections/CollectionSchemaView.scss
+++ /dev/null
@@ -1,641 +0,0 @@
-@import "../globalCssVariables";
-
-.collectionSchemaView-container {
-    border-width: $COLLECTION_BORDER_WIDTH;
-    border-color: $intermediate-color;
-    border-style: solid;
-    border-radius: $border-radius;
-    box-sizing: border-box;
-    position: relative;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    margin-top: 0;
-    transition: top 0.5s;
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: nowrap;
-    touch-action: none;
-
-    div {
-        touch-action: none;
-    }
-
-
-    .collectionSchemaView-tableContainer {
-        width: 100%;
-        height: 100%;
-    }
-
-    .collectionSchemaView-dividerDragger {
-        position: relative;
-        height: 100%;
-        width: $SCHEMA_DIVIDER_WIDTH;
-        z-index: 20;
-        right: 0;
-        top: 0;
-        background: gray;
-        cursor: col-resize;
-    }
-
-    // .documentView-node:first-child {
-    //     background: $light-color;
-    // }
-}
-
-.collectionSchemaView-searchContainer {
-    border-width: $COLLECTION_BORDER_WIDTH;
-    border-color: $intermediate-color;
-    border-style: solid;
-    border-radius: $border-radius;
-    box-sizing: border-box;
-    position: relative;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    margin-top: 0;
-    transition: top 0.5s;
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: nowrap;
-    touch-action: none;
-    padding: 2px;
-
-    div {
-        touch-action: none;
-    }
-
-
-    .collectionSchemaView-tableContainer {
-        width: 100%;
-        height: 100%;
-    }
-
-    .collectionSchemaView-dividerDragger {
-        position: relative;
-        height: 100%;
-        width: 20px;
-        z-index: 20;
-        right: 0;
-        top: 0;
-        background: gray;
-        cursor: col-resize;
-    }
-
-    // .documentView-node:first-child {
-    //     background: $light-color;
-    // }
-}
-
-.ReactTable {
-    width: 100%;
-    background: white;
-    box-sizing: border-box;
-    border: none !important;
-    float: none !important;
-
-    .rt-table {
-        height: 100%;
-        display: -webkit-inline-box;
-        direction: ltr;
-        overflow: visible;
-    }
-    .rt-noData {
-        display: none;
-    }
-
-    .rt-thead {
-        width: 100%;
-        z-index: 100;
-        overflow-y: visible;
-
-        &.-header {
-            font-size: 12px;
-            height: 30px;
-            box-shadow: none;
-            z-index: 100;
-            overflow-y: visible;
-        }
-
-        .rt-resizable-header-content {
-            height: 100%;
-            overflow: visible;
-        }
-
-        .rt-th {
-            padding: 0;
-            border: solid lightgray;
-            border-width: 0 1px;
-            border-bottom: 2px solid lightgray;
-        }
-    }
-
-    .rt-th {
-        font-size: 13px;
-        text-align: center;
-
-        &:last-child {
-            overflow: visible;
-        }
-    }
-
-    .rt-tbody {
-        width: 100%;
-        direction: rtl;
-        overflow: visible;
-
-        .rt-td {
-            border-right: 1px solid rgba(0, 0, 0, 0.2);
-        }
-    }
-
-    .rt-tr-group {
-        direction: ltr;
-        flex: 0 1 auto;
-        min-height: 30px;
-        border: 0 !important;
-    }
-
-    .rt-tr {
-        width: 100%;
-        min-height: 30px;
-    }
-
-    .rt-td {
-        padding: 0;
-        font-size: 13px;
-        text-align: center;
-        white-space: nowrap;
-        display: flex;
-        align-items: center;
-
-        .imageBox-cont {
-            position: relative;
-            max-height: 100%;
-        }
-
-        .imageBox-cont img {
-            object-fit: contain;
-            max-width: 100%;
-            height: 100%;
-        }
-
-        .videoBox-cont {
-            object-fit: contain;
-            width: auto;
-            height: 100%;
-        }
-    }
-    .rt-td.rt-expandable {
-        display: flex;
-        align-items: center;
-        height: inherit;
-    }
-
-    .rt-resizer {
-        width: 8px;
-        right: -4px;
-    }
-
-    .rt-resizable-header {
-        padding: 0;
-        height: 30px;
-    }
-
-    .rt-resizable-header:last-child {
-        overflow: visible;
-
-        .rt-resizer {
-            width: 5px !important;
-        }
-    }
-}
-
-.documentView-node-topmost {
-    text-align: left;
-    transform-origin: center top;
-    display: inline-block;
-}
-
-.collectionSchema-col {
-    height: 100%;
-}
-
-
-.collectionSchema-header-menu {
-    height: auto;
-    z-index: 100;
-    position: absolute;
-    background: white;
-    padding: 5px;
-    position: fixed;
-    background: white;
-    border: black 1px solid;
-
-    .collectionSchema-header-toggler {
-        z-index: 100;
-        width: 100%;
-        height: 100%;
-        padding: 4px;
-        letter-spacing: 2px;
-        text-transform: uppercase;
-
-        svg {
-            margin-right: 4px;
-        }
-    }
-}
-
-.collectionSchemaView-header {
-    height: 100%;
-    color: gray;
-    z-index: 100;
-    overflow-y: visible;
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: wrap;
-}
-
-button.add-column {
-    width: 28px;
-}
-
-.collectionSchema-header-menuOptions {
-    color: black;
-    width: 180px;
-    text-align: left;
-
-    .collectionSchema-headerMenu-group {
-        padding: 7px 0;
-        border-bottom: 1px solid lightgray;
-        cursor: pointer;
-
-        &:first-child {
-            padding-top: 0;
-        }
-
-        &:last-child {
-            border: none;
-            text-align: center;
-            padding: 12px 0 0 0;
-        }
-    }
-
-    label {
-        color: $main-accent;
-        font-weight: normal;
-        letter-spacing: 2px;
-        text-transform: uppercase;
-    }
-
-    input {
-        color: black;
-        width: 100%;
-    }
-
-    .columnMenu-option {
-        cursor: pointer;
-        padding: 3px;
-        background-color: white;
-        transition: background-color 0.2s;
-
-        &:hover {
-            background-color: $light-color-secondary;
-        }
-
-        &.active {
-            font-weight: bold;
-            border: 2px solid $light-color-secondary;
-        }
-
-        svg {
-            color: gray;
-            margin-right: 5px;
-            width: 10px;
-        }
-    }
-
-    .keys-dropdown {
-        position: relative;
-        //width: 100%;
-        background-color: white;
-
-        input {
-            border: 2px solid $light-color-secondary;
-            padding: 3px;
-            height: 28px;
-            font-weight: bold;
-            letter-spacing: "2px";
-            text-transform: "uppercase";
-
-            &:focus {
-                font-weight: normal;
-            }
-        }
-
-        .keys-options-wrapper {
-            width: 100%;
-            max-height: 150px;
-            overflow-y: scroll;
-            position: absolute;
-            top: 28px;
-            box-shadow: 0 10px 16px rgba(0, 0, 0, 0.1);
-            background-color: white;
-
-            .key-option {
-                background-color: white;
-                border: 1px solid lightgray;
-                padding: 2px 3px;
-
-                &:not(:first-child) {
-                    border-top: 0;
-                }
-
-                &:hover {
-                    background-color: $light-color-secondary;
-                }
-            }
-        }
-    }
-
-    .columnMenu-colors {
-        display: flex;
-        justify-content: space-between;
-        flex-wrap: wrap;
-
-        .columnMenu-colorPicker {
-            cursor: pointer;
-            width: 20px;
-            height: 20px;
-            border-radius: 10px;
-
-            &.active {
-                border: 2px solid white;
-                box-shadow: 0 0 0 2px lightgray;
-            }
-        }
-    }
-}
-
-.collectionSchema-row {
-    height: 100%;
-    background-color: white;
-
-    &.row-focused .rt-td {
-        background-color: #bfffc0; //$light-color-secondary;
-    }
-
-    &.row-wrapped {
-        .rt-td {
-            white-space: normal;
-        }
-    }
-
-    .row-dragger {
-        display: flex;
-        justify-content: space-around;
-        //flex: 50 0 auto;
-        width: 0;
-        max-width: 50px;
-        //height: 100%;
-        min-height: 30px;
-        align-items: center;
-        color: lightgray;
-        background-color: white;
-        transition: color 0.1s ease;
-
-        .row-option {
-            // padding: 5px;
-            cursor: pointer;
-            position: absolute;
-            transition: color 0.1s ease;
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-            z-index: 2;
-
-            &:hover {
-                color: gray;
-            }
-        }
-    }
-
-    .collectionSchema-row-wrapper {
-
-        &.row-above {
-            border-top: 1px solid red;
-        }
-
-        &.row-below {
-            border-bottom: 1px solid red;
-        }
-
-        &.row-inside {
-            border: 1px solid red;
-        }
-
-        .row-dragging {
-            background-color: blue;
-        }
-    }
-}
-
-.collectionSchemaView-cellContainer {
-    width: 100%;
-    height: unset;
-}
-
-.collectionSchemaView-cellWrapper {
-    height: 100%;
-    padding: 4px;
-    text-align: left;
-    padding-left: 19px;
-
-    position: relative;
-
-    &:focus {
-        outline: none;
-    }
-
-    &.editing {
-        padding: 0;
-
-        input {
-            outline: 0;
-            border: none;
-            background-color: rgb(255, 217, 217);
-            width: 100%;
-            height: 100%;
-            padding: 2px 3px;
-            min-height: 26px;
-        }
-    }
-
-    &.focused {
-
-        &.inactive {
-            border: none;
-        }
-    }
-
-    p {
-        width: 100%;
-        height: 100%;
-    }
-
-    &:hover .collectionSchemaView-cellContents-docExpander {
-        display: block;
-    }
-
-
-    .collectionSchemaView-cellContents-document {
-        display: inline-block;
-    }
-
-    .collectionSchemaView-cellContents-docButton {
-        float: right;
-        width: "15px";
-        height: "15px";
-    }
-
-    .collectionSchemaView-dropdownWrapper {
-
-        border: grey;
-        border-style: solid;
-        border-width: 1px;
-        height: 30px;
-
-        .collectionSchemaView-dropdownButton {
-
-            //display: inline-block;
-            float: left;
-            height: 100%;
-
-
-        }
-
-        .collectionSchemaView-dropdownText {
-            display: inline-block;
-            //float: right;
-            height: 100%;
-            display: "flex";
-            font-size: 13;
-            justify-content: "center";
-            align-items: "center";
-        }
-
-    }
-
-    .collectionSchemaView-dropdownContainer {
-        position: absolute;
-        border: 1px solid rgba(0, 0, 0, 0.04);
-        box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14);
-
-        .collectionSchemaView-dropdownOption:hover {
-            background-color: rgba(0, 0, 0, 0.14);
-            cursor: pointer;
-        }
-    }
-}
-
-.collectionSchemaView-cellContents-docExpander {
-    height: 30px;
-    width: 30px;
-    display: none;
-    position: absolute;
-    top: 0;
-    right: 0;
-    background-color: lightgray;
-
-}
-
-.doc-drag-over {
-    background-color: red;
-}
-
-.collectionSchemaView-toolbar {
-    z-index: 100;
-}
-
-.collectionSchemaView-toolbar {
-    height: 30px;
-    display: flex;
-    justify-content: flex-end;
-    padding: 0 10px;
-    border-bottom: 2px solid gray;
-
-    .collectionSchemaView-toolbar-item {
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-    }
-}
-
-#preview-schema-checkbox-div {
-    margin-left: 20px;
-    font-size: 12px;
-}
-
-.collectionSchemaView-table {
-    width: 100%;
-    height: 100%;
-    overflow: auto;
-    padding: 3px;
-}
-
-.rt-td.rt-expandable {
-    overflow: visible;
-    position: relative;
-    height:100%;
-    z-index: 1;
-}
-.reactTable-sub {
-    background-color: rgb(252, 252, 252);
-    width: 100%;
-
-    .rt-thead {
-        display: none;
-    }
-
-    .row-dragger {
-        background-color: rgb(252, 252, 252);
-    }
-
-    .rt-table {
-        background-color: rgb(252, 252, 252);
-    }
-
-    .collectionSchemaView-table {
-        width: 100%; 
-        border: solid 1px;
-        overflow: visible;
-        padding: 0px;
-    }
-}
-
-.collectionSchemaView-expander {
-    height: 100%;
-    min-height: 30px;
-    position: absolute;
-    color: gray;
-    width: 20;
-    height: auto;
-    left: 55;
-
-    svg {
-        position: absolute;
-        top: 50%;
-        left: 10;
-        transform: translate(-50%, -50%);
-    }
-}
-
-.collectionSchemaView-addRow {
-    color: gray;
-    letter-spacing: 2px;
-    text-transform: uppercase;
-    cursor: pointer;
-    font-size: 10.5px;
-    margin-left: 50px;
-    margin-top: 10px;
-}
\ No newline at end of file
diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx
deleted file mode 100644
index b33c437a9..000000000
--- a/src/client/views/collections/CollectionSchemaView.tsx
+++ /dev/null
@@ -1,575 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { action, computed, observable, untracked } from "mobx";
-import { observer } from "mobx-react";
-import Measure from "react-measure";
-import { Resize } from "react-table";
-import "react-table/react-table.css";
-import { Doc, Opt } from "../../../fields/Doc";
-import { List } from "../../../fields/List";
-import { listSpec } from "../../../fields/Schema";
-import { PastelSchemaPalette, SchemaHeaderField } from "../../../fields/SchemaHeaderField";
-import { Cast, NumCast } from "../../../fields/Types";
-import { TraceMobx } from "../../../fields/util";
-import { emptyFunction, emptyPath, returnFalse, setupMoveUpEvents, returnEmptyDoclist, returnTrue } from "../../../Utils";
-import { SelectionManager } from "../../util/SelectionManager";
-import { SnappingManager } from "../../util/SnappingManager";
-import { Transform } from "../../util/Transform";
-import { undoBatch } from "../../util/UndoManager";
-import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../views/globalCssVariables.scss';
-import { ContextMenu } from "../ContextMenu";
-import { ContextMenuProps } from "../ContextMenuItem";
-import '../DocumentDecorations.scss';
-import { DocumentView } from "../nodes/DocumentView";
-import { DefaultStyleProvider } from "../StyleProvider";
-import "./CollectionSchemaView.scss";
-import { CollectionSubView } from "./CollectionSubView";
-import { SchemaTable } from "./SchemaTable";
-import { DocUtils } from "../../documents/Documents";
-// bcz: need to add drag and drop of rows and columns.  This seems like it might work for rows: https://codesandbox.io/s/l94mn1q657
-
-export enum ColumnType {
-    Any,
-    Number,
-    String,
-    Boolean,
-    Doc,
-    Image,
-    List,
-    Date
-}
-// this map should be used for keys that should have a const type of value
-const columnTypes: Map<string, ColumnType> = new Map([
-    ["title", ColumnType.String],
-    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
-    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
-    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
-]);
-
-@observer
-export class CollectionSchemaView extends CollectionSubView(doc => doc) {
-    private _previewCont?: HTMLDivElement;
-
-    @observable _previewDoc: Doc | undefined = undefined;
-    @observable _focusedTable: Doc = this.props.Document;
-    @observable _col: any = "";
-    @observable _menuWidth = 0;
-    @observable _headerOpen = false;
-    @observable _headerIsEditing = false;
-    @observable _menuHeight = 0;
-    @observable _pointerX = 0;
-    @observable _pointerY = 0;
-    @observable _openTypes: boolean = false;
-
-    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
-    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
-    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
-    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
-    @computed get scale() { return this.props.ScreenToLocalTransform().Scale; }
-    @computed get columns() { return Cast(this.props.Document._schemaHeaders, listSpec(SchemaHeaderField), []); }
-    set columns(columns: SchemaHeaderField[]) { this.props.Document._schemaHeaders = new List<SchemaHeaderField>(columns); }
-
-    @computed get menuCoordinates() {
-        let searchx = 0;
-        let searchy = 0;
-        if (this.props.Document._searchDoc) {
-            const el = document.getElementsByClassName("collectionSchemaView-searchContainer")[0];
-            if (el !== undefined) {
-                const rect = el.getBoundingClientRect();
-                searchx = rect.x;
-                searchy = rect.y;
-            }
-        }
-        const x = Math.max(0, Math.min(document.body.clientWidth - this._menuWidth, this._pointerX)) - searchx;
-        const y = Math.max(0, Math.min(document.body.clientHeight - this._menuHeight, this._pointerY)) - searchy;
-        return this.props.ScreenToLocalTransform().transformPoint(x, y);
-    }
-
-    get documentKeys() {
-        const docs = this.childDocs;
-        const keys: { [key: string]: boolean } = {};
-        // bcz: ugh.  this is untracked since otherwise a large collection of documents will blast the server for all their fields.
-        //  then as each document's fields come back, we update the documents _proxies.  Each time we do this, the whole schema will be
-        //  invalidated and re-rendered.   This workaround will inquire all of the document fields before the options button is clicked.
-        //  then by the time the options button is clicked, all of the fields should be in place.  If a new field is added while this menu
-        //  is displayed (unlikely) it won't show up until something else changes.
-        //TODO Types
-        untracked(() => docs.map(doc => Doc.GetAllPrototypes(doc).map(proto => Object.keys(proto).forEach(key => keys[key] = false))));
-
-        this.columns.forEach(key => keys[key.heading] = true);
-        return Array.from(Object.keys(keys));
-    }
-
-    @action setHeaderIsEditing = (isEditing: boolean) => this._headerIsEditing = isEditing;
-
-    @undoBatch
-    setColumnType = action((columnField: SchemaHeaderField, type: ColumnType): void => {
-        this._openTypes = false;
-        if (columnTypes.get(columnField.heading)) return;
-
-        const columns = this.columns;
-        const index = columns.indexOf(columnField);
-        if (index > -1) {
-            columnField.setType(NumCast(type));
-            columns[index] = columnField;
-            this.columns = columns;
-        }
-    });
-
-    @undoBatch
-    setColumnColor = (columnField: SchemaHeaderField, color: string): void => {
-        const columns = this.columns;
-        const index = columns.indexOf(columnField);
-        if (index > -1) {
-            columnField.setColor(color);
-            columns[index] = columnField;
-            this.columns = columns; // need to set the columns to trigger rerender
-        }
-    }
-
-    @undoBatch
-    @action
-    setColumnSort = (columnField: SchemaHeaderField, descending: boolean | undefined) => {
-        const columns = this.columns;
-        columns.forEach(col => col.setDesc(undefined));
-
-        const index = columns.findIndex(c => c.heading === columnField.heading);
-        const column = columns[index];
-        column.setDesc(descending);
-        columns[index] = column;
-        this.columns = columns;
-    }
-
-    renderTypes = (col: any) => {
-        if (columnTypes.get(col.heading)) return (null);
-
-        const type = col.type;
-
-        const anyType = <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Any)}>
-            <FontAwesomeIcon icon={"align-justify"} size="sm" />
-                Any
-            </div>;
-
-        const numType = <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Number)}>
-            <FontAwesomeIcon icon={"hashtag"} size="sm" />
-                Number
-            </div>;
-
-        const textType = <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.String)}>
-            <FontAwesomeIcon icon={"font"} size="sm" />
-            Text
-            </div>;
-
-        const boolType = <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Boolean)}>
-            <FontAwesomeIcon icon={"check-square"} size="sm" />
-            Checkbox
-            </div>;
-
-        const listType = <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.List)}>
-            <FontAwesomeIcon icon={"list-ul"} size="sm" />
-            List
-            </div>;
-
-        const docType = <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Doc)}>
-            <FontAwesomeIcon icon={"file"} size="sm" />
-            Document
-            </div>;
-
-        const imageType = <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Image)}>
-            <FontAwesomeIcon icon={"image"} size="sm" />
-            Image
-            </div>;
-
-        const dateType = <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Date)}>
-            <FontAwesomeIcon icon={"calendar"} size="sm" />
-                Date
-                </div>;
-
-
-        const allColumnTypes = <div className="columnMenu-types">
-            {anyType}
-            {numType}
-            {textType}
-            {boolType}
-            {listType}
-            {docType}
-            {imageType}
-            {dateType}
-        </div>;
-
-        const justColType = type === ColumnType.Any ? anyType : type === ColumnType.Number ? numType :
-            type === ColumnType.String ? textType : type === ColumnType.Boolean ? boolType :
-                type === ColumnType.List ? listType : type === ColumnType.Doc ? docType :
-                    type === ColumnType.Date ? dateType : imageType;
-
-        return (
-            <div className="collectionSchema-headerMenu-group" onClick={action(() => this._openTypes = !this._openTypes)}>
-                <div>
-                    <label style={{ cursor: "pointer" }}>Column type:</label>
-                    <FontAwesomeIcon icon={"caret-down"} size="lg" style={{ float: "right", transform: `rotate(${this._openTypes ? "180deg" : 0})`, transition: "0.2s all ease" }} />
-                </div>
-                {this._openTypes ? allColumnTypes : justColType}
-            </div >
-        );
-    }
-
-    renderSorting = (col: any) => {
-        const sort = col.desc;
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Sort by:</label>
-                <div className="columnMenu-sort">
-                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.setColumnSort(col, true)}>
-                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
-                        Sort descending
-                    </div>
-                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.setColumnSort(col, false)}>
-                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
-                        Sort ascending
-                    </div>
-                    <div className="columnMenu-option" onClick={() => this.setColumnSort(col, undefined)}>
-                        <FontAwesomeIcon icon="times" size="sm" />
-                        Clear sorting
-                    </div>
-                </div>
-            </div>
-        );
-    }
-
-    renderColors = (col: any) => {
-        const selected = col.color;
-
-        const pink = PastelSchemaPalette.get("pink2");
-        const purple = PastelSchemaPalette.get("purple2");
-        const blue = PastelSchemaPalette.get("bluegreen1");
-        const yellow = PastelSchemaPalette.get("yellow4");
-        const red = PastelSchemaPalette.get("red2");
-        const gray = "#f1efeb";
-
-        return (
-            <div className="collectionSchema-headerMenu-group">
-                <label>Color:</label>
-                <div className="columnMenu-colors">
-                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.setColumnColor(col, pink!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.setColumnColor(col, purple!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.setColumnColor(col, blue!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.setColumnColor(col, yellow!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.setColumnColor(col, red!)}></div>
-                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.setColumnColor(col, gray)}></div>
-                </div>
-            </div>
-        );
-    }
-
-    @undoBatch
-    @action
-    changeColumns = (oldKey: string, newKey: string, addNew: boolean, filter?: string) => {
-        const columns = this.columns;
-        if (columns === undefined) {
-            this.columns = new List<SchemaHeaderField>([new SchemaHeaderField(newKey, "f1efeb")]);
-        } else {
-            if (addNew) {
-                columns.push(new SchemaHeaderField(newKey, "f1efeb"));
-                this.columns = columns;
-            } else {
-                const index = columns.map(c => c.heading).indexOf(oldKey);
-                if (index > -1) {
-                    const column = columns[index];
-                    column.setHeading(newKey);
-                    columns[index] = column;
-                    this.columns = columns;
-                    if (filter) {
-                        Doc.setDocFilter(this.props.Document, newKey, filter, "match");
-                    }
-                    else {
-                        this.props.Document._docFilters = undefined;
-                    }
-                }
-            }
-        }
-    }
-
-    @action
-    openHeader = (col: any, screenx: number, screeny: number) => {
-        this._col = col;
-        this._headerOpen = true;
-        this._pointerX = screenx;
-        this._pointerY = screeny;
-    }
-
-    @action
-    closeHeader = () => { this._headerOpen = false; }
-
-    @undoBatch
-    @action
-    deleteColumn = (key: string) => {
-        const columns = this.columns;
-        if (columns === undefined) {
-            this.columns = new List<SchemaHeaderField>([]);
-        } else {
-            const index = columns.map(c => c.heading).indexOf(key);
-            if (index > -1) {
-                columns.splice(index, 1);
-                this.columns = columns;
-            }
-        }
-        this.closeHeader();
-    }
-
-    getPreviewTransform = (): Transform => {
-        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - NumCast(COLLECTION_BORDER_WIDTH) - this.tableWidth, - this.borderWidth);
-    }
-
-    @action
-    onHeaderClick = (e: React.PointerEvent) => {
-        e.stopPropagation();
-    }
-
-    @action
-    onWheel(e: React.WheelEvent) {
-        const scale = this.props.ScreenToLocalTransform().Scale;
-        this.props.isContentActive(true) && e.stopPropagation();
-    }
-
-    @computed get renderMenuContent() {
-        TraceMobx();
-        return <div className="collectionSchema-header-menuOptions">
-            {this.renderTypes(this._col)}
-            {this.renderColors(this._col)}
-            <div className="collectionSchema-headerMenu-group">
-                <button onClick={() => { this.deleteColumn(this._col.heading); }}
-                >Delete Column</button>
-            </div>
-        </div>;
-    }
-
-    private createTarget = (ele: HTMLDivElement) => {
-        this._previewCont = ele;
-        super.CreateDropTarget(ele);
-    }
-
-    isFocused = (doc: Doc, outsideReaction: boolean): boolean => this.props.isSelected(outsideReaction) && doc === this._focusedTable;
-
-    @action setFocused = (doc: Doc) => this._focusedTable = doc;
-
-    @action setPreviewDoc = (doc: Opt<Doc>) => {
-        SelectionManager.SelectSchemaView(this, doc);
-        this._previewDoc = doc;
-    }
-
-    //toggles preview side-panel of schema
-    @action
-    toggleExpander = () => {
-        this.props.Document.schemaPreviewWidth = this.previewWidth() === 0 ? Math.min(this.tableWidth / 3, 200) : 0;
-    }
-
-    onDividerDown = (e: React.PointerEvent) => {
-        setupMoveUpEvents(this, e, this.onDividerMove, emptyFunction, this.toggleExpander);
-    }
-    @action
-    onDividerMove = (e: PointerEvent, down: number[], delta: number[]) => {
-        const nativeWidth = this._previewCont!.getBoundingClientRect();
-        const minWidth = 40;
-        const maxWidth = 1000;
-        const movedWidth = this.props.ScreenToLocalTransform().transformDirection(nativeWidth.right - e.clientX, 0)[0];
-        const width = movedWidth < minWidth ? minWidth : movedWidth > maxWidth ? maxWidth : movedWidth;
-        this.props.Document.schemaPreviewWidth = width;
-        return false;
-    }
-
-    onPointerDown = (e: React.PointerEvent): void => {
-        if (e.button === 0 && !e.altKey && !e.ctrlKey && !e.metaKey) {
-            if (this.props.isSelected(true)) e.stopPropagation();
-            else this.props.select(false);
-        }
-    }
-
-    @computed
-    get previewDocument(): Doc | undefined { return this._previewDoc; }
-
-    @computed
-    get dividerDragger() {
-        return this.previewWidth() === 0 ? (null) :
-            <div className="collectionSchemaView-dividerDragger" onPointerDown={this.onDividerDown} >
-                <div className="collectionSchemaView-dividerDragger" />
-            </div>;
-    }
-
-    @computed
-    get previewPanel() {
-        return <div ref={this.createTarget} style={{ width: `${this.previewWidth()}px` }}>
-            {!this.previewDocument ? (null) :
-                <DocumentView
-                    Document={this.previewDocument}
-                    DataDoc={undefined}
-                    fitContentsToDoc={returnTrue}
-                    freezeDimensions={true}
-                    dontCenter={"y"}
-                    focus={DocUtils.DefaultFocus}
-                    renderDepth={this.props.renderDepth}
-                    rootSelected={this.rootSelected}
-                    PanelWidth={this.previewWidth}
-                    PanelHeight={this.previewHeight}
-                    isContentActive={returnTrue}
-                    isDocumentActive={returnFalse}
-                    ScreenToLocalTransform={this.getPreviewTransform}
-                    docFilters={this.docFilters}
-                    docRangeFilters={this.docRangeFilters}
-                    searchFilterDocs={this.searchFilterDocs}
-                    styleProvider={DefaultStyleProvider}
-                    layerProvider={undefined}
-                    docViewPath={returnEmptyDoclist}
-                    ContainingCollectionDoc={this.props.CollectionView?.props.Document}
-                    ContainingCollectionView={this.props.CollectionView}
-                    moveDocument={this.props.moveDocument}
-                    addDocument={this.props.addDocument}
-                    removeDocument={this.props.removeDocument}
-                    whenChildContentsActiveChanged={this.props.whenChildContentsActiveChanged}
-                    addDocTab={this.props.addDocTab}
-                    pinToPres={this.props.pinToPres}
-                    bringToFront={returnFalse}
-                />}
-        </div>;
-    }
-
-    @computed
-    get schemaTable() {
-        return <SchemaTable
-            Document={this.props.Document}
-            PanelHeight={this.props.PanelHeight}
-            PanelWidth={this.props.PanelWidth}
-            childDocs={this.childDocs}
-            CollectionView={this.props.CollectionView}
-            ContainingCollectionView={this.props.ContainingCollectionView}
-            ContainingCollectionDoc={this.props.ContainingCollectionDoc}
-            fieldKey={this.props.fieldKey}
-            renderDepth={this.props.renderDepth}
-            moveDocument={this.props.moveDocument}
-            ScreenToLocalTransform={this.props.ScreenToLocalTransform}
-            active={this.props.isContentActive}
-            onDrop={this.onExternalDrop}
-            addDocTab={this.props.addDocTab}
-            pinToPres={this.props.pinToPres}
-            isSelected={this.props.isSelected}
-            isFocused={this.isFocused}
-            setFocused={this.setFocused}
-            setPreviewDoc={this.setPreviewDoc}
-            deleteDocument={this.props.removeDocument}
-            addDocument={this.props.addDocument}
-            dataDoc={this.props.DataDoc}
-            columns={this.columns}
-            documentKeys={this.documentKeys}
-            headerIsEditing={this._headerIsEditing}
-            openHeader={this.openHeader}
-            onClick={this.onTableClick}
-            onPointerDown={emptyFunction}
-            onResizedChange={this.onResizedChange}
-            setColumns={this.setColumns}
-            reorderColumns={this.reorderColumns}
-            changeColumns={this.changeColumns}
-            setHeaderIsEditing={this.setHeaderIsEditing}
-            changeColumnSort={this.setColumnSort}
-        />;
-    }
-
-    @computed
-    public get schemaToolbar() {
-        return <div className="collectionSchemaView-toolbar">
-            <div className="collectionSchemaView-toolbar-item">
-                <div id="preview-schema-checkbox-div">
-                    <input type="checkbox" key={"Show Preview"} checked={this.previewWidth() !== 0} onChange={this.toggleExpander} />
-                    Show Preview
-                </div>
-            </div>
-        </div>;
-    }
-
-    onSpecificMenu = (e: React.MouseEvent) => {
-        if ((e.target as any)?.className?.includes?.("collectionSchemaView-cell") || (e.target instanceof HTMLSpanElement)) {
-            const cm = ContextMenu.Instance;
-            const options = cm.findByDescription("Options...");
-            const optionItems: ContextMenuProps[] = options && "subitems" in options ? options.subitems : [];
-            optionItems.push({ description: "remove", event: () => this._previewDoc && this.props.removeDocument?.(this._previewDoc), icon: "trash" });
-            !options && cm.addItem({ description: "Options...", subitems: optionItems, icon: "compass" });
-            cm.displayMenu(e.clientX, e.clientY);
-            (e.nativeEvent as any).SchemaHandled = true; // not sure why this is needed, but if you right-click quickly on a cell, the Document/Collection contextMenu handlers still fire without this.
-            e.stopPropagation();
-        }
-    }
-
-    @action
-    onTableClick = (e: React.MouseEvent): void => {
-        if (!(e.target as any)?.className?.includes?.("collectionSchemaView-cell") && !(e.target instanceof HTMLSpanElement)) {
-            this.setPreviewDoc(undefined);
-        } else {
-            e.stopPropagation();
-        }
-        this.setFocused(this.props.Document);
-        this.closeHeader();
-    }
-
-    onResizedChange = (newResized: Resize[], event: any) => {
-        const columns = this.columns;
-        newResized.forEach(resized => {
-            const index = columns.findIndex(c => c.heading === resized.id);
-            const column = columns[index];
-            column.setWidth(resized.value);
-            columns[index] = column;
-        });
-        this.columns = columns;
-    }
-
-    @action
-    setColumns = (columns: SchemaHeaderField[]) => this.columns = columns
-
-    @undoBatch
-    reorderColumns = (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => {
-        const columns = [...columnsValues];
-        const oldIndex = columns.indexOf(toMove);
-        const relIndex = columns.indexOf(relativeTo);
-        const newIndex = (oldIndex > relIndex && !before) ? relIndex + 1 : (oldIndex < relIndex && before) ? relIndex - 1 : relIndex;
-
-        if (oldIndex === newIndex) return;
-
-        columns.splice(newIndex, 0, columns.splice(oldIndex, 1)[0]);
-        this.columns = columns;
-    }
-
-    onZoomMenu = (e: React.WheelEvent) => this.props.isContentActive(true) && e.stopPropagation();
-
-    render() {
-        TraceMobx();
-        if (!this.props.isContentActive()) setTimeout(() => this.closeHeader(), 0);
-        const menuContent = this.renderMenuContent;
-        const menu = <div className="collectionSchema-header-menu"
-            onWheel={e => this.onZoomMenu(e)}
-            onPointerDown={e => this.onHeaderClick(e)}
-            style={{ transform: `translate(${(this.menuCoordinates[0])}px, ${(this.menuCoordinates[1])}px)` }}>
-            <Measure offset onResize={action((r: any) => {
-                const dim = this.props.ScreenToLocalTransform().inverse().transformDirection(r.offset.width, r.offset.height);
-                this._menuWidth = dim[0]; this._menuHeight = dim[1];
-            })}>
-                {({ measureRef }) => <div ref={measureRef}> {menuContent} </div>}
-            </Measure>
-        </div>;
-        return <div className={"collectionSchemaView" + (this.props.Document._searchDoc ? "-searchContainer" : "-container")}
-            style={{
-                overflow: this.props.scrollOverflow === true ? "scroll" : undefined, backgroundColor: "white",
-                pointerEvents: this.props.Document._searchDoc !== undefined && !this.props.isContentActive() && !SnappingManager.GetIsDragging() ? "none" : undefined,
-                width: name === "collectionSchemaView-searchContainer" ? "auto" : this.props.PanelWidth() || "100%", height: this.props.PanelHeight() || "100%", position: "relative",
-            }}  >
-            <div className="collectionSchemaView-tableContainer"
-                style={{ width: `calc(100% - ${this.previewWidth()}px)` }}
-                onContextMenu={this.onSpecificMenu}
-                onPointerDown={this.onPointerDown}
-                onWheel={e => this.props.isContentActive(true) && e.stopPropagation()}
-                onDrop={e => this.onExternalDrop(e, {})}
-                ref={this.createTarget}>
-                {this.schemaTable}
-            </div>
-            {this.dividerDragger}
-            {!this.previewWidth() ? (null) : this.previewPanel}
-            {this._headerOpen && this.props.isContentActive() ? menu : null}
-        </div>;
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx
index fb60265e3..e5b1721f9 100644
--- a/src/client/views/collections/CollectionView.tsx
+++ b/src/client/views/collections/CollectionView.tsx
@@ -29,7 +29,7 @@ import CollectionMapView from './CollectionMapView';
 import { CollectionMulticolumnView } from './collectionMulticolumn/CollectionMulticolumnView';
 import { CollectionMultirowView } from './collectionMulticolumn/CollectionMultirowView';
 import { CollectionPileView } from './CollectionPileView';
-import { CollectionSchemaView } from "./CollectionSchemaView";
+import { CollectionSchemaView } from "./schemaView/CollectionSchemaView";
 import { CollectionStackingView } from './CollectionStackingView';
 import { SubCollectionViewProps } from './CollectionSubView';
 import { CollectionTimeView } from './CollectionTimeView';
diff --git a/src/client/views/collections/SchemaTable.tsx b/src/client/views/collections/SchemaTable.tsx
deleted file mode 100644
index 0c69ee030..000000000
--- a/src/client/views/collections/SchemaTable.tsx
+++ /dev/null
@@ -1,599 +0,0 @@
-import React = require("react");
-import { IconProp } from '@fortawesome/fontawesome-svg-core';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { action, computed, observable } from "mobx";
-import { observer } from "mobx-react";
-import ReactTable, { CellInfo, Column, ComponentPropsGetterR, Resize, SortingRule } from "react-table";
-import "react-table/react-table.css";
-import { DateField } from "../../../fields/DateField";
-import { AclPrivate, AclReadonly, DataSym, Doc, DocListCast, Field, Opt } from "../../../fields/Doc";
-import { Id } from "../../../fields/FieldSymbols";
-import { List } from "../../../fields/List";
-import { listSpec } from "../../../fields/Schema";
-import { SchemaHeaderField } from "../../../fields/SchemaHeaderField";
-import { ComputedField } from "../../../fields/ScriptField";
-import { Cast, FieldValue, NumCast, StrCast } from "../../../fields/Types";
-import { ImageField } from "../../../fields/URLField";
-import { GetEffectiveAcl } from "../../../fields/util";
-import { emptyFunction, emptyPath, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue } from "../../../Utils";
-import { Docs, DocumentOptions, DocUtils } from "../../documents/Documents";
-import { DocumentType } from "../../documents/DocumentTypes";
-import { CompileScript, Transformer, ts } from "../../util/Scripting";
-import { Transform } from "../../util/Transform";
-import { undoBatch } from "../../util/UndoManager";
-import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../views/globalCssVariables.scss';
-import { ContextMenu } from "../ContextMenu";
-import '../DocumentDecorations.scss';
-import { DocumentView } from "../nodes/DocumentView";
-import { DefaultStyleProvider } from "../StyleProvider";
-import { CellProps, CollectionSchemaButtons, CollectionSchemaCell, CollectionSchemaCheckboxCell, CollectionSchemaDateCell, CollectionSchemaDocCell, CollectionSchemaImageCell, CollectionSchemaListCell, CollectionSchemaNumberCell, CollectionSchemaStringCell } from "./CollectionSchemaCells";
-import { CollectionSchemaAddColumnHeader, KeysDropdown } from "./CollectionSchemaHeaders";
-import { MovableColumn, MovableRow } from "./CollectionSchemaMovableTableHOC";
-import "./CollectionSchemaView.scss";
-import { CollectionView } from "./CollectionView";
-
-
-enum ColumnType {
-    Any,
-    Number,
-    String,
-    Boolean,
-    Doc,
-    Image,
-    List,
-    Date
-}
-
-// this map should be used for keys that should have a const type of value
-const columnTypes: Map<string, ColumnType> = new Map([
-    ["title", ColumnType.String],
-    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
-    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
-    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
-]);
-
-export interface SchemaTableProps {
-    Document: Doc; // child doc
-    dataDoc?: Doc;
-    PanelHeight: () => number;
-    PanelWidth: () => number;
-    childDocs?: Doc[];
-    CollectionView: Opt<CollectionView>;
-    ContainingCollectionView: Opt<CollectionView>;
-    ContainingCollectionDoc: Opt<Doc>;
-    fieldKey: string;
-    renderDepth: number;
-    deleteDocument?: (document: Doc | Doc[]) => boolean;
-    addDocument?: (document: Doc | Doc[]) => boolean;
-    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (document: Doc | Doc[]) => boolean) => boolean;
-    ScreenToLocalTransform: () => Transform;
-    active: (outsideReaction: boolean | undefined) => boolean;
-    onDrop: (e: React.DragEvent<Element>, options: DocumentOptions, completed?: (() => void) | undefined) => void;
-    addDocTab: (document: Doc, where: string) => boolean;
-    pinToPres: (document: Doc) => void;
-    isSelected: (outsideReaction?: boolean) => boolean;
-    isFocused: (document: Doc, outsideReaction: boolean) => boolean;
-    setFocused: (document: Doc) => void;
-    setPreviewDoc: (document: Opt<Doc>) => void;
-    columns: SchemaHeaderField[];
-    documentKeys: any[];
-    headerIsEditing: boolean;
-    openHeader: (column: any, screenx: number, screeny: number) => void;
-    onClick: (e: React.MouseEvent) => void;
-    onPointerDown: (e: React.PointerEvent) => void;
-    onResizedChange: (newResized: Resize[], event: any) => void;
-    setColumns: (columns: SchemaHeaderField[]) => void;
-    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => void;
-    changeColumns: (oldKey: string, newKey: string, addNew: boolean) => void;
-    setHeaderIsEditing: (isEditing: boolean) => void;
-    changeColumnSort: (columnField: SchemaHeaderField, descending: boolean | undefined) => void;
-}
-
-@observer
-export class SchemaTable extends React.Component<SchemaTableProps> {
-    @observable _cellIsEditing: boolean = false;
-    @observable _focusedCell: { row: number, col: number } = { row: 0, col: 0 };
-    @observable _openCollections: Set<number> = new Set;
-
-    @observable _showDoc: Doc | undefined;
-    @observable _showDataDoc: any = "";
-    @observable _showDocPos: number[] = [];
-
-    @observable _showTitleDropdown: boolean = false;
-
-    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
-    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
-    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
-
-    @computed get childDocs() {
-        if (this.props.childDocs) return this.props.childDocs;
-
-        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
-        return DocListCast(doc[this.props.fieldKey]);
-    }
-    set childDocs(docs: Doc[]) {
-        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
-        doc[this.props.fieldKey] = new List<Doc>(docs);
-    }
-
-    @computed get textWrappedRows() {
-        return Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
-    }
-    set textWrappedRows(textWrappedRows: string[]) {
-        this.props.Document.textwrappedSchemaRows = new List<string>(textWrappedRows);
-    }
-
-    @computed get resized(): { id: string, value: number }[] {
-        return this.props.columns.reduce((resized, shf) => {
-            (shf.width > -1) && resized.push({ id: shf.heading, value: shf.width });
-            return resized;
-        }, [] as { id: string, value: number }[]);
-    }
-    @computed get sorted(): SortingRule[] {
-        return this.props.columns.reduce((sorted, shf) => {
-            shf.desc !== undefined && sorted.push({ id: shf.heading, desc: shf.desc });
-            return sorted;
-        }, [] as SortingRule[]);
-    }
-
-    @action
-    changeSorting = (col: any) => {
-        this.props.changeColumnSort(col, col.desc === true ? false : col.desc === false ? undefined : true);
-    }
-
-    @action
-    changeTitleMode = () => this._showTitleDropdown = !this._showTitleDropdown
-
-    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
-    @computed get tableColumns(): Column<Doc>[] {
-        const possibleKeys = this.props.documentKeys.filter(key => this.props.columns.findIndex(existingKey => existingKey.heading.toUpperCase() === key.toUpperCase()) === -1);
-        const columns: Column<Doc>[] = [];
-        const tableIsFocused = this.props.isFocused(this.props.Document, false);
-        const focusedRow = this._focusedCell.row;
-        const focusedCol = this._focusedCell.col;
-        const isEditable = !this.props.headerIsEditing;
-
-        columns.push({
-            expander: true, Header: "", width: 58,
-            Expander: (rowInfo) => {
-                return rowInfo.original.type !== DocumentType.COL ? (null) :
-                    <div className="collectionSchemaView-expander" onClick={action(() => (this._openCollections[rowInfo.isExpanded ? "delete" : "add"])(rowInfo.viewIndex))}>
-                        <FontAwesomeIcon icon={rowInfo.isExpanded ? "caret-down" : "caret-right"} size="lg" />
-                    </div>;
-            }
-        });
-        columns.push(...this.props.columns.map(col => {
-            const icon: IconProp = this.getColumnType(col) === ColumnType.Number ? "hashtag" : this.getColumnType(col) === ColumnType.String ? "font" :
-                this.getColumnType(col) === ColumnType.Boolean ? "check-square" : this.getColumnType(col) === ColumnType.Doc ? "file" :
-                    this.getColumnType(col) === ColumnType.Image ? "image" : this.getColumnType(col) === ColumnType.List ? "list-ul" :
-                        this.getColumnType(col) === ColumnType.Date ? "calendar" : "align-justify";
-
-            const keysDropdown = <KeysDropdown
-                keyValue={col.heading}
-                possibleKeys={possibleKeys}
-                existingKeys={this.props.columns.map(c => c.heading)}
-                canAddNew={true}
-                addNew={false}
-                onSelect={this.props.changeColumns}
-                setIsEditing={this.props.setHeaderIsEditing}
-                docs={this.props.childDocs}
-                Document={this.props.Document}
-                dataDoc={this.props.dataDoc}
-                fieldKey={this.props.fieldKey}
-                ContainingCollectionDoc={this.props.ContainingCollectionDoc}
-                ContainingCollectionView={this.props.ContainingCollectionView}
-                active={this.props.active}
-                openHeader={this.props.openHeader}
-                icon={icon}
-                col={col}
-                // try commenting this out
-                width={"100%"}
-            />;
-
-            const sortIcon = col.desc === undefined ? "caret-right" : col.desc === true ? "caret-down" : "caret-up";
-            const header = <div className="collectionSchemaView-menuOptions-wrapper" style={{ background: col.color, padding: "2px", display: "flex", cursor: "default", height: "100%", }}>
-                {keysDropdown}
-                <div onClick={e => this.changeSorting(col)} style={{ width: 21, padding: 1, display: "inline", zIndex: 1, background: "inherit", cursor: "hand" }}>
-                    <FontAwesomeIcon icon={sortIcon} size="lg" />
-                </div>
-            </div>;
-
-            return {
-                Header: <MovableColumn columnRenderer={header} columnValue={col} allColumns={this.props.columns} reorderColumns={this.props.reorderColumns} ScreenToLocalTransform={this.props.ScreenToLocalTransform} />,
-                accessor: (doc: Doc) => doc ? Field.toString(doc[col.heading] as Field) : 0,
-                id: col.heading,
-                Cell: (rowProps: CellInfo) => {
-                    const rowIndex = rowProps.index;
-                    const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
-                    const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
-
-                    const props: CellProps = {
-                        row: rowIndex,
-                        col: columnIndex,
-                        rowProps: rowProps,
-                        isFocused: isFocused,
-                        changeFocusedCellByIndex: this.changeFocusedCellByIndex,
-                        CollectionView: this.props.CollectionView,
-                        ContainingCollection: this.props.ContainingCollectionView,
-                        Document: this.props.Document,
-                        fieldKey: this.props.fieldKey,
-                        renderDepth: this.props.renderDepth,
-                        addDocTab: this.props.addDocTab,
-                        pinToPres: this.props.pinToPres,
-                        moveDocument: this.props.moveDocument,
-                        setIsEditing: this.setCellIsEditing,
-                        isEditable: isEditable,
-                        setPreviewDoc: this.props.setPreviewDoc,
-                        setComputed: this.setComputed,
-                        getField: this.getField,
-                        showDoc: this.showDoc,
-                    };
-
-
-                    switch (this.getColumnType(col, rowProps.original, rowProps.column.id)) {
-                        case ColumnType.Number: return <CollectionSchemaNumberCell {...props} />;
-                        case ColumnType.String: return <CollectionSchemaStringCell {...props} />;
-                        case ColumnType.Boolean: return <CollectionSchemaCheckboxCell {...props} />;
-                        case ColumnType.Doc: return <CollectionSchemaDocCell {...props} />;
-                        case ColumnType.Image: return <CollectionSchemaImageCell {...props} />;
-                        case ColumnType.List: return <CollectionSchemaListCell {...props} />;
-                        case ColumnType.Date: return <CollectionSchemaDateCell {...props} />;
-                        default:
-                            return <CollectionSchemaCell {...props} />;
-                    }
-                },
-                minWidth: 200,
-            };
-        }));
-        columns.push({
-            Header: <CollectionSchemaAddColumnHeader createColumn={this.createColumn} />,
-            accessor: (doc: Doc) => 0,
-            id: "add",
-            Cell: (rowProps: CellInfo) => {
-                const rowIndex = rowProps.index;
-                const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
-                const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
-                return <CollectionSchemaButtons  {...{
-                    row: rowProps.index,
-                    col: columnIndex,
-                    rowProps: rowProps,
-                    isFocused: isFocused,
-                    changeFocusedCellByIndex: this.changeFocusedCellByIndex,
-                    CollectionView: this.props.CollectionView,
-                    ContainingCollection: this.props.ContainingCollectionView,
-                    Document: this.props.Document,
-                    fieldKey: this.props.fieldKey,
-                    renderDepth: this.props.renderDepth,
-                    addDocTab: this.props.addDocTab,
-                    pinToPres: this.props.pinToPres,
-                    moveDocument: this.props.moveDocument,
-                    setIsEditing: this.setCellIsEditing,
-                    isEditable: isEditable,
-                    setPreviewDoc: this.props.setPreviewDoc,
-                    setComputed: this.setComputed,
-                    getField: this.getField,
-                    showDoc: this.showDoc,
-                }} />;
-            },
-            width: 28,
-            resizable: false
-        });
-        return columns;
-    }
-
-
-    constructor(props: SchemaTableProps) {
-        super(props);
-        if (this.props.Document._schemaHeaders === undefined) {
-            this.props.Document._schemaHeaders = new List<SchemaHeaderField>([new SchemaHeaderField("title", "#f1efeb"), new SchemaHeaderField("author", "#f1efeb"), new SchemaHeaderField("*lastModified", "#f1efeb", ColumnType.Date),
-            new SchemaHeaderField("text", "#f1efeb", ColumnType.String), new SchemaHeaderField("type", "#f1efeb"), new SchemaHeaderField("context", "#f1efeb", ColumnType.Doc)]);
-        }
-    }
-
-    componentDidMount() {
-        document.addEventListener("keydown", this.onKeyDown);
-    }
-
-    componentWillUnmount() {
-        document.removeEventListener("keydown", this.onKeyDown);
-    }
-
-    tableAddDoc = (doc: Doc, relativeTo?: Doc, before?: boolean) => {
-        const tableDoc = this.props.Document[DataSym];
-        const effectiveAcl = GetEffectiveAcl(tableDoc);
-
-        if (effectiveAcl !== AclPrivate && effectiveAcl !== AclReadonly) {
-            doc.context = this.props.Document;
-            tableDoc[this.props.fieldKey + "-lastModified"] = new DateField(new Date(Date.now()));
-            return Doc.AddDocToList(this.props.Document, this.props.fieldKey, doc, relativeTo, before);
-        }
-        return false;
-    }
-
-    private getTrProps: ComponentPropsGetterR = (state, rowInfo) => {
-        return !rowInfo ? {} : {
-            ScreenToLocalTransform: this.props.ScreenToLocalTransform,
-            addDoc: this.tableAddDoc,
-            removeDoc: this.props.deleteDocument,
-            rowInfo,
-            rowFocused: !this.props.headerIsEditing && rowInfo.index === this._focusedCell.row && this.props.isFocused(this.props.Document, true),
-            textWrapRow: this.toggleTextWrapRow,
-            rowWrapped: this.textWrappedRows.findIndex(id => rowInfo.original[Id] === id) > -1,
-            dropAction: StrCast(this.props.Document.childDropAction),
-            addDocTab: this.props.addDocTab
-        };
-    }
-
-    private getTdProps: ComponentPropsGetterR = (state, rowInfo, column, instance) => {
-        if (!rowInfo || column) return {};
-
-        const row = rowInfo.index;
-        //@ts-ignore
-        const col = this.columns.map(c => c.heading).indexOf(column!.id);
-        const isFocused = this._focusedCell.row === row && this._focusedCell.col === col && this.props.isFocused(this.props.Document, true);
-        // TODO: editing border doesn't work :(
-        return {
-            style: { border: !this.props.headerIsEditing && isFocused ? "2px solid rgb(255, 160, 160)" : "1px solid #f1efeb" }
-        };
-    }
-
-    @action setCellIsEditing = (isEditing: boolean) => this._cellIsEditing = isEditing;
-
-    @action
-    onKeyDown = (e: KeyboardEvent): void => {
-        if (!this._cellIsEditing && !this.props.headerIsEditing && this.props.isFocused(this.props.Document, true)) {// && this.props.isSelected(true)) {
-            const direction = e.key === "Tab" ? "tab" : e.which === 39 ? "right" : e.which === 37 ? "left" : e.which === 38 ? "up" : e.which === 40 ? "down" : "";
-            this._focusedCell = this.changeFocusedCellByDirection(direction, this._focusedCell.row, this._focusedCell.col);
-
-            if (direction) {
-                const pdoc = FieldValue(this.childDocs[this._focusedCell.row]);
-                pdoc && this.props.setPreviewDoc(pdoc);
-                e.stopPropagation();
-            }
-        } else if (e.keyCode === 27) {
-            this.props.setPreviewDoc(undefined);
-            e.stopPropagation(); // stopPropagation for left/right arrows 
-        }
-    }
-
-    changeFocusedCellByDirection = (direction: string, curRow: number, curCol: number) => {
-        switch (direction) {
-            case "tab": return { row: (curRow + 1 === this.childDocs.length ? 0 : curRow + 1), col: curCol + 1 === this.props.columns.length ? 0 : curCol + 1 };
-            case "right": return { row: curRow, col: curCol + 1 === this.props.columns.length ? curCol : curCol + 1 };
-            case "left": return { row: curRow, col: curCol === 0 ? curCol : curCol - 1 };
-            case "up": return { row: curRow === 0 ? curRow : curRow - 1, col: curCol };
-            case "down": return { row: curRow + 1 === this.childDocs.length ? curRow : curRow + 1, col: curCol };
-        }
-        return this._focusedCell;
-    }
-
-    @action
-    changeFocusedCellByIndex = (row: number, col: number): void => {
-        if (this._focusedCell.row !== row || this._focusedCell.col !== col) {
-            this._focusedCell = { row: row, col: col };
-        }
-        this.props.setFocused(this.props.Document);
-    }
-
-    @undoBatch
-    createRow = action(() => {
-        this.props.addDocument?.(Docs.Create.TextDocument("", { title: "", _width: 100, _height: 30 }));
-        this._focusedCell = { row: this.childDocs.length, col: this._focusedCell.col };
-    });
-
-    @undoBatch
-    @action
-    createColumn = () => {
-        let index = 0;
-        let found = this.props.columns.findIndex(col => col.heading.toUpperCase() === "New field".toUpperCase()) > -1;
-        while (found) {
-            index++;
-            found = this.props.columns.findIndex(col => col.heading.toUpperCase() === ("New field (" + index + ")").toUpperCase()) > -1;
-        }
-        this.props.columns.push(new SchemaHeaderField(`New field ${index ? "(" + index + ")" : ""}`, "#f1efeb"));
-    }
-
-    @action
-    getColumnType = (column: SchemaHeaderField, doc?: Doc, field?: string): ColumnType => {
-        if (doc && field && column.type === ColumnType.Any) {
-            const val = doc[CollectionSchemaCell.resolvedFieldKey(field, doc)];
-            if (val instanceof ImageField) return ColumnType.Image;
-            if (val instanceof Doc) return ColumnType.Doc;
-            if (val instanceof DateField) return ColumnType.Date;
-            if (val instanceof List) return ColumnType.List;
-        }
-        if (column.type && column.type !== 0) {
-            return column.type;
-        }
-        if (columnTypes.get(column.heading)) {
-            return column.type = columnTypes.get(column.heading)!;
-        }
-        return column.type = ColumnType.Any;
-    }
-
-    @undoBatch
-    @action
-    toggleTextwrap = async () => {
-        const textwrappedRows = Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
-        if (textwrappedRows.length) {
-            this.props.Document.textwrappedSchemaRows = new List<string>([]);
-        } else {
-            const docs = DocListCast(this.props.Document[this.props.fieldKey]);
-            const allRows = docs instanceof Doc ? [docs[Id]] : docs.map(doc => doc[Id]);
-            this.props.Document.textwrappedSchemaRows = new List<string>(allRows);
-        }
-    }
-
-    @action
-    toggleTextWrapRow = (doc: Doc): void => {
-        const textWrapped = this.textWrappedRows;
-        const index = textWrapped.findIndex(id => doc[Id] === id);
-
-        index > -1 ? textWrapped.splice(index, 1) : textWrapped.push(doc[Id]);
-
-        this.textWrappedRows = textWrapped;
-    }
-
-    @computed
-    get reactTable() {
-        const children = this.childDocs;
-        const hasCollectionChild = children.reduce((found, doc) => found || doc.type === DocumentType.COL, false);
-        const expanded: { [name: string]: any } = {};
-        Array.from(this._openCollections.keys()).map(col => expanded[col.toString()] = true);
-        const rerender = [...this.textWrappedRows]; // TODO: get component to rerender on text wrap change without needign to console.log :((((
-
-        return <ReactTable
-            style={{ position: "relative" }}
-            data={children}
-            page={0}
-            pageSize={children.length}
-            showPagination={false}
-            columns={this.tableColumns}
-            getTrProps={this.getTrProps}
-            getTdProps={this.getTdProps}
-            sortable={false}
-            TrComponent={MovableRow}
-            sorted={this.sorted}
-            expanded={expanded}
-            resized={this.resized}
-            onResizedChange={this.props.onResizedChange}
-            SubComponent={!hasCollectionChild ? undefined : row => (row.original.type !== DocumentType.COL) ? (null) :
-                <div className="reactTable-sub"><SchemaTable {...this.props} Document={row.original} dataDoc={undefined} childDocs={undefined} /></div>}
-
-        />;
-    }
-
-    onContextMenu = (e: React.MouseEvent): void => {
-        ContextMenu.Instance.addItem({ description: "Toggle text wrapping", event: this.toggleTextwrap, icon: "table" });
-    }
-
-    getField = (row: number, col?: number) => {
-        const docs = this.childDocs;
-
-        row = row % docs.length;
-        while (row < 0) row += docs.length;
-        const columns = this.props.columns;
-        const doc = docs[row];
-        if (col === undefined) {
-            return doc;
-        }
-        if (col >= 0 && col < columns.length) {
-            const column = this.props.columns[col].heading;
-            return doc[column];
-        }
-        return undefined;
-    }
-
-    createTransformer = (row: number, col: number): Transformer => {
-        const self = this;
-        const captures: { [name: string]: Field } = {};
-
-        const transformer: ts.TransformerFactory<ts.SourceFile> = context => {
-            return root => {
-                function visit(node: ts.Node) {
-                    node = ts.visitEachChild(node, visit, context);
-                    if (ts.isIdentifier(node)) {
-                        const isntPropAccess = !ts.isPropertyAccessExpression(node.parent) || node.parent.expression === node;
-                        const isntPropAssign = !ts.isPropertyAssignment(node.parent) || node.parent.name !== node;
-                        if (isntPropAccess && isntPropAssign) {
-                            if (node.text === "$r") {
-                                return ts.createNumericLiteral(row.toString());
-                            } else if (node.text === "$c") {
-                                return ts.createNumericLiteral(col.toString());
-                            } else if (node.text === "$") {
-                                if (ts.isCallExpression(node.parent)) {
-                                    // captures.doc = self.props.Document;
-                                    // captures.key = self.props.fieldKey;
-                                }
-                            }
-                        }
-                    }
-
-                    return node;
-                }
-                return ts.visitNode(root, visit);
-            };
-        };
-
-        // const getVars = () => {
-        //     return { capturedVariables: captures };
-        // };
-
-        return { transformer, /*getVars*/ };
-    }
-
-    setComputed = (script: string, doc: Doc, field: string, row: number, col: number): boolean => {
-        script =
-            `const $ = (row:number, col?:number) => {
-                const rval = (doc as any)[key][row + ${row}];
-                return col === undefined ? rval : rval[(doc as any)._schemaHeaders[col + ${col}].heading];
-            }
-            return ${script}`;
-        const compiled = CompileScript(script, { params: { this: Doc.name }, capturedVariables: { doc: this.props.Document, key: this.props.fieldKey }, typecheck: false, transformer: this.createTransformer(row, col) });
-        if (compiled.compiled) {
-            doc[field] = new ComputedField(compiled);
-            return true;
-        }
-        return false;
-    }
-
-    @action
-    showDoc = (doc: Doc | undefined, dataDoc?: Doc, screenX?: number, screenY?: number) => {
-        this._showDoc = doc;
-        if (dataDoc && screenX && screenY) {
-            this._showDocPos = this.props.ScreenToLocalTransform().transformPoint(screenX, screenY);
-        }
-    }
-
-    onOpenClick = () => {
-        this._showDoc && this.props.addDocTab(this._showDoc, "add:right");
-    }
-
-    getPreviewTransform = (): Transform => {
-        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - 4 - this.tableWidth, - this.borderWidth);
-    }
-
-    render() {
-        const preview = "";
-        return <div className="collectionSchemaView-table"
-            onPointerDown={this.props.onPointerDown} onClick={this.props.onClick} onWheel={e => this.props.active(true) && e.stopPropagation()}
-            onDrop={e => this.props.onDrop(e, {})} onContextMenu={this.onContextMenu} >
-            {this.reactTable}
-            {this.props.Document._chromeHidden ? undefined : <div className="collectionSchemaView-addRow" onClick={this.createRow}>+ new</div>}
-            {!this._showDoc ? (null) :
-                <div className="collectionSchemaView-documentPreview" ref="overlay"
-                    style={{
-                        position: "absolute", width: 150, height: 150,
-                        background: "dimGray", display: "block", top: 0, left: 0,
-                        transform: `translate(${this._showDocPos[0]}px, ${this._showDocPos[1] - 180}px)`
-                    }} >
-                    <DocumentView
-                        Document={this._showDoc}
-                        DataDoc={this._showDataDoc}
-                        styleProvider={DefaultStyleProvider}
-                        layerProvider={undefined}
-                        docViewPath={returnEmptyDoclist}
-                        freezeDimensions={true}
-                        focus={DocUtils.DefaultFocus}
-                        renderDepth={this.props.renderDepth}
-                        rootSelected={returnFalse}
-                        isContentActive={returnTrue}
-                        isDocumentActive={returnFalse}
-                        PanelWidth={() => 150}
-                        PanelHeight={() => 150}
-                        ScreenToLocalTransform={this.getPreviewTransform}
-                        docFilters={returnEmptyFilter}
-                        docRangeFilters={returnEmptyFilter}
-                        searchFilterDocs={returnEmptyDoclist}
-                        ContainingCollectionDoc={this.props.CollectionView?.props.Document}
-                        ContainingCollectionView={this.props.CollectionView}
-                        moveDocument={this.props.moveDocument}
-                        whenChildContentsActiveChanged={emptyFunction}
-                        addDocTab={this.props.addDocTab}
-                        pinToPres={this.props.pinToPres}
-                        bringToFront={returnFalse}>
-                    </DocumentView>
-                </div>}
-        </div>;
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaCells.tsx b/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
new file mode 100644
index 000000000..f75179cea
--- /dev/null
+++ b/src/client/views/collections/schemaView/CollectionSchemaCells.tsx
@@ -0,0 +1,585 @@
+import React = require("react");
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action, computed, observable } from "mobx";
+import { observer } from "mobx-react";
+import DatePicker from "react-datepicker";
+import "react-datepicker/dist/react-datepicker.css";
+import { CellInfo } from "react-table";
+import "react-table/react-table.css";
+import { DateField } from "../../../../fields/DateField";
+import { Doc, DocListCast, Field, Opt } from "../../../../fields/Doc";
+import { Id } from "../../../../fields/FieldSymbols";
+import { List } from "../../../../fields/List";
+import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { ComputedField } from "../../../../fields/ScriptField";
+import { BoolCast, Cast, DateCast, FieldValue, NumCast, StrCast } from "../../../../fields/Types";
+import { ImageField } from "../../../../fields/URLField";
+import { Utils, emptyFunction } from "../../../../Utils";
+import { Docs } from "../../../documents/Documents";
+import { DocumentType } from "../../../documents/DocumentTypes";
+import { DocumentManager } from "../../../util/DocumentManager";
+import { DragManager } from "../../../util/DragManager";
+import { KeyCodes } from "../../../util/KeyCodes";
+import { CompileScript } from "../../../util/Scripting";
+import { SearchUtil } from "../../../util/SearchUtil";
+import { SnappingManager } from "../../../util/SnappingManager";
+import { undoBatch } from "../../../util/UndoManager";
+import '../../../views/DocumentDecorations.scss';
+import { EditableView } from "../../EditableView";
+import { MAX_ROW_HEIGHT } from '../../globalCssVariables.scss';
+import { DocumentIconContainer } from "../../nodes/DocumentIcon";
+import { OverlayView } from "../../OverlayView";
+import "./CollectionSchemaView.scss";
+import { CollectionView } from "../CollectionView";
+const path = require('path');
+
+// intialize cell properties
+export interface CellProps {
+    row: number;
+    col: number;
+    rowProps: CellInfo;
+    CollectionView: Opt<CollectionView>;
+    ContainingCollection: Opt<CollectionView>;
+    Document: Doc;
+    fieldKey: string;
+    renderDepth: number;
+    addDocTab: (document: Doc, where: string) => boolean;
+    pinToPres: (document: Doc) => void;
+    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined,
+        addDocument: (document: Doc | Doc[]) => boolean) => boolean;
+    isFocused: boolean;
+    changeFocusedCellByIndex: (row: number, col: number) => void;
+    setIsEditing: (isEditing: boolean) => void;
+    isEditable: boolean;
+    setPreviewDoc: (doc: Doc) => void;
+    setComputed: (script: string, doc: Doc, field: string, row: number, col: number) => boolean;
+    getField: (row: number, col?: number) => void;
+    showDoc: (doc: Doc | undefined, dataDoc?: any, screenX?: number, screenY?: number) => void;
+}
+
+@observer
+export class CollectionSchemaCell extends React.Component<CellProps> {
+    public static resolvedFieldKey(column: string, rowDoc: Doc) {
+        const fieldKey = column;
+        if (fieldKey.startsWith("*")) {
+            const rootKey = fieldKey.substring(1);
+            const allKeys = [...Array.from(Object.keys(rowDoc)), ...Array.from(Object.keys(Doc.GetProto(rowDoc)))];
+            const matchedKeys = allKeys.filter(key => key.includes(rootKey));
+            if (matchedKeys.length) return matchedKeys[0];
+        }
+        return fieldKey;
+    }
+    @observable protected _isEditing: boolean = false;
+    protected _focusRef = React.createRef<HTMLDivElement>();
+    protected _rowDoc = this.props.rowProps.original;
+    protected _rowDataDoc = Doc.GetProto(this.props.rowProps.original);
+    protected _dropDisposer?: DragManager.DragDropDisposer;
+    @observable contents: string = "";
+
+    componentDidMount() { document.addEventListener("keydown", this.onKeyDown); }
+    componentWillUnmount() { document.removeEventListener("keydown", this.onKeyDown); }
+
+    @action
+    onKeyDown = (e: KeyboardEvent): void => {
+        if (this.props.isFocused && this.props.isEditable && e.keyCode === KeyCodes.ENTER) {
+            document.removeEventListener("keydown", this.onKeyDown);
+            this._isEditing = true;
+            this.props.setIsEditing(true);
+        }
+    }
+
+    @action
+    isEditingCallback = (isEditing: boolean): void => {
+        document.removeEventListener("keydown", this.onKeyDown);
+        isEditing && document.addEventListener("keydown", this.onKeyDown);
+        this._isEditing = isEditing;
+        this.props.setIsEditing(isEditing);
+        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
+    }
+
+    @action
+    onPointerDown = async (e: React.PointerEvent): Promise<void> => {
+        this.onItemDown(e);
+        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
+        this.props.setPreviewDoc(this.props.rowProps.original);
+
+        let url: string;
+        if (url = StrCast(this.props.rowProps.row.href)) {
+            try {
+                new URL(url);
+                const temp = window.open(url)!;
+                temp.blur();
+                window.focus();
+            } catch { }
+        }
+
+        const doc = Cast(this._rowDoc[this.renderFieldKey], Doc, null);
+        doc && this.props.setPreviewDoc(doc);
+    }
+
+    @undoBatch
+    applyToDoc = (doc: Doc, row: number, col: number, run: (args?: { [name: string]: any }) => any) => {
+        const res = run({ this: doc, $r: row, $c: col, $: (r: number = 0, c: number = 0) => this.props.getField(r + row, c + col) });
+        if (!res.success) return false;
+        doc[this.renderFieldKey] = res.result;
+        return true;
+    }
+
+    private drop = (e: Event, de: DragManager.DropEvent) => {
+        if (de.complete.docDragData) {
+            if (de.complete.docDragData.draggedDocuments.length === 1) {
+                this._rowDataDoc[this.renderFieldKey] = de.complete.docDragData.draggedDocuments[0];
+            }
+            else {
+                const coll = Docs.Create.SchemaDocument([new SchemaHeaderField("title", "#f1efeb")], de.complete.docDragData.draggedDocuments, {});
+                this._rowDataDoc[this.renderFieldKey] = coll;
+            }
+            e.stopPropagation();
+        }
+    }
+
+    protected dropRef = (ele: HTMLElement | null) => {
+        this._dropDisposer?.();
+        ele && (this._dropDisposer = DragManager.MakeDropTarget(ele, this.drop.bind(this)));
+    }
+
+    returnHighlights(contents: string, positions?: number[]) {
+        if (positions) {
+            const results = [];
+            StrCast(this.props.Document._searchString);
+            const length = StrCast(this.props.Document._searchString).length;
+            const color = contents ? "black" : "grey";
+
+            results.push(<span key="-1" style={{ color }}>{contents?.slice(0, positions[0])}</span>);
+            positions.forEach((num, cur) => {
+                results.push(<span key={"start" + cur} style={{ backgroundColor: "#FFFF00", color }}>{contents?.slice(num, num + length)}</span>);
+                let end = 0;
+                cur === positions.length - 1 ? end = contents.length : end = positions[cur + 1];
+                results.push(<span key={"end" + cur} style={{ color }}>{contents?.slice(num + length, end)}</span>);
+            }
+            );
+            return results;
+        }
+        return <span style={{ color: contents ? "black" : "grey" }}>{contents ? contents?.valueOf() : "undefined"}</span>;
+    }
+
+    @computed get renderFieldKey() { return CollectionSchemaCell.resolvedFieldKey(this.props.rowProps.column.id!, this.props.rowProps.original); }
+    onItemDown = async (e: React.PointerEvent) => {
+        if (this.props.Document._searchDoc) {
+            const aliasdoc = await SearchUtil.GetAliasesOfDocument(this._rowDataDoc);
+            const targetContext = aliasdoc.length <= 0 ? undefined : Cast(aliasdoc[0].context, Doc, null);
+            DocumentManager.Instance.jumpToDocument(this._rowDoc, false, emptyFunction, targetContext,
+                undefined, undefined, undefined, () => this.props.setPreviewDoc(this._rowDoc));
+        }
+    }
+    renderCellWithType(type: string | undefined) {
+        const dragRef: React.RefObject<HTMLDivElement> = React.createRef();
+
+        const fieldKey = this.renderFieldKey;
+        const field = this._rowDoc[fieldKey];
+
+        const onPointerEnter = (e: React.PointerEvent): void => {
+            if (e.buttons === 1 && SnappingManager.GetIsDragging() && (type === "document" || type === undefined)) {
+                dragRef.current!.className = "collectionSchemaView-cellContainer doc-drag-over";
+            }
+        };
+        const onPointerLeave = (e: React.PointerEvent): void => {
+            dragRef.current!.className = "collectionSchemaView-cellContainer";
+        };
+
+        let contents = Field.toString(field as Field);
+        contents = contents === "" ? "--" : contents;
+
+        let className = "collectionSchemaView-cellWrapper";
+        if (this._isEditing) className += " editing";
+        if (this.props.isFocused && this.props.isEditable) className += " focused";
+        if (this.props.isFocused && !this.props.isEditable) className += " inactive";
+
+        const positions = [];
+        if (StrCast(this.props.Document._searchString).toLowerCase() !== "") {
+            let term = (field instanceof Promise) ? "...promise pending..." : contents.toLowerCase();
+            const search = StrCast(this.props.Document._searchString).toLowerCase();
+            let start = term.indexOf(search);
+            let tally = 0;
+            if (start !== -1) {
+                positions.push(start);
+            }
+            while (start < contents?.length && start !== -1) {
+                term = term.slice(start + search.length + 1);
+                tally += start + search.length + 1;
+                start = term.indexOf(search);
+                positions.push(tally + start);
+            }
+            if (positions.length > 1) {
+                positions.pop();
+            }
+        }
+        const placeholder = type === "number" ? "0" : contents === "" ? "--" : "undefined";
+        return (
+            <div className="collectionSchemaView-cellContainer" style={{ cursor: field instanceof Doc ? "grab" : "auto" }}
+                ref={dragRef} onPointerDown={this.onPointerDown} onClick={action(e => this._isEditing = true)} onPointerEnter={onPointerEnter} onPointerLeave={onPointerLeave}>
+                <div className={className} ref={this._focusRef} tabIndex={-1}>
+                    <div className="collectionSchemaView-cellContents" ref={type === undefined || type === "document" ? this.dropRef : null}>
+                        {!this.props.Document._searchDoc ?
+                            <EditableView
+                                editing={this._isEditing}
+                                isEditingCallback={this.isEditingCallback}
+                                display={"inline"}
+                                contents={contents}
+                                height={"auto"}
+                                maxHeight={Number(MAX_ROW_HEIGHT)}
+                                placeholder={placeholder}
+                                GetValue={() => {
+                                    const cfield = ComputedField.WithoutComputed(() => FieldValue(field));
+                                    const cscript = cfield instanceof ComputedField ? cfield.script.originalScript : undefined;
+                                    const cfinalScript = cscript?.split("return")[cscript.split("return").length - 1];
+                                    return cscript ? (cfinalScript?.endsWith(";") ? `:=${cfinalScript?.substring(0, cfinalScript.length - 2)}` : cfinalScript) :
+                                        Field.IsField(cfield) ? Field.toScriptString(cfield) : "";
+                                }}
+                                SetValue={action((value: string) => {
+                                    // sets what is displayed after the user makes an input
+                                    let retVal = false;
+                                    if (value.startsWith(":=") || value.startsWith("=:=")) {
+                                        // decides how to compute a value when given either of the above strings
+                                        const script = value.substring(value.startsWith("=:=") ? 3 : 2);
+                                        retVal = this.props.setComputed(script, value.startsWith(":=") ? this._rowDataDoc : this._rowDoc, this.renderFieldKey, this.props.row, this.props.col);
+                                    } else {
+                                        // check if the input is a number
+                                        let inputIsNum = true;
+                                        for (let s of value) {
+                                            if (isNaN(parseInt(s)) && !(s == ".") && !(s == ",")) {
+                                                inputIsNum = false;
+                                            }
+                                        }
+                                        // check if the input is a boolean
+                                        let inputIsBool: boolean = value == "false" || value == "true";
+                                        // what to do in the case 
+                                        if (!inputIsNum && !inputIsBool && !value.startsWith("=")) {
+                                            // if it's not a number, it's a string, and should be processed as such
+                                            // strips the string of quotes when it is edited to prevent quotes form being added to the text automatically 
+                                            // after each edit
+                                            let valueSansQuotes = value;
+                                            if (this._isEditing) {
+                                                const vsqLength = valueSansQuotes.length;
+                                                // get rid of outer quotes
+                                                valueSansQuotes = valueSansQuotes.substring(value.startsWith("\"") ? 1 : 0,
+                                                    valueSansQuotes.charAt(vsqLength - 1) == "\"" ? vsqLength - 1 : vsqLength);
+                                            }
+                                            let inputAsString = '"';
+                                            // escape any quotes in the string
+                                            for (const i of valueSansQuotes) {
+                                                if (i == '"') {
+                                                    inputAsString += '\\"';
+                                                } else {
+                                                    inputAsString += i;
+                                                }
+                                            }
+                                            // add a closing quote
+                                            inputAsString += '"';
+                                            //two options here: we can strip off outer quotes or we can figure out what's going on with the script
+                                            const script = CompileScript(inputAsString, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                            const changeMade = inputAsString.length !== value.length || inputAsString.length - 2 !== value.length
+                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            // handle numbers and expressions
+                                        } else if (inputIsNum || value.startsWith("=")) {
+                                            //TODO: make accept numbers
+                                            const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
+                                            // if commas are not stripped, the parser only considers the numbers after the last comma
+                                            let inputSansCommas = "";
+                                            for (let s of inputscript) {
+                                                if (!(s == ",")) {
+                                                    inputSansCommas += s;
+                                                }
+                                            }
+                                            const script = CompileScript(inputSansCommas, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
+                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                            // handle booleans
+                                        } else if (inputIsBool) {
+                                            const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
+                                            script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
+                                        }
+                                    }
+                                    if (retVal) {
+                                        this._isEditing = false; // need to set this here. otherwise, the assignment of the field will invalidate & cause render() to be called with the wrong value for 'editing'
+                                        this.props.setIsEditing(false);
+                                    }
+                                    return retVal;
+                                })}
+                                OnFillDown={async (value: string) => {
+                                    const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
+                                    script.compiled && DocListCast(this.props.Document[this.props.fieldKey]).
+                                        forEach((doc, i) => value.startsWith(":=") ?
+                                            this.props.setComputed(value.substring(2), Doc.GetProto(doc), this.renderFieldKey, i, this.props.col) :
+                                            this.applyToDoc(Doc.GetProto(doc), i, this.props.col, script.run));
+                                }}
+                            />
+                            :
+                            this.returnHighlights(contents, positions)
+                        }
+                    </div >
+                </div>
+            </div>
+        );
+    }
+
+    render() { return this.renderCellWithType(undefined); }
+}
+
+@observer
+export class CollectionSchemaNumberCell extends CollectionSchemaCell { render() { return this.renderCellWithType("number"); } }
+
+@observer
+export class CollectionSchemaBooleanCell extends CollectionSchemaCell { render() { return this.renderCellWithType("boolean"); } }
+
+@observer
+export class CollectionSchemaStringCell extends CollectionSchemaCell { render() { return this.renderCellWithType("string"); } }
+
+@observer
+export class CollectionSchemaDateCell extends CollectionSchemaCell {
+    @computed get _date(): Opt<DateField> { return this._rowDoc[this.renderFieldKey] instanceof DateField ? DateCast(this._rowDoc[this.renderFieldKey]) : undefined; }
+
+    @action
+    handleChange = (date: any) => {
+        // const script = CompileScript(date.toString(), { requiredType: "Date", addReturn: true, params: { this: Doc.name } });
+        // if (script.compiled) {
+        //     this.applyToDoc(this._document, this.props.row, this.props.col, script.run);
+        // } else {
+        // ^ DateCast is always undefined for some reason, but that is what the field should be set to
+        this._rowDoc[this.renderFieldKey] = new DateField(date as Date);
+        //}
+    }
+
+    render() {
+        return !this.props.isFocused ? <span onPointerDown={this.onPointerDown}>{this._date ? Field.toString(this._date as Field) : "--"}</span> :
+            <DatePicker
+                selected={this._date?.date || new Date}
+                onSelect={date => this.handleChange(date)}
+                onChange={date => this.handleChange(date)}
+            />;
+    }
+}
+
+@observer
+export class CollectionSchemaDocCell extends CollectionSchemaCell {
+
+    _overlayDisposer?: () => void;
+
+    @computed get _doc() { return FieldValue(Cast(this._rowDoc[this.renderFieldKey], Doc)); }
+
+    @action
+    onSetValue = (value: string) => {
+        this._doc && (Doc.GetProto(this._doc).title = value);
+
+        const script = CompileScript(value, {
+            addReturn: true,
+            typecheck: true,
+            transformer: DocumentIconContainer.getTransformer()
+        });
+
+        const results = script.compiled && script.run();
+        if (results && results.success) {
+            this._rowDoc[this.renderFieldKey] = results.result;
+            return true;
+        }
+        return false;
+    }
+
+    componentWillUnmount() { this.onBlur(); }
+
+    onBlur = () => { this._overlayDisposer?.(); };
+    onFocus = () => {
+        this.onBlur();
+        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
+    }
+
+    @action
+    isEditingCallback = (isEditing: boolean): void => {
+        document.removeEventListener("keydown", this.onKeyDown);
+        isEditing && document.addEventListener("keydown", this.onKeyDown);
+        this._isEditing = isEditing;
+        this.props.setIsEditing(isEditing);
+        this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
+    }
+
+    render() {
+        return !this._doc ? this.renderCellWithType("document") :
+            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1}
+                onPointerDown={this.onPointerDown}
+            >
+                <div className="collectionSchemaView-cellContents-document"
+                    style={{ padding: "5.9px" }}
+                    ref={this.dropRef}
+                    onFocus={this.onFocus}
+                    onBlur={this.onBlur}
+                >
+                    <EditableView
+                        editing={this._isEditing}
+                        isEditingCallback={this.isEditingCallback}
+                        display={"inline"}
+                        contents={this._doc.title || "--"}
+                        height={"auto"}
+                        maxHeight={Number(MAX_ROW_HEIGHT)}
+                        GetValue={() => StrCast(this._doc?.title)}
+                        SetValue={action((value: string) => {
+                            this.onSetValue(value);
+                            return true;
+                        })}
+                    />
+                </div >
+                <div onClick={() => this._doc && this.props.addDocTab(this._doc, "add:right")} className="collectionSchemaView-cellContents-docButton">
+                    <FontAwesomeIcon icon="external-link-alt" size="lg" />
+                </div>
+            </div>;
+    }
+}
+
+@observer
+export class CollectionSchemaImageCell extends CollectionSchemaCell {
+
+    choosePath(url: URL) {
+        if (url.protocol === "data") return url.href;
+        if (url.href.indexOf(window.location.origin) === -1) return Utils.CorsProxy(url.href);
+        if (!/\.(png|jpg|jpeg|gif|webp)$/.test(url.href.toLowerCase())) return url.href;//Why is this here
+
+        const ext = path.extname(url.href);
+        return url.href.replace(ext, "_o" + path.extname(url.href));
+    }
+
+    render() {
+        const field = Cast(this._rowDoc[this.renderFieldKey], ImageField, null); // retrieve the primary image URL that is being rendered from the data doc
+        const alts = DocListCast(this._rowDoc[this.renderFieldKey + "-alternates"]); // retrieve alternate documents that may be rendered as alternate images
+        const altpaths = alts.map(doc => Cast(doc[Doc.LayoutFieldKey(doc)], ImageField, null)?.url).filter(url => url).map(url => this.choosePath(url)); // access the primary layout data of the alternate documents
+        const paths = field ? [this.choosePath(field.url), ...altpaths] : altpaths;
+        const url = paths.length ? paths : [Utils.CorsProxy("http://www.cs.brown.edu/~bcz/noImage.png")];
+
+        const aspect = Doc.NativeAspect(this._rowDoc);
+        let width = Math.min(75, this.props.rowProps.width);
+        const height = Math.min(75, width / aspect);
+        width = height * aspect;
+
+        const reference = React.createRef<HTMLDivElement>();
+        return <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
+            <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
+                <img src={url[0]}
+                    width={paths.length ? width : "20px"}
+                    height={paths.length ? height : "20px"} />
+            </div >
+        </div>;
+    }
+}
+
+
+@observer
+export class CollectionSchemaListCell extends CollectionSchemaCell {
+    _overlayDisposer?: () => void;
+
+    @computed get _field() { return this._rowDoc[this.renderFieldKey]; }
+    @computed get _optionsList() { return this._field as List<any>; }
+    @observable private _opened = false;
+    @observable private _text = "select an item";
+    @observable private _selectedNum = 0;
+
+    @action
+    onSetValue = (value: string) => {
+        // change if its a document
+        this._optionsList[this._selectedNum] = this._text = value;
+
+        (this._field as List<any>).splice(this._selectedNum, 1, value);
+    }
+
+    @action
+    onSelected = (element: string, index: number) => {
+        this._text = element;
+        this._selectedNum = index;
+    }
+
+    onFocus = () => {
+        this._overlayDisposer?.();
+        this._overlayDisposer = OverlayView.Instance.addElement(<DocumentIconContainer />, { x: 0, y: 0 });
+    }
+
+    render() {
+        const link = false;
+        const reference = React.createRef<HTMLDivElement>();
+
+        if (this._optionsList?.length) {
+            const options = !this._opened ? (null) :
+                <div>
+                    {this._optionsList.map((element, index) => {
+                        const val = Field.toString(element);
+                        return <div className="collectionSchemaView-dropdownOption" key={index} style={{ padding: "6px" }} onPointerDown={(e) => this.onSelected(StrCast(element), index)} >
+                            {val}
+                        </div>;
+                    })}
+                </div>;
+
+            const plainText = <div style={{ padding: "5.9px" }}>{this._text}</div>;
+            const textarea = <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} style={{ padding: "5.9px" }} ref={this.dropRef} >
+                <EditableView
+                    editing={this._isEditing}
+                    isEditingCallback={this.isEditingCallback}
+                    display={"inline"}
+                    contents={this._text}
+                    height={"auto"}
+                    maxHeight={Number(MAX_ROW_HEIGHT)}
+                    GetValue={() => this._text}
+                    SetValue={action((value: string) => {
+                        // add special for params 
+                        this.onSetValue(value);
+                        return true;
+                    })}
+                />
+            </div >;
+
+            //☰
+            return (
+                <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
+                    <div className="collectionSchemaView-cellContents" key={this._rowDoc[Id]} ref={reference}>
+                        <div className="collectionSchemaView-dropDownWrapper">
+                            <button type="button" className="collectionSchemaView-dropdownButton" style={{ right: "length", position: "relative" }}
+                                onClick={action(e => this._opened = !this._opened)} >
+                                <FontAwesomeIcon icon={this._opened ? "caret-up" : "caret-down"} size="sm" />
+                            </button>
+                            <div className="collectionSchemaView-dropdownText"> {link ? plainText : textarea} </div>
+                        </div>
+                        {options}
+                    </div >
+                </div>
+            );
+        }
+        return this.renderCellWithType("list");
+    }
+}
+
+
+@observer
+export class CollectionSchemaCheckboxCell extends CollectionSchemaCell {
+    @computed get _isChecked() { return BoolCast(this._rowDoc[this.renderFieldKey]); }
+
+    render() {
+        const reference = React.createRef<HTMLDivElement>();
+        return (
+            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
+                <input type="checkbox" checked={this._isChecked} onChange={e => this._rowDoc[this.renderFieldKey] = e.target.checked} />
+            </div>
+        );
+    }
+}
+
+
+@observer
+export class CollectionSchemaButtons extends CollectionSchemaCell {
+    render() {
+        return !this.props.Document._searchDoc || ![DocumentType.PDF, DocumentType.RTF].includes(StrCast(this._rowDoc.type) as DocumentType) ? <></> :
+            <div style={{ paddingTop: 8, paddingLeft: 3 }} >
+                <button style={{ padding: 2, left: 77 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, true)}>
+                    <FontAwesomeIcon icon="arrow-up" size="sm" />
+                </button>
+                <button style={{ padding: 2 }} onClick={() => Doc.SearchMatchNext(this._rowDoc, false)} >
+                    <FontAwesomeIcon icon="arrow-down" size="sm" />
+                </button>
+            </div>;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx b/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
new file mode 100644
index 000000000..b2115b22e
--- /dev/null
+++ b/src/client/views/collections/schemaView/CollectionSchemaHeaders.tsx
@@ -0,0 +1,518 @@
+import React = require("react");
+import { IconProp, library } from "@fortawesome/fontawesome-svg-core";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action, computed, observable, runInAction } from "mobx";
+import { observer } from "mobx-react";
+import { Doc, DocListCast, Opt } from "../../../../fields/Doc";
+import { listSpec } from "../../../../fields/Schema";
+import { PastelSchemaPalette, SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { ScriptField } from "../../../../fields/ScriptField";
+import { Cast, StrCast } from "../../../../fields/Types";
+import { undoBatch } from "../../../util/UndoManager";
+import { SearchBox } from "../../search/SearchBox";
+import { ColumnType } from "./CollectionSchemaView";
+import "./CollectionSchemaView.scss";
+import { CollectionView } from "../CollectionView";
+
+const higflyout = require("@hig/flyout");
+export const { anchorPoints } = higflyout;
+export const Flyout = higflyout.default;
+
+
+export interface AddColumnHeaderProps {
+    createColumn: () => void;
+}
+
+@observer
+export class CollectionSchemaAddColumnHeader extends React.Component<AddColumnHeaderProps> {
+    render() {
+        return (
+            <button className="add-column" onClick={() => this.props.createColumn()}><FontAwesomeIcon icon="plus" size="sm" /></button>
+        );
+    }
+}
+
+
+export interface ColumnMenuProps {
+    columnField: SchemaHeaderField;
+    // keyValue: string;
+    possibleKeys: string[];
+    existingKeys: string[];
+    // keyType: ColumnType;
+    typeConst: boolean;
+    menuButtonContent: JSX.Element;
+    addNew: boolean;
+    onSelect: (oldKey: string, newKey: string, addnew: boolean) => void;
+    setIsEditing: (isEditing: boolean) => void;
+    deleteColumn: (column: string) => void;
+    onlyShowOptions: boolean;
+    setColumnType: (column: SchemaHeaderField, type: ColumnType) => void;
+    setColumnSort: (column: SchemaHeaderField, desc: boolean | undefined) => void;
+    anchorPoint?: any;
+    setColumnColor: (column: SchemaHeaderField, color: string) => void;
+}
+@observer
+export class CollectionSchemaColumnMenu extends React.Component<ColumnMenuProps> {
+    @observable private _isOpen: boolean = false;
+    @observable private _node: HTMLDivElement | null = null;
+
+    componentDidMount() { document.addEventListener("pointerdown", this.detectClick); }
+
+    componentWillUnmount() { document.removeEventListener("pointerdown", this.detectClick); }
+
+    @action
+    detectClick = (e: PointerEvent) => {
+        !this._node?.contains(e.target as Node) && this.props.setIsEditing(this._isOpen = false);
+    }
+
+    @action
+    toggleIsOpen = (): void => {
+        this.props.setIsEditing(this._isOpen = !this._isOpen);
+    }
+
+    changeColumnType = (type: ColumnType) => {
+        this.props.setColumnType(this.props.columnField, type);
+    }
+
+    changeColumnSort = (desc: boolean | undefined) => {
+        this.props.setColumnSort(this.props.columnField, desc);
+    }
+
+    changeColumnColor = (color: string) => {
+        this.props.setColumnColor(this.props.columnField, color);
+    }
+
+    @action
+    setNode = (node: HTMLDivElement): void => {
+        if (node) {
+            this._node = node;
+        }
+    }
+
+    renderTypes = () => {
+        if (this.props.typeConst) return (null);
+
+        const type = this.props.columnField.type;
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Column type:</label>
+                <div className="columnMenu-types">
+                    <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Any)}>
+                        <FontAwesomeIcon icon={"align-justify"} size="sm" />
+                        Any
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Number)}>
+                        <FontAwesomeIcon icon={"hashtag"} size="sm" />
+                        Number
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.String)}>
+                        <FontAwesomeIcon icon={"font"} size="sm" />
+                        Text
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Boolean)}>
+                        <FontAwesomeIcon icon={"check-square"} size="sm" />
+                        Checkbox
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.List)}>
+                        <FontAwesomeIcon icon={"list-ul"} size="sm" />
+                        List
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Doc)}>
+                        <FontAwesomeIcon icon={"file"} size="sm" />
+                        Document
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Image)}>
+                        <FontAwesomeIcon icon={"image"} size="sm" />
+                        Image
+                    </div>
+                    <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.changeColumnType(ColumnType.Date)}>
+                        <FontAwesomeIcon icon={"calendar"} size="sm" />
+                        Date
+                    </div>
+                </div>
+            </div >
+        );
+    }
+
+    renderSorting = () => {
+        const sort = this.props.columnField.desc;
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Sort by:</label>
+                <div className="columnMenu-sort">
+                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.changeColumnSort(true)}>
+                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
+                        Sort descending
+                    </div>
+                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.changeColumnSort(false)}>
+                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
+                        Sort ascending
+                    </div>
+                    <div className="columnMenu-option" onClick={() => this.changeColumnSort(undefined)}>
+                        <FontAwesomeIcon icon="times" size="sm" />
+                        Clear sorting
+                    </div>
+                </div>
+            </div>
+        );
+    }
+
+    renderColors = () => {
+        const selected = this.props.columnField.color;
+
+        const pink = PastelSchemaPalette.get("pink2");
+        const purple = PastelSchemaPalette.get("purple2");
+        const blue = PastelSchemaPalette.get("bluegreen1");
+        const yellow = PastelSchemaPalette.get("yellow4");
+        const red = PastelSchemaPalette.get("red2");
+        const gray = "#f1efeb";
+
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Color:</label>
+                <div className="columnMenu-colors">
+                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.changeColumnColor(pink!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.changeColumnColor(purple!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.changeColumnColor(blue!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.changeColumnColor(yellow!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.changeColumnColor(red!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.changeColumnColor(gray)}></div>
+                </div>
+            </div>
+        );
+    }
+
+    renderContent = () => {
+        return (
+            <div className="collectionSchema-header-menuOptions">
+                {this.props.onlyShowOptions ? <></> :
+                    <>
+                        {this.renderTypes()}
+                        {this.renderSorting()}
+                        {this.renderColors()}
+                        <div className="collectionSchema-headerMenu-group">
+                            <button onClick={() => this.props.deleteColumn(this.props.columnField.heading)}>Delete Column</button>
+                        </div>
+                    </>
+                }
+            </div>
+        );
+    }
+
+    render() {
+        return (
+            <div className="collectionSchema-header-menu" ref={this.setNode}>
+                <Flyout anchorPoint={this.props.anchorPoint ? this.props.anchorPoint : anchorPoints.TOP_CENTER} content={this.renderContent()}>
+                    <div className="collectionSchema-header-toggler" onClick={() => this.toggleIsOpen()}>{this.props.menuButtonContent}</div>
+                </ Flyout >
+            </div>
+        );
+    }
+}
+
+
+export interface KeysDropdownProps {
+    keyValue: string;
+    possibleKeys: string[];
+    existingKeys: string[];
+    canAddNew: boolean;
+    addNew: boolean;
+    onSelect: (oldKey: string, newKey: string, addnew: boolean, filter?: string) => void;
+    setIsEditing: (isEditing: boolean) => void;
+    width?: string;
+    docs?: Doc[];
+    Document: Doc;
+    dataDoc: Doc | undefined;
+    fieldKey: string;
+    ContainingCollectionDoc: Doc | undefined;
+    ContainingCollectionView: Opt<CollectionView>;
+    active?: (outsideReaction?: boolean) => boolean;
+    openHeader: (column: any, screenx: number, screeny: number) => void;
+    col: SchemaHeaderField;
+    icon: IconProp;
+}
+@observer
+export class KeysDropdown extends React.Component<KeysDropdownProps> {
+    @observable private _key: string = this.props.keyValue;
+    @observable private _searchTerm: string = this.props.keyValue;
+    @observable private _isOpen: boolean = false;
+    @observable private _node: HTMLDivElement | null = null;
+    @observable private _inputRef: React.RefObject<HTMLInputElement> = React.createRef();
+
+    @action setSearchTerm = (value: string): void => { this._searchTerm = value; };
+    @action setKey = (key: string): void => { this._key = key; };
+    @action setIsOpen = (isOpen: boolean): void => { this._isOpen = isOpen; };
+
+    @action
+    onSelect = (key: string): void => {
+        this.props.onSelect(this._key, key, this.props.addNew);
+        this.setKey(key);
+        this._isOpen = false;
+        this.props.setIsEditing(false);
+    }
+
+    @action
+    setNode = (node: HTMLDivElement): void => {
+        if (node) {
+            this._node = node;
+        }
+    }
+
+    componentDidMount() {
+        document.addEventListener("pointerdown", this.detectClick);
+        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
+        if (filters?.some(filter => filter.split(":")[0] === this._key)) {
+            runInAction(() => this.closeResultsVisibility = "contents");
+        }
+    }
+
+    @action
+    detectClick = (e: PointerEvent): void => {
+        if (this._node && this._node.contains(e.target as Node)) {
+        } else {
+            this._isOpen = false;
+            this.props.setIsEditing(false);
+        }
+    }
+
+    private tempfilter: string = "";
+    @undoBatch
+    onKeyDown = (e: React.KeyboardEvent): void => {
+        if (e.key === "Enter") {
+            if (this._searchTerm.includes(":")) {
+                const colpos = this._searchTerm.indexOf(":");
+                const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
+                if (temp === "") {
+                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
+                    this.updateFilter();
+                }
+                else {
+                    Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
+                    this.tempfilter = temp;
+                    Doc.setDocFilter(this.props.Document, this._key, temp, "check");
+                    this.props.col.setColor("green");
+                    this.closeResultsVisibility = "contents";
+                }
+            }
+            else {
+                Doc.setDocFilter(this.props.Document, this._key, this.tempfilter, "remove");
+                this.updateFilter();
+                if (this.showKeys.length) {
+                    this.onSelect(this.showKeys[0]);
+                } else if (this._searchTerm !== "" && this.props.canAddNew) {
+                    this.setSearchTerm(this._searchTerm || this._key);
+                    this.onSelect(this._searchTerm);
+                }
+            }
+        }
+    }
+
+    onChange = (val: string): void => {
+        this.setSearchTerm(val);
+    }
+
+    @action
+    onFocus = (e: React.FocusEvent): void => {
+        this._isOpen = true;
+        this.props.setIsEditing(true);
+    }
+
+    @computed get showKeys() {
+        const whitelistKeys = ["context", "author", "*lastModified", "text", "data", "tags", "creationDate"];
+        const keyOptions = this._searchTerm === "" ? this.props.possibleKeys : this.props.possibleKeys.filter(key => key.toUpperCase().indexOf(this._searchTerm.toUpperCase()) > -1);
+        const showKeys = new Set<string>();
+        [...keyOptions, ...whitelistKeys].forEach(key => (!Doc.UserDoc().noviceMode ||
+            whitelistKeys.includes(key)
+            || ((!key.startsWith("_") && key[0] === key[0].toUpperCase()) || key[0] === "#")) ? showKeys.add(key) : null);
+        return Array.from(showKeys.keys()).filter(key => !this._searchTerm || key.includes(this._searchTerm));
+    }
+    @action
+    renderOptions = (): JSX.Element[] | JSX.Element => {
+        if (!this._isOpen) {
+            this.defaultMenuHeight = 0;
+            return <></>;
+        }
+        const options = this.showKeys.map(key => {
+            return <div key={key} className="key-option" style={{
+                border: "1px solid lightgray",
+                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
+            }}
+                onPointerDown={e => {
+                    e.stopPropagation();
+                }}
+                onClick={() => {
+                    this.onSelect(key);
+                    this.setSearchTerm("");
+                }}>{key}</div>;
+        });
+
+        // if search term does not already exist as a group type, give option to create new group type
+
+        if (this._key !== this._searchTerm.slice(0, this._key.length)) {
+            if (this._searchTerm !== "" && this.props.canAddNew) {
+                options.push(<div key={""} className="key-option" style={{
+                    border: "1px solid lightgray", width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white",
+                }}
+                    onClick={() => { this.onSelect(this._searchTerm); this.setSearchTerm(""); }}>
+                    Create "{this._searchTerm}" key</div>);
+            }
+        }
+
+        if (options.length === 0) {
+            this.defaultMenuHeight = 0;
+        }
+        else {
+            if (this.props.docs) {
+                const panesize = this.props.docs.length * 30;
+                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+            else {
+                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+        }
+        return options;
+    }
+
+    docSafe: Doc[] = [];
+
+    @action
+    renderFilterOptions = (): JSX.Element[] | JSX.Element => {
+        if (!this._isOpen || !this.props.dataDoc) {
+            this.defaultMenuHeight = 0;
+            return <></>;
+        }
+        const keyOptions: string[] = [];
+        const colpos = this._searchTerm.indexOf(":");
+        const temp = this._searchTerm.slice(colpos + 1, this._searchTerm.length);
+        if (this.docSafe.length === 0) {
+            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
+        }
+        const docs = this.docSafe;
+        docs.forEach((doc) => {
+            const key = StrCast(doc[this._key]);
+            if (keyOptions.includes(key) === false && key.includes(temp) && key !== "") {
+                keyOptions.push(key);
+            }
+        });
+
+        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
+        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
+            this.props.col.setColor("rgb(241, 239, 235)");
+            this.closeResultsVisibility = "none";
+        }
+        for (let i = 0; i < (filters?.length ?? 0) - 1; i++) {
+            if (filters![i] === this.props.col.heading && keyOptions.includes(filters![i].split(":")[1]) === false) {
+                keyOptions.push(filters![i + 1]);
+            }
+        }
+        const options = keyOptions.map(key => {
+            let bool = false;
+            if (filters !== undefined) {
+                const ind = filters.findIndex(filter => filter.split(":")[0] === key);
+                const fields = ind === -1 ? undefined : filters[ind].split(":");
+                bool = fields ? fields[1] === "check" : false;
+            }
+            return <div key={key} className="key-option" style={{
+                border: "1px solid lightgray", paddingLeft: 5, textAlign: "left",
+                width: this.props.width, maxWidth: this.props.width, overflowX: "hidden", background: "white", backgroundColor: "white",
+            }}
+            >
+                <input type="checkbox"
+                    onPointerDown={e => e.stopPropagation()}
+                    onClick={e => e.stopPropagation()}
+                    onChange={(e) => {
+                        e.target.checked === true ? Doc.setDocFilter(this.props.Document, this._key, key, "check") : Doc.setDocFilter(this.props.Document, this._key, key, "remove");
+                        e.target.checked === true ? this.closeResultsVisibility = "contents" : console.log("");
+                        e.target.checked === true ? this.props.col.setColor("green") : this.updateFilter();
+                        e.target.checked === true && SearchBox.Instance.filter === true ? Doc.setDocFilter(docs[0], this._key, key, "check") : Doc.setDocFilter(docs[0], this._key, key, "remove");
+                    }}
+                    checked={bool}
+                />
+                <span style={{ paddingLeft: 4 }}>
+                    {key}
+                </span>
+
+            </div>;
+        });
+        if (options.length === 0) {
+            this.defaultMenuHeight = 0;
+        }
+        else {
+            if (this.props.docs) {
+                const panesize = this.props.docs.length * 30;
+                options.length * 20 + 8 - 10 > panesize ? this.defaultMenuHeight = panesize : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+            else {
+                options.length > 5 ? this.defaultMenuHeight = 108 : this.defaultMenuHeight = options.length * 20 + 8;
+            }
+
+        }
+        return options;
+    }
+
+    @observable defaultMenuHeight = 0;
+
+
+    updateFilter() {
+        const filters = Cast(this.props.Document._docFilters, listSpec("string"));
+        if (filters === undefined || filters.length === 0 || filters.some(filter => filter.split(":")[0] === this._key) === false) {
+            this.props.col.setColor("rgb(241, 239, 235)");
+            this.closeResultsVisibility = "none";
+        }
+    }
+
+    @computed get scriptField() {
+        const scriptText = "setDocFilter(containingTreeView, heading, this.title, checked)";
+        const script = ScriptField.MakeScript(scriptText, { this: Doc.name, heading: "string", checked: "string", containingTreeView: Doc.name });
+        return script ? () => script : undefined;
+    }
+    filterBackground = () => "rgba(105, 105, 105, 0.432)";
+    @observable filterOpen: boolean | undefined = undefined;
+    closeResultsVisibility: string = "none";
+
+    removeFilters = (e: React.PointerEvent): void => {
+        const keyOptions: string[] = [];
+        if (this.docSafe.length === 0 && this.props.dataDoc) {
+            this.docSafe = DocListCast(this.props.dataDoc[this.props.fieldKey]);
+        }
+        const docs = this.docSafe;
+        docs.forEach((doc) => {
+            const key = StrCast(doc[this._key]);
+            if (keyOptions.includes(key) === false) {
+                keyOptions.push(key);
+            }
+        });
+
+        Doc.setDocFilter(this.props.Document, this._key, "", "remove");
+        this.props.col.setColor("rgb(241, 239, 235)");
+        this.closeResultsVisibility = "none";
+    }
+    render() {
+        return (
+            <div style={{ display: "flex" }} ref={this.setNode}>
+                <FontAwesomeIcon onClick={e => { this.props.openHeader(this.props.col, e.clientX, e.clientY); e.stopPropagation(); }} icon={this.props.icon} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} />
+
+                {/* <FontAwesomeIcon icon={fa.faSearchMinus} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop: "4px", cursor: "hand" }} onClick={e => {
+                    runInAction(() => { this._isOpen === undefined ? this._isOpen = true : this._isOpen = !this._isOpen })
+                }} /> */}
+
+                <div className="keys-dropdown" style={{ zIndex: 1, width: this.props.width, maxWidth: this.props.width }}>
+                    <input className="keys-search" style={{ width: "100%" }}
+                        ref={this._inputRef} type="text" value={this._searchTerm} placeholder="Column key" onKeyDown={this.onKeyDown}
+                        onChange={e => this.onChange(e.target.value)}
+                        onClick={(e) => { e.stopPropagation(); this._inputRef.current?.focus(); }}
+                        onFocus={this.onFocus} ></input>
+                    <div style={{ display: this.closeResultsVisibility }}>
+                        <FontAwesomeIcon onPointerDown={this.removeFilters} icon={"times-circle"} size="lg"
+                            style={{ cursor: "hand", color: "grey", padding: 2, left: -20, top: -1, height: 15, position: "relative" }} />
+                    </div>
+                    {!this._isOpen ? (null) : <div className="keys-options-wrapper" style={{
+                        width: this.props.width, maxWidth: this.props.width, height: "auto",
+                    }}>
+                        {this._searchTerm.includes(":") ? this.renderFilterOptions() : this.renderOptions()}
+                    </div>}
+                </div >
+            </div>
+        );
+    }
+}
diff --git a/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx b/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
new file mode 100644
index 000000000..456c38c68
--- /dev/null
+++ b/src/client/views/collections/schemaView/CollectionSchemaMovableColumn.tsx
@@ -0,0 +1,128 @@
+import React = require("react");
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action } from "mobx";
+import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
+import { Doc } from "../../../../fields/Doc";
+import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { Cast, FieldValue, StrCast } from "../../../../fields/Types";
+import { DocumentManager } from "../../../util/DocumentManager";
+import { DragManager, dropActionType, SetupDrag } from "../../../util/DragManager";
+import { SnappingManager } from "../../../util/SnappingManager";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { ContextMenu } from "../../ContextMenu";
+import "./CollectionSchemaView.scss";
+
+export interface MovableColumnProps {
+    columnRenderer: TableCellRenderer;
+    columnValue: SchemaHeaderField;
+    allColumns: SchemaHeaderField[];
+    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columns: SchemaHeaderField[]) => void;
+    ScreenToLocalTransform: () => Transform;
+}
+export class MovableColumn extends React.Component<MovableColumnProps> {
+    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
+    private _colDropDisposer?: DragManager.DragDropDisposer;
+    private _startDragPosition: { x: number, y: number } = { x: 0, y: 0 };
+    private _sensitivity: number = 16;
+    private _dragRef: React.RefObject<HTMLDivElement> = React.createRef();
+
+    onPointerEnter = (e: React.PointerEvent): void => {
+        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
+            this._header!.current!.className = "collectionSchema-col-wrapper";
+            document.addEventListener("pointermove", this.onDragMove, true);
+        }
+    }
+    onPointerLeave = (e: React.PointerEvent): void => {
+        this._header!.current!.className = "collectionSchema-col-wrapper";
+        document.removeEventListener("pointermove", this.onDragMove, true);
+        !e.buttons && document.removeEventListener("pointermove", this.onPointerMove);
+    }
+    onDragMove = (e: PointerEvent): void => {
+        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
+        const before = x[0] < bounds[0];
+        this._header!.current!.className = "collectionSchema-col-wrapper";
+        if (before) this._header!.current!.className += " col-before";
+        if (!before) this._header!.current!.className += " col-after";
+        e.stopPropagation();
+    }
+
+    createColDropTarget = (ele: HTMLDivElement) => {
+        this._colDropDisposer?.();
+        if (ele) {
+            this._colDropDisposer = DragManager.MakeDropTarget(ele, this.colDrop.bind(this));
+        }
+    }
+
+    colDrop = (e: Event, de: DragManager.DropEvent) => {
+        document.removeEventListener("pointermove", this.onDragMove, true);
+        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left + ((rect.right - rect.left) / 2), rect.top);
+        const before = x[0] < bounds[0];
+        const colDragData = de.complete.columnDragData;
+        if (colDragData) {
+            e.stopPropagation();
+            this.props.reorderColumns(colDragData.colKey, this.props.columnValue, before, this.props.allColumns);
+            return true;
+        }
+        return false;
+    }
+
+    onPointerMove = (e: PointerEvent) => {
+        const onRowMove = (e: PointerEvent) => {
+            e.stopPropagation();
+            e.preventDefault();
+
+            document.removeEventListener("pointermove", onRowMove);
+            document.removeEventListener('pointerup', onRowUp);
+            const dragData = new DragManager.ColumnDragData(this.props.columnValue);
+            DragManager.StartColumnDrag(this._dragRef.current!, dragData, e.x, e.y);
+        };
+        const onRowUp = (): void => {
+            document.removeEventListener("pointermove", onRowMove);
+            document.removeEventListener('pointerup', onRowUp);
+        };
+        if (e.buttons === 1) {
+            const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX - this._startDragPosition.x, e.clientY - this._startDragPosition.y);
+            if (Math.abs(dx) + Math.abs(dy) > this._sensitivity) {
+                document.removeEventListener("pointermove", this.onPointerMove);
+                e.stopPropagation();
+
+                document.addEventListener("pointermove", onRowMove);
+                document.addEventListener("pointerup", onRowUp);
+            }
+        }
+    }
+
+    onPointerUp = (e: React.PointerEvent) => {
+        document.removeEventListener("pointermove", this.onPointerMove);
+    }
+
+    @action
+    onPointerDown = (e: React.PointerEvent, ref: React.RefObject<HTMLDivElement>) => {
+        this._dragRef = ref;
+        const [dx, dy] = this.props.ScreenToLocalTransform().transformDirection(e.clientX, e.clientY);
+        if (!(e.target as any)?.tagName.includes("INPUT")) {
+            this._startDragPosition = { x: dx, y: dy };
+            document.addEventListener("pointermove", this.onPointerMove);
+        }
+    }
+
+
+    render() {
+        const reference = React.createRef<HTMLDivElement>();
+
+        return (
+            <div className="collectionSchema-col" ref={this.createColDropTarget}>
+                <div className="collectionSchema-col-wrapper" ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
+                    <div className="col-dragger" ref={reference} onPointerDown={e => this.onPointerDown(e, reference)} onPointerUp={this.onPointerUp}>
+                        {this.props.columnRenderer}
+                    </div>
+                </div>
+            </div>
+        );
+    }
+}
diff --git a/src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx b/src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx
new file mode 100644
index 000000000..f48906ba5
--- /dev/null
+++ b/src/client/views/collections/schemaView/CollectionSchemaMovableRow.tsx
@@ -0,0 +1,147 @@
+import React = require("react");
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { action } from "mobx";
+import { ReactTableDefaults, RowInfo, TableCellRenderer } from "react-table";
+import { Doc } from "../../../../fields/Doc";
+import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { Cast, FieldValue, StrCast } from "../../../../fields/Types";
+import { DocumentManager } from "../../../util/DocumentManager";
+import { DragManager, dropActionType, SetupDrag } from "../../../util/DragManager";
+import { SnappingManager } from "../../../util/SnappingManager";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { ContextMenu } from "../../ContextMenu";
+import "./CollectionSchemaView.scss";
+
+export interface MovableRowProps {
+    rowInfo: RowInfo;
+    ScreenToLocalTransform: () => Transform;
+    addDoc: (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => boolean;
+    removeDoc: (doc: Doc | Doc[]) => boolean;
+    rowFocused: boolean;
+    textWrapRow: (doc: Doc) => void;
+    rowWrapped: boolean;
+    dropAction: string;
+    addDocTab: any;
+}
+
+export class MovableRow extends React.Component<MovableRowProps> {
+    private _header?: React.RefObject<HTMLDivElement> = React.createRef();
+    private _rowDropDisposer?: DragManager.DragDropDisposer;
+
+    // Event listeners are only necessary when the user is hovering over the table
+    // Create one when the mouse starts hovering...
+    onPointerEnter = (e: React.PointerEvent): void => {
+        if (e.buttons === 1 && SnappingManager.GetIsDragging()) {
+            this._header!.current!.className = "collectionSchema-row-wrapper";
+            document.addEventListener("pointermove", this.onDragMove, true);
+        }
+    }
+    // ... and delete it when the mouse leaves
+    onPointerLeave = (e: React.PointerEvent): void => {
+        this._header!.current!.className = "collectionSchema-row-wrapper";
+        document.removeEventListener("pointermove", this.onDragMove, true);
+    }
+    // The method for the event listener, reorders columns when dragged to their new locations.
+    onDragMove = (e: PointerEvent): void => {
+        const x = this.props.ScreenToLocalTransform().transformPoint(e.clientX, e.clientY);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
+        const before = x[1] < bounds[1];
+        this._header!.current!.className = "collectionSchema-row-wrapper";
+        if (before) this._header!.current!.className += " row-above";
+        if (!before) this._header!.current!.className += " row-below";
+        e.stopPropagation();
+    }
+    componentWillUnmount() {
+
+        this._rowDropDisposer?.();
+    }
+    //
+    createRowDropTarget = (ele: HTMLDivElement) => {
+        this._rowDropDisposer?.();
+        if (ele) {
+            this._rowDropDisposer = DragManager.MakeDropTarget(ele, this.rowDrop.bind(this));
+        }
+    }
+    // Controls what hppens when a row is dragged and dropped
+    rowDrop = (e: Event, de: DragManager.DropEvent) => {
+        this.onPointerLeave(e as any);
+        const rowDoc = FieldValue(Cast(this.props.rowInfo.original, Doc));
+        if (!rowDoc) return false;
+
+        const x = this.props.ScreenToLocalTransform().transformPoint(de.x, de.y);
+        const rect = this._header!.current!.getBoundingClientRect();
+        const bounds = this.props.ScreenToLocalTransform().transformPoint(rect.left, rect.top + rect.height / 2);
+        const before = x[1] < bounds[1];
+
+        const docDragData = de.complete.docDragData;
+        if (docDragData) {
+            e.stopPropagation();
+            if (docDragData.draggedDocuments[0] === rowDoc) return true;
+            const addDocument = (doc: Doc | Doc[]) => this.props.addDoc(doc, rowDoc, before);
+            const movedDocs = docDragData.draggedDocuments;
+            return (docDragData.dropAction || docDragData.userDropAction) ?
+                docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before) || added, false)
+                : (docDragData.moveDocument) ?
+                    movedDocs.reduce((added: boolean, d) => docDragData.moveDocument?.(d, rowDoc, addDocument) || added, false)
+                    : docDragData.droppedDocuments.reduce((added: boolean, d) => this.props.addDoc(d, rowDoc, before), false);
+        }
+        return false;
+    }
+
+    onRowContextMenu = (e: React.MouseEvent): void => {
+        const description = this.props.rowWrapped ? "Unwrap text on row" : "Text wrap row";
+        ContextMenu.Instance.addItem({ description: description, event: () => this.props.textWrapRow(this.props.rowInfo.original), icon: "file-pdf" });
+    }
+
+    @undoBatch
+    @action
+    move: DragManager.MoveFunction = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDoc) => {
+        const targetView = targetCollection && DocumentManager.Instance.getDocumentView(targetCollection);
+        return doc !== targetCollection && doc !== targetView?.props.ContainingCollectionDoc && this.props.removeDoc(doc) && addDoc(doc);
+    }
+
+    @action
+    onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
+        console.log("yes");
+        if (e.key === "Backspace" || e.key === "Delete") {
+            undoBatch(() => this.props.removeDoc(this.props.rowInfo.original));
+        }
+    }
+
+    render() {
+        const { children = null, rowInfo } = this.props;
+
+        if (!rowInfo) {
+            return <ReactTableDefaults.TrComponent>{children}</ReactTableDefaults.TrComponent>;
+        }
+
+        const { original } = rowInfo;
+        const doc = FieldValue(Cast(original, Doc));
+
+        if (!doc) return (null);
+
+        const reference = React.createRef<HTMLDivElement>();
+        const onItemDown = SetupDrag(reference, () => doc, this.move, StrCast(this.props.dropAction) as dropActionType);
+
+        let className = "collectionSchema-row";
+        if (this.props.rowFocused) className += " row-focused";
+        if (this.props.rowWrapped) className += " row-wrapped";
+
+        return (
+            <div className={className} onKeyPress={this.onKeyDown} ref={this.createRowDropTarget} onContextMenu={this.onRowContextMenu}>
+                <div className="collectionSchema-row-wrapper" onKeyPress={this.onKeyDown} ref={this._header} onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}>
+                    <ReactTableDefaults.TrComponent onKeyPress={this.onKeyDown} >
+                        <div className="row-dragger">
+                            <div className="row-option" style={{ left: 5 }} onClick={undoBatch(() => this.props.removeDoc(this.props.rowInfo.original))}><FontAwesomeIcon icon="trash" size="sm" /></div>
+                            <div className="row-option" style={{ cursor: "grab", left: 25 }} ref={reference} onPointerDown={onItemDown}><FontAwesomeIcon icon="grip-vertical" size="sm" /></div>
+                            <div className="row-option" style={{ left: 40 }} onClick={() => this.props.addDocTab(this.props.rowInfo.original, "add:right")}><FontAwesomeIcon icon="external-link-alt" size="sm" /></div>
+                        </div>
+                        {children}
+                    </ReactTableDefaults.TrComponent>
+                </div>
+            </div>
+        );
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaView.scss b/src/client/views/collections/schemaView/CollectionSchemaView.scss
new file mode 100644
index 000000000..b57fee0e4
--- /dev/null
+++ b/src/client/views/collections/schemaView/CollectionSchemaView.scss
@@ -0,0 +1,552 @@
+@import "../../globalCssVariables";
+.collectionSchemaView-container {
+    border-width: $COLLECTION_BORDER_WIDTH;
+    border-color: $intermediate-color;
+    border-style: solid;
+    border-radius: $border-radius;
+    box-sizing: border-box;
+    position: relative;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    margin-top: 0;
+    transition: top 0.5s;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: nowrap;
+    touch-action: none;
+    div {
+        touch-action: none;
+    }
+    .collectionSchemaView-tableContainer {
+        width: 100%;
+        height: 100%;
+    }
+    .collectionSchemaView-dividerDragger {
+        position: relative;
+        height: 100%;
+        width: $SCHEMA_DIVIDER_WIDTH;
+        z-index: 20;
+        right: 0;
+        top: 0;
+        background: gray;
+        cursor: col-resize;
+    }
+    // .documentView-node:first-child {
+    //     background: $light-color;
+    // }
+}
+
+.collectionSchemaView-searchContainer {
+    border-width: $COLLECTION_BORDER_WIDTH;
+    border-color: $intermediate-color;
+    border-style: solid;
+    border-radius: $border-radius;
+    box-sizing: border-box;
+    position: relative;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    margin-top: 0;
+    transition: top 0.5s;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: nowrap;
+    touch-action: none;
+    padding: 2px;
+    div {
+        touch-action: none;
+    }
+    .collectionSchemaView-tableContainer {
+        width: 100%;
+        height: 100%;
+    }
+    .collectionSchemaView-dividerDragger {
+        position: relative;
+        height: 100%;
+        width: 20px;
+        z-index: 20;
+        right: 0;
+        top: 0;
+        background: gray;
+        cursor: col-resize;
+    }
+    // .documentView-node:first-child {
+    //     background: $light-color;
+    // }
+}
+
+.ReactTable {
+    width: 100%;
+    background: white;
+    box-sizing: border-box;
+    border: none !important;
+    float: none !important;
+    .rt-table {
+        height: 100%;
+        display: -webkit-inline-box;
+        direction: ltr;
+        overflow: visible;
+    }
+    .rt-noData {
+        display: none;
+    }
+    .rt-thead {
+        width: 100%;
+        z-index: 100;
+        overflow-y: visible;
+        &.-header {
+            font-size: 12px;
+            height: 30px;
+            box-shadow: none;
+            z-index: 100;
+            overflow-y: visible;
+        }
+        .rt-resizable-header-content {
+            height: 100%;
+            overflow: visible;
+        }
+        .rt-th {
+            padding: 0;
+            border: solid lightgray;
+            border-width: 0 1px;
+            border-bottom: 2px solid lightgray;
+        }
+    }
+    .rt-th {
+        font-size: 13px;
+        text-align: center;
+        &:last-child {
+            overflow: visible;
+        }
+    }
+    .rt-tbody {
+        width: 100%;
+        direction: rtl;
+        overflow: visible;
+        .rt-td {
+            border-right: 1px solid rgba(0, 0, 0, 0.2);
+        }
+    }
+    .rt-tr-group {
+        direction: ltr;
+        flex: 0 1 auto;
+        min-height: 30px;
+        border: 0 !important;
+    }
+    .rt-tr {
+        width: 100%;
+        min-height: 30px;
+    }
+    .rt-td {
+        padding: 0;
+        font-size: 13px;
+        text-align: center;
+        white-space: nowrap;
+        display: flex;
+        align-items: center;
+        .imageBox-cont {
+            position: relative;
+            max-height: 100%;
+        }
+        .imageBox-cont img {
+            object-fit: contain;
+            max-width: 100%;
+            height: 100%;
+        }
+        .videoBox-cont {
+            object-fit: contain;
+            width: auto;
+            height: 100%;
+        }
+    }
+    .rt-td.rt-expandable {
+        display: flex;
+        align-items: center;
+        height: inherit;
+    }
+    .rt-resizer {
+        width: 8px;
+        right: -4px;
+    }
+    .rt-resizable-header {
+        padding: 0;
+        height: 30px;
+    }
+    .rt-resizable-header:last-child {
+        overflow: visible;
+        .rt-resizer {
+            width: 5px !important;
+        }
+    }
+}
+
+.documentView-node-topmost {
+    text-align: left;
+    transform-origin: center top;
+    display: inline-block;
+}
+
+.collectionSchema-col {
+    height: 100%;
+}
+
+.collectionSchema-header-menu {
+    height: auto;
+    z-index: 100;
+    position: absolute;
+    background: white;
+    padding: 5px;
+    position: fixed;
+    background: white;
+    border: black 1px solid;
+    .collectionSchema-header-toggler {
+        z-index: 100;
+        width: 100%;
+        height: 100%;
+        padding: 4px;
+        letter-spacing: 2px;
+        text-transform: uppercase;
+        svg {
+            margin-right: 4px;
+        }
+    }
+}
+
+.collectionSchemaView-header {
+    height: 100%;
+    color: gray;
+    z-index: 100;
+    overflow-y: visible;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+}
+
+button.add-column {
+    width: 28px;
+}
+
+.collectionSchema-header-menuOptions {
+    color: black;
+    width: 180px;
+    text-align: left;
+    .collectionSchema-headerMenu-group {
+        padding: 7px 0;
+        border-bottom: 1px solid lightgray;
+        cursor: pointer;
+        &:first-child {
+            padding-top: 0;
+        }
+        &:last-child {
+            border: none;
+            text-align: center;
+            padding: 12px 0 0 0;
+        }
+    }
+    label {
+        color: $main-accent;
+        font-weight: normal;
+        letter-spacing: 2px;
+        text-transform: uppercase;
+    }
+    input {
+        color: black;
+        width: 100%;
+    }
+    .columnMenu-option {
+        cursor: pointer;
+        padding: 3px;
+        background-color: white;
+        transition: background-color 0.2s;
+        &:hover {
+            background-color: $light-color-secondary;
+        }
+        &.active {
+            font-weight: bold;
+            border: 2px solid $light-color-secondary;
+        }
+        svg {
+            color: gray;
+            margin-right: 5px;
+            width: 10px;
+        }
+    }
+    .keys-dropdown {
+        position: relative;
+        //width: 100%;
+        background-color: white;
+        input {
+            border: 2px solid $light-color-secondary;
+            padding: 3px;
+            height: 28px;
+            font-weight: bold;
+            letter-spacing: "2px";
+            text-transform: "uppercase";
+            &:focus {
+                font-weight: normal;
+            }
+        }
+        .keys-options-wrapper {
+            width: 100%;
+            max-height: 150px;
+            overflow-y: scroll;
+            position: absolute;
+            top: 28px;
+            box-shadow: 0 10px 16px rgba(0, 0, 0, 0.1);
+            background-color: white;
+            .key-option {
+                background-color: white;
+                border: 1px solid lightgray;
+                padding: 2px 3px;
+                &:not(:first-child) {
+                    border-top: 0;
+                }
+                &:hover {
+                    background-color: $light-color-secondary;
+                }
+            }
+        }
+    }
+    .columnMenu-colors {
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        .columnMenu-colorPicker {
+            cursor: pointer;
+            width: 20px;
+            height: 20px;
+            border-radius: 10px;
+            &.active {
+                border: 2px solid white;
+                box-shadow: 0 0 0 2px lightgray;
+            }
+        }
+    }
+}
+
+.collectionSchema-row {
+    height: 100%;
+    background-color: white;
+    &.row-focused .rt-td {
+        background-color: #bfffc0; //$light-color-secondary;
+    }
+    &.row-wrapped {
+        .rt-td {
+            white-space: normal;
+        }
+    }
+    .row-dragger {
+        display: flex;
+        justify-content: space-around;
+        //flex: 50 0 auto;
+        width: 0;
+        max-width: 50px;
+        //height: 100%;
+        min-height: 30px;
+        align-items: center;
+        color: lightgray;
+        background-color: white;
+        transition: color 0.1s ease;
+        .row-option {
+            // padding: 5px;
+            cursor: pointer;
+            position: absolute;
+            transition: color 0.1s ease;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            z-index: 2;
+            &:hover {
+                color: gray;
+            }
+        }
+    }
+    .collectionSchema-row-wrapper {
+        &.row-above {
+            border-top: 1px solid red;
+        }
+        &.row-below {
+            border-bottom: 1px solid red;
+        }
+        &.row-inside {
+            border: 1px solid red;
+        }
+        .row-dragging {
+            background-color: blue;
+        }
+    }
+}
+
+.collectionSchemaView-cellContainer {
+    width: 100%;
+    height: unset;
+}
+
+.collectionSchemaView-cellWrapper {
+    height: 100%;
+    padding: 4px;
+    text-align: left;
+    padding-left: 19px;
+    position: relative;
+    &:focus {
+        outline: none;
+    }
+    &.editing {
+        padding: 0;
+        input {
+            outline: 0;
+            border: none;
+            background-color: rgb(255, 217, 217);
+            width: 100%;
+            height: 100%;
+            padding: 2px 3px;
+            min-height: 26px;
+        }
+    }
+    &.focused {
+        &.inactive {
+            border: none;
+        }
+    }
+    p {
+        width: 100%;
+        height: 100%;
+    }
+    &:hover .collectionSchemaView-cellContents-docExpander {
+        display: block;
+    }
+    .collectionSchemaView-cellContents-document {
+        display: inline-block;
+    }
+    .collectionSchemaView-cellContents-docButton {
+        float: right;
+        width: "15px";
+        height: "15px";
+    }
+    .collectionSchemaView-dropdownWrapper {
+        border: grey;
+        border-style: solid;
+        border-width: 1px;
+        height: 30px;
+        .collectionSchemaView-dropdownButton {
+            //display: inline-block;
+            float: left;
+            height: 100%;
+        }
+        .collectionSchemaView-dropdownText {
+            display: inline-block;
+            //float: right;
+            height: 100%;
+            display: "flex";
+            font-size: 13;
+            justify-content: "center";
+            align-items: "center";
+        }
+    }
+    .collectionSchemaView-dropdownContainer {
+        position: absolute;
+        border: 1px solid rgba(0, 0, 0, 0.04);
+        box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14);
+        .collectionSchemaView-dropdownOption:hover {
+            background-color: rgba(0, 0, 0, 0.14);
+            cursor: pointer;
+        }
+    }
+}
+
+.collectionSchemaView-cellContents-docExpander {
+    height: 30px;
+    width: 30px;
+    display: none;
+    position: absolute;
+    top: 0;
+    right: 0;
+    background-color: lightgray;
+}
+
+.doc-drag-over {
+    background-color: red;
+}
+
+.collectionSchemaView-toolbar {
+    z-index: 100;
+}
+
+.collectionSchemaView-toolbar {
+    height: 30px;
+    display: flex;
+    justify-content: flex-end;
+    padding: 0 10px;
+    border-bottom: 2px solid gray;
+    .collectionSchemaView-toolbar-item {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+    }
+}
+
+#preview-schema-checkbox-div {
+    margin-left: 20px;
+    font-size: 12px;
+}
+
+.collectionSchemaView-table {
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    padding: 3px;
+}
+
+.rt-td.rt-expandable {
+    overflow: visible;
+    position: relative;
+    height: 100%;
+    z-index: 1;
+}
+
+.reactTable-sub {
+    background-color: rgb(252, 252, 252);
+    width: 100%;
+    .rt-thead {
+        display: none;
+    }
+    .row-dragger {
+        background-color: rgb(252, 252, 252);
+    }
+    .rt-table {
+        background-color: rgb(252, 252, 252);
+    }
+    .collectionSchemaView-table {
+        width: 100%;
+        border: solid 1px;
+        overflow: visible;
+        padding: 0px;
+    }
+}
+
+.collectionSchemaView-expander {
+    height: 100%;
+    min-height: 30px;
+    position: absolute;
+    color: gray;
+    width: 20;
+    height: auto;
+    left: 55;
+    svg {
+        position: absolute;
+        top: 50%;
+        left: 10;
+        transform: translate(-50%, -50%);
+    }
+}
+
+.collectionSchemaView-addRow {
+    color: gray;
+    letter-spacing: 2px;
+    text-transform: uppercase;
+    cursor: pointer;
+    font-size: 10.5px;
+    margin-left: 50px;
+    margin-top: 10px;
+}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/CollectionSchemaView.tsx b/src/client/views/collections/schemaView/CollectionSchemaView.tsx
new file mode 100644
index 000000000..ef28f75c8
--- /dev/null
+++ b/src/client/views/collections/schemaView/CollectionSchemaView.tsx
@@ -0,0 +1,575 @@
+import React = require("react");
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { action, computed, observable, untracked } from "mobx";
+import { observer } from "mobx-react";
+import Measure from "react-measure";
+import { Resize } from "react-table";
+import "react-table/react-table.css";
+import { Doc, Opt } from "../../../../fields/Doc";
+import { List } from "../../../../fields/List";
+import { listSpec } from "../../../../fields/Schema";
+import { PastelSchemaPalette, SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { Cast, NumCast } from "../../../../fields/Types";
+import { TraceMobx } from "../../../../fields/util";
+import { emptyFunction, emptyPath, returnFalse, setupMoveUpEvents, returnEmptyDoclist, returnTrue } from "../../../../Utils";
+import { SelectionManager } from "../../../util/SelectionManager";
+import { SnappingManager } from "../../../util/SnappingManager";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../globalCssVariables.scss';
+import { ContextMenu } from "../../ContextMenu";
+import { ContextMenuProps } from "../../ContextMenuItem";
+import '../../../views/DocumentDecorations.scss';
+import { DocumentView } from "../../nodes/DocumentView";
+import { DefaultStyleProvider } from "../../StyleProvider";
+import "./CollectionSchemaView.scss";
+import { CollectionSubView } from "../CollectionSubView";
+import { SchemaTable } from "./SchemaTable";
+import { DocUtils } from "../../../documents/Documents";
+// bcz: need to add drag and drop of rows and columns.  This seems like it might work for rows: https://codesandbox.io/s/l94mn1q657
+
+export enum ColumnType {
+    Any,
+    Number,
+    String,
+    Boolean,
+    Doc,
+    Image,
+    List,
+    Date
+}
+// this map should be used for keys that should have a const type of value
+const columnTypes: Map<string, ColumnType> = new Map([
+    ["title", ColumnType.String],
+    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
+    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
+    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
+]);
+
+@observer
+export class CollectionSchemaView extends CollectionSubView(doc => doc) {
+    private _previewCont?: HTMLDivElement;
+
+    @observable _previewDoc: Doc | undefined = undefined;
+    @observable _focusedTable: Doc = this.props.Document;
+    @observable _col: any = "";
+    @observable _menuWidth = 0;
+    @observable _headerOpen = false;
+    @observable _headerIsEditing = false;
+    @observable _menuHeight = 0;
+    @observable _pointerX = 0;
+    @observable _pointerY = 0;
+    @observable _openTypes: boolean = false;
+
+    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
+    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
+    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
+    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
+    @computed get scale() { return this.props.ScreenToLocalTransform().Scale; }
+    @computed get columns() { return Cast(this.props.Document._schemaHeaders, listSpec(SchemaHeaderField), []); }
+    set columns(columns: SchemaHeaderField[]) { this.props.Document._schemaHeaders = new List<SchemaHeaderField>(columns); }
+
+    @computed get menuCoordinates() {
+        let searchx = 0;
+        let searchy = 0;
+        if (this.props.Document._searchDoc) {
+            const el = document.getElementsByClassName("collectionSchemaView-searchContainer")[0];
+            if (el !== undefined) {
+                const rect = el.getBoundingClientRect();
+                searchx = rect.x;
+                searchy = rect.y;
+            }
+        }
+        const x = Math.max(0, Math.min(document.body.clientWidth - this._menuWidth, this._pointerX)) - searchx;
+        const y = Math.max(0, Math.min(document.body.clientHeight - this._menuHeight, this._pointerY)) - searchy;
+        return this.props.ScreenToLocalTransform().transformPoint(x, y);
+    }
+
+    get documentKeys() {
+        const docs = this.childDocs;
+        const keys: { [key: string]: boolean } = {};
+        // bcz: ugh.  this is untracked since otherwise a large collection of documents will blast the server for all their fields.
+        //  then as each document's fields come back, we update the documents _proxies.  Each time we do this, the whole schema will be
+        //  invalidated and re-rendered.   This workaround will inquire all of the document fields before the options button is clicked.
+        //  then by the time the options button is clicked, all of the fields should be in place.  If a new field is added while this menu
+        //  is displayed (unlikely) it won't show up until something else changes.
+        //TODO Types
+        untracked(() => docs.map(doc => Doc.GetAllPrototypes(doc).map(proto => Object.keys(proto).forEach(key => keys[key] = false))));
+
+        this.columns.forEach(key => keys[key.heading] = true);
+        return Array.from(Object.keys(keys));
+    }
+
+    @action setHeaderIsEditing = (isEditing: boolean) => this._headerIsEditing = isEditing;
+
+    @undoBatch
+    setColumnType = action((columnField: SchemaHeaderField, type: ColumnType): void => {
+        this._openTypes = false;
+        if (columnTypes.get(columnField.heading)) return;
+
+        const columns = this.columns;
+        const index = columns.indexOf(columnField);
+        if (index > -1) {
+            columnField.setType(NumCast(type));
+            columns[index] = columnField;
+            this.columns = columns;
+        }
+    });
+
+    @undoBatch
+    setColumnColor = (columnField: SchemaHeaderField, color: string): void => {
+        const columns = this.columns;
+        const index = columns.indexOf(columnField);
+        if (index > -1) {
+            columnField.setColor(color);
+            columns[index] = columnField;
+            this.columns = columns; // need to set the columns to trigger rerender
+        }
+    }
+
+    @undoBatch
+    @action
+    setColumnSort = (columnField: SchemaHeaderField, descending: boolean | undefined) => {
+        const columns = this.columns;
+        columns.forEach(col => col.setDesc(undefined));
+
+        const index = columns.findIndex(c => c.heading === columnField.heading);
+        const column = columns[index];
+        column.setDesc(descending);
+        columns[index] = column;
+        this.columns = columns;
+    }
+
+    renderTypes = (col: any) => {
+        if (columnTypes.get(col.heading)) return (null);
+
+        const type = col.type;
+
+        const anyType = <div className={"columnMenu-option" + (type === ColumnType.Any ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Any)}>
+            <FontAwesomeIcon icon={"align-justify"} size="sm" />
+                Any
+            </div>;
+
+        const numType = <div className={"columnMenu-option" + (type === ColumnType.Number ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Number)}>
+            <FontAwesomeIcon icon={"hashtag"} size="sm" />
+                Number
+            </div>;
+
+        const textType = <div className={"columnMenu-option" + (type === ColumnType.String ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.String)}>
+            <FontAwesomeIcon icon={"font"} size="sm" />
+            Text
+            </div>;
+
+        const boolType = <div className={"columnMenu-option" + (type === ColumnType.Boolean ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Boolean)}>
+            <FontAwesomeIcon icon={"check-square"} size="sm" />
+            Checkbox
+            </div>;
+
+        const listType = <div className={"columnMenu-option" + (type === ColumnType.List ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.List)}>
+            <FontAwesomeIcon icon={"list-ul"} size="sm" />
+            List
+            </div>;
+
+        const docType = <div className={"columnMenu-option" + (type === ColumnType.Doc ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Doc)}>
+            <FontAwesomeIcon icon={"file"} size="sm" />
+            Document
+            </div>;
+
+        const imageType = <div className={"columnMenu-option" + (type === ColumnType.Image ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Image)}>
+            <FontAwesomeIcon icon={"image"} size="sm" />
+            Image
+            </div>;
+
+        const dateType = <div className={"columnMenu-option" + (type === ColumnType.Date ? " active" : "")} onClick={() => this.setColumnType(col, ColumnType.Date)}>
+            <FontAwesomeIcon icon={"calendar"} size="sm" />
+                Date
+                </div>;
+
+
+        const allColumnTypes = <div className="columnMenu-types">
+            {anyType}
+            {numType}
+            {textType}
+            {boolType}
+            {listType}
+            {docType}
+            {imageType}
+            {dateType}
+        </div>;
+
+        const justColType = type === ColumnType.Any ? anyType : type === ColumnType.Number ? numType :
+            type === ColumnType.String ? textType : type === ColumnType.Boolean ? boolType :
+                type === ColumnType.List ? listType : type === ColumnType.Doc ? docType :
+                    type === ColumnType.Date ? dateType : imageType;
+
+        return (
+            <div className="collectionSchema-headerMenu-group" onClick={action(() => this._openTypes = !this._openTypes)}>
+                <div>
+                    <label style={{ cursor: "pointer" }}>Column type:</label>
+                    <FontAwesomeIcon icon={"caret-down"} size="lg" style={{ float: "right", transform: `rotate(${this._openTypes ? "180deg" : 0})`, transition: "0.2s all ease" }} />
+                </div>
+                {this._openTypes ? allColumnTypes : justColType}
+            </div >
+        );
+    }
+
+    renderSorting = (col: any) => {
+        const sort = col.desc;
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Sort by:</label>
+                <div className="columnMenu-sort">
+                    <div className={"columnMenu-option" + (sort === true ? " active" : "")} onClick={() => this.setColumnSort(col, true)}>
+                        <FontAwesomeIcon icon="sort-amount-down" size="sm" />
+                        Sort descending
+                    </div>
+                    <div className={"columnMenu-option" + (sort === false ? " active" : "")} onClick={() => this.setColumnSort(col, false)}>
+                        <FontAwesomeIcon icon="sort-amount-up" size="sm" />
+                        Sort ascending
+                    </div>
+                    <div className="columnMenu-option" onClick={() => this.setColumnSort(col, undefined)}>
+                        <FontAwesomeIcon icon="times" size="sm" />
+                        Clear sorting
+                    </div>
+                </div>
+            </div>
+        );
+    }
+
+    renderColors = (col: any) => {
+        const selected = col.color;
+
+        const pink = PastelSchemaPalette.get("pink2");
+        const purple = PastelSchemaPalette.get("purple2");
+        const blue = PastelSchemaPalette.get("bluegreen1");
+        const yellow = PastelSchemaPalette.get("yellow4");
+        const red = PastelSchemaPalette.get("red2");
+        const gray = "#f1efeb";
+
+        return (
+            <div className="collectionSchema-headerMenu-group">
+                <label>Color:</label>
+                <div className="columnMenu-colors">
+                    <div className={"columnMenu-colorPicker" + (selected === pink ? " active" : "")} style={{ backgroundColor: pink }} onClick={() => this.setColumnColor(col, pink!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === purple ? " active" : "")} style={{ backgroundColor: purple }} onClick={() => this.setColumnColor(col, purple!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === blue ? " active" : "")} style={{ backgroundColor: blue }} onClick={() => this.setColumnColor(col, blue!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === yellow ? " active" : "")} style={{ backgroundColor: yellow }} onClick={() => this.setColumnColor(col, yellow!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === red ? " active" : "")} style={{ backgroundColor: red }} onClick={() => this.setColumnColor(col, red!)}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === gray ? " active" : "")} style={{ backgroundColor: gray }} onClick={() => this.setColumnColor(col, gray)}></div>
+                </div>
+            </div>
+        );
+    }
+
+    @undoBatch
+    @action
+    changeColumns = (oldKey: string, newKey: string, addNew: boolean, filter?: string) => {
+        const columns = this.columns;
+        if (columns === undefined) {
+            this.columns = new List<SchemaHeaderField>([new SchemaHeaderField(newKey, "f1efeb")]);
+        } else {
+            if (addNew) {
+                columns.push(new SchemaHeaderField(newKey, "f1efeb"));
+                this.columns = columns;
+            } else {
+                const index = columns.map(c => c.heading).indexOf(oldKey);
+                if (index > -1) {
+                    const column = columns[index];
+                    column.setHeading(newKey);
+                    columns[index] = column;
+                    this.columns = columns;
+                    if (filter) {
+                        Doc.setDocFilter(this.props.Document, newKey, filter, "match");
+                    }
+                    else {
+                        this.props.Document._docFilters = undefined;
+                    }
+                }
+            }
+        }
+    }
+
+    @action
+    openHeader = (col: any, screenx: number, screeny: number) => {
+        this._col = col;
+        this._headerOpen = true;
+        this._pointerX = screenx;
+        this._pointerY = screeny;
+    }
+
+    @action
+    closeHeader = () => { this._headerOpen = false; }
+
+    @undoBatch
+    @action
+    deleteColumn = (key: string) => {
+        const columns = this.columns;
+        if (columns === undefined) {
+            this.columns = new List<SchemaHeaderField>([]);
+        } else {
+            const index = columns.map(c => c.heading).indexOf(key);
+            if (index > -1) {
+                columns.splice(index, 1);
+                this.columns = columns;
+            }
+        }
+        this.closeHeader();
+    }
+
+    getPreviewTransform = (): Transform => {
+        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - NumCast(COLLECTION_BORDER_WIDTH) - this.tableWidth, - this.borderWidth);
+    }
+
+    @action
+    onHeaderClick = (e: React.PointerEvent) => {
+        e.stopPropagation();
+    }
+
+    @action
+    onWheel(e: React.WheelEvent) {
+        const scale = this.props.ScreenToLocalTransform().Scale;
+        this.props.isContentActive(true) && e.stopPropagation();
+    }
+
+    @computed get renderMenuContent() {
+        TraceMobx();
+        return <div className="collectionSchema-header-menuOptions">
+            {this.renderTypes(this._col)}
+            {this.renderColors(this._col)}
+            <div className="collectionSchema-headerMenu-group">
+                <button onClick={() => { this.deleteColumn(this._col.heading); }}
+                >Delete Column</button>
+            </div>
+        </div>;
+    }
+
+    private createTarget = (ele: HTMLDivElement) => {
+        this._previewCont = ele;
+        super.CreateDropTarget(ele);
+    }
+
+    isFocused = (doc: Doc, outsideReaction: boolean): boolean => this.props.isSelected(outsideReaction) && doc === this._focusedTable;
+
+    @action setFocused = (doc: Doc) => this._focusedTable = doc;
+
+    @action setPreviewDoc = (doc: Opt<Doc>) => {
+        SelectionManager.SelectSchemaView(this, doc);
+        this._previewDoc = doc;
+    }
+
+    //toggles preview side-panel of schema
+    @action
+    toggleExpander = () => {
+        this.props.Document.schemaPreviewWidth = this.previewWidth() === 0 ? Math.min(this.tableWidth / 3, 200) : 0;
+    }
+
+    onDividerDown = (e: React.PointerEvent) => {
+        setupMoveUpEvents(this, e, this.onDividerMove, emptyFunction, this.toggleExpander);
+    }
+    @action
+    onDividerMove = (e: PointerEvent, down: number[], delta: number[]) => {
+        const nativeWidth = this._previewCont!.getBoundingClientRect();
+        const minWidth = 40;
+        const maxWidth = 1000;
+        const movedWidth = this.props.ScreenToLocalTransform().transformDirection(nativeWidth.right - e.clientX, 0)[0];
+        const width = movedWidth < minWidth ? minWidth : movedWidth > maxWidth ? maxWidth : movedWidth;
+        this.props.Document.schemaPreviewWidth = width;
+        return false;
+    }
+
+    onPointerDown = (e: React.PointerEvent): void => {
+        if (e.button === 0 && !e.altKey && !e.ctrlKey && !e.metaKey) {
+            if (this.props.isSelected(true)) e.stopPropagation();
+            else this.props.select(false);
+        }
+    }
+
+    @computed
+    get previewDocument(): Doc | undefined { return this._previewDoc; }
+
+    @computed
+    get dividerDragger() {
+        return this.previewWidth() === 0 ? (null) :
+            <div className="collectionSchemaView-dividerDragger" onPointerDown={this.onDividerDown} >
+                <div className="collectionSchemaView-dividerDragger" />
+            </div>;
+    }
+
+    @computed
+    get previewPanel() {
+        return <div ref={this.createTarget} style={{ width: `${this.previewWidth()}px` }}>
+            {!this.previewDocument ? (null) :
+                <DocumentView
+                    Document={this.previewDocument}
+                    DataDoc={undefined}
+                    fitContentsToDoc={returnTrue}
+                    freezeDimensions={true}
+                    dontCenter={"y"}
+                    focus={DocUtils.DefaultFocus}
+                    renderDepth={this.props.renderDepth}
+                    rootSelected={this.rootSelected}
+                    PanelWidth={this.previewWidth}
+                    PanelHeight={this.previewHeight}
+                    isContentActive={returnTrue}
+                    isDocumentActive={returnFalse}
+                    ScreenToLocalTransform={this.getPreviewTransform}
+                    docFilters={this.docFilters}
+                    docRangeFilters={this.docRangeFilters}
+                    searchFilterDocs={this.searchFilterDocs}
+                    styleProvider={DefaultStyleProvider}
+                    layerProvider={undefined}
+                    docViewPath={returnEmptyDoclist}
+                    ContainingCollectionDoc={this.props.CollectionView?.props.Document}
+                    ContainingCollectionView={this.props.CollectionView}
+                    moveDocument={this.props.moveDocument}
+                    addDocument={this.props.addDocument}
+                    removeDocument={this.props.removeDocument}
+                    whenChildContentsActiveChanged={this.props.whenChildContentsActiveChanged}
+                    addDocTab={this.props.addDocTab}
+                    pinToPres={this.props.pinToPres}
+                    bringToFront={returnFalse}
+                />}
+        </div>;
+    }
+
+    @computed
+    get schemaTable() {
+        return <SchemaTable
+            Document={this.props.Document}
+            PanelHeight={this.props.PanelHeight}
+            PanelWidth={this.props.PanelWidth}
+            childDocs={this.childDocs}
+            CollectionView={this.props.CollectionView}
+            ContainingCollectionView={this.props.ContainingCollectionView}
+            ContainingCollectionDoc={this.props.ContainingCollectionDoc}
+            fieldKey={this.props.fieldKey}
+            renderDepth={this.props.renderDepth}
+            moveDocument={this.props.moveDocument}
+            ScreenToLocalTransform={this.props.ScreenToLocalTransform}
+            active={this.props.isContentActive}
+            onDrop={this.onExternalDrop}
+            addDocTab={this.props.addDocTab}
+            pinToPres={this.props.pinToPres}
+            isSelected={this.props.isSelected}
+            isFocused={this.isFocused}
+            setFocused={this.setFocused}
+            setPreviewDoc={this.setPreviewDoc}
+            deleteDocument={this.props.removeDocument}
+            addDocument={this.props.addDocument}
+            dataDoc={this.props.DataDoc}
+            columns={this.columns}
+            documentKeys={this.documentKeys}
+            headerIsEditing={this._headerIsEditing}
+            openHeader={this.openHeader}
+            onClick={this.onTableClick}
+            onPointerDown={emptyFunction}
+            onResizedChange={this.onResizedChange}
+            setColumns={this.setColumns}
+            reorderColumns={this.reorderColumns}
+            changeColumns={this.changeColumns}
+            setHeaderIsEditing={this.setHeaderIsEditing}
+            changeColumnSort={this.setColumnSort}
+        />;
+    }
+
+    @computed
+    public get schemaToolbar() {
+        return <div className="collectionSchemaView-toolbar">
+            <div className="collectionSchemaView-toolbar-item">
+                <div id="preview-schema-checkbox-div">
+                    <input type="checkbox" key={"Show Preview"} checked={this.previewWidth() !== 0} onChange={this.toggleExpander} />
+                    Show Preview
+                </div>
+            </div>
+        </div>;
+    }
+
+    onSpecificMenu = (e: React.MouseEvent) => {
+        if ((e.target as any)?.className?.includes?.("collectionSchemaView-cell") || (e.target instanceof HTMLSpanElement)) {
+            const cm = ContextMenu.Instance;
+            const options = cm.findByDescription("Options...");
+            const optionItems: ContextMenuProps[] = options && "subitems" in options ? options.subitems : [];
+            optionItems.push({ description: "remove", event: () => this._previewDoc && this.props.removeDocument?.(this._previewDoc), icon: "trash" });
+            !options && cm.addItem({ description: "Options...", subitems: optionItems, icon: "compass" });
+            cm.displayMenu(e.clientX, e.clientY);
+            (e.nativeEvent as any).SchemaHandled = true; // not sure why this is needed, but if you right-click quickly on a cell, the Document/Collection contextMenu handlers still fire without this.
+            e.stopPropagation();
+        }
+    }
+
+    @action
+    onTableClick = (e: React.MouseEvent): void => {
+        if (!(e.target as any)?.className?.includes?.("collectionSchemaView-cell") && !(e.target instanceof HTMLSpanElement)) {
+            this.setPreviewDoc(undefined);
+        } else {
+            e.stopPropagation();
+        }
+        this.setFocused(this.props.Document);
+        this.closeHeader();
+    }
+
+    onResizedChange = (newResized: Resize[], event: any) => {
+        const columns = this.columns;
+        newResized.forEach(resized => {
+            const index = columns.findIndex(c => c.heading === resized.id);
+            const column = columns[index];
+            column.setWidth(resized.value);
+            columns[index] = column;
+        });
+        this.columns = columns;
+    }
+
+    @action
+    setColumns = (columns: SchemaHeaderField[]) => this.columns = columns
+
+    @undoBatch
+    reorderColumns = (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => {
+        const columns = [...columnsValues];
+        const oldIndex = columns.indexOf(toMove);
+        const relIndex = columns.indexOf(relativeTo);
+        const newIndex = (oldIndex > relIndex && !before) ? relIndex + 1 : (oldIndex < relIndex && before) ? relIndex - 1 : relIndex;
+
+        if (oldIndex === newIndex) return;
+
+        columns.splice(newIndex, 0, columns.splice(oldIndex, 1)[0]);
+        this.columns = columns;
+    }
+
+    onZoomMenu = (e: React.WheelEvent) => this.props.isContentActive(true) && e.stopPropagation();
+
+    render() {
+        TraceMobx();
+        if (!this.props.isContentActive()) setTimeout(() => this.closeHeader(), 0);
+        const menuContent = this.renderMenuContent;
+        const menu = <div className="collectionSchema-header-menu"
+            onWheel={e => this.onZoomMenu(e)}
+            onPointerDown={e => this.onHeaderClick(e)}
+            style={{ transform: `translate(${(this.menuCoordinates[0])}px, ${(this.menuCoordinates[1])}px)` }}>
+            <Measure offset onResize={action((r: any) => {
+                const dim = this.props.ScreenToLocalTransform().inverse().transformDirection(r.offset.width, r.offset.height);
+                this._menuWidth = dim[0]; this._menuHeight = dim[1];
+            })}>
+                {({ measureRef }) => <div ref={measureRef}> {menuContent} </div>}
+            </Measure>
+        </div>;
+        return <div className={"collectionSchemaView" + (this.props.Document._searchDoc ? "-searchContainer" : "-container")}
+            style={{
+                overflow: this.props.scrollOverflow === true ? "scroll" : undefined, backgroundColor: "white",
+                pointerEvents: this.props.Document._searchDoc !== undefined && !this.props.isContentActive() && !SnappingManager.GetIsDragging() ? "none" : undefined,
+                width: name === "collectionSchemaView-searchContainer" ? "auto" : this.props.PanelWidth() || "100%", height: this.props.PanelHeight() || "100%", position: "relative",
+            }}  >
+            <div className="collectionSchemaView-tableContainer"
+                style={{ width: `calc(100% - ${this.previewWidth()}px)` }}
+                onContextMenu={this.onSpecificMenu}
+                onPointerDown={this.onPointerDown}
+                onWheel={e => this.props.isContentActive(true) && e.stopPropagation()}
+                onDrop={e => this.onExternalDrop(e, {})}
+                ref={this.createTarget}>
+                {this.schemaTable}
+            </div>
+            {this.dividerDragger}
+            {!this.previewWidth() ? (null) : this.previewPanel}
+            {this._headerOpen && this.props.isContentActive() ? menu : null}
+        </div>;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/collections/schemaView/SchemaTable.tsx b/src/client/views/collections/schemaView/SchemaTable.tsx
new file mode 100644
index 000000000..0d5c9e077
--- /dev/null
+++ b/src/client/views/collections/schemaView/SchemaTable.tsx
@@ -0,0 +1,601 @@
+import React = require("react");
+import { IconProp } from '@fortawesome/fontawesome-svg-core';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { action, computed, observable } from "mobx";
+import { observer } from "mobx-react";
+import ReactTable, { CellInfo, Column, ComponentPropsGetterR, Resize, SortingRule } from "react-table";
+import "react-table/react-table.css";
+import { DateField } from "../../../../fields/DateField";
+import { AclPrivate, AclReadonly, DataSym, Doc, DocListCast, Field, Opt } from "../../../../fields/Doc";
+import { Id } from "../../../../fields/FieldSymbols";
+import { List } from "../../../../fields/List";
+import { listSpec } from "../../../../fields/Schema";
+import { SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
+import { ComputedField } from "../../../../fields/ScriptField";
+import { Cast, FieldValue, NumCast, StrCast } from "../../../../fields/Types";
+import { ImageField } from "../../../../fields/URLField";
+import { GetEffectiveAcl } from "../../../../fields/util";
+import { emptyFunction, emptyPath, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue } from "../../../../Utils";
+import { Docs, DocumentOptions, DocUtils } from "../../../documents/Documents";
+import { DocumentType } from "../../../documents/DocumentTypes";
+import { CompileScript, Transformer, ts } from "../../../util/Scripting";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../globalCssVariables.scss';
+import { ContextMenu } from "../../ContextMenu";
+import '../../../views/DocumentDecorations.scss';
+import { DocumentView } from "../../nodes/DocumentView";
+import { DefaultStyleProvider } from "../../StyleProvider";
+import { CellProps, CollectionSchemaButtons, CollectionSchemaCell, CollectionSchemaCheckboxCell, CollectionSchemaDateCell, CollectionSchemaDocCell, CollectionSchemaImageCell, CollectionSchemaListCell, CollectionSchemaNumberCell, CollectionSchemaStringCell } from "./CollectionSchemaCells";
+import { CollectionSchemaAddColumnHeader, KeysDropdown } from "./CollectionSchemaHeaders";
+import { MovableColumn } from "./CollectionSchemaMovableColumn";
+import { MovableRow } from "./CollectionSchemaMovableRow";
+import "./CollectionSchemaView.scss";
+import { CollectionView } from "../CollectionView";
+
+
+enum ColumnType {
+    Any,
+    Number,
+    String,
+    Boolean,
+    Doc,
+    Image,
+    List,
+    Date
+}
+
+// this map should be used for keys that should have a const type of value
+const columnTypes: Map<string, ColumnType> = new Map([
+    ["title", ColumnType.String],
+    ["x", ColumnType.Number], ["y", ColumnType.Number], ["_width", ColumnType.Number], ["_height", ColumnType.Number],
+    ["_nativeWidth", ColumnType.Number], ["_nativeHeight", ColumnType.Number], ["isPrototype", ColumnType.Boolean],
+    ["_curPage", ColumnType.Number], ["_currentTimecode", ColumnType.Number], ["zIndex", ColumnType.Number]
+]);
+
+export interface SchemaTableProps {
+    Document: Doc; // child doc
+    dataDoc?: Doc;
+    PanelHeight: () => number;
+    PanelWidth: () => number;
+    childDocs?: Doc[];
+    CollectionView: Opt<CollectionView>;
+    ContainingCollectionView: Opt<CollectionView>;
+    ContainingCollectionDoc: Opt<Doc>;
+    fieldKey: string;
+    renderDepth: number;
+    deleteDocument?: (document: Doc | Doc[]) => boolean;
+    addDocument?: (document: Doc | Doc[]) => boolean;
+    moveDocument?: (document: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (document: Doc | Doc[]) => boolean) => boolean;
+    ScreenToLocalTransform: () => Transform;
+    active: (outsideReaction: boolean | undefined) => boolean;
+    onDrop: (e: React.DragEvent<Element>, options: DocumentOptions, completed?: (() => void) | undefined) => void;
+    addDocTab: (document: Doc, where: string) => boolean;
+    pinToPres: (document: Doc) => void;
+    isSelected: (outsideReaction?: boolean) => boolean;
+    isFocused: (document: Doc, outsideReaction: boolean) => boolean;
+    setFocused: (document: Doc) => void;
+    setPreviewDoc: (document: Opt<Doc>) => void;
+    columns: SchemaHeaderField[];
+    documentKeys: any[];
+    headerIsEditing: boolean;
+    openHeader: (column: any, screenx: number, screeny: number) => void;
+    onClick: (e: React.MouseEvent) => void;
+    onPointerDown: (e: React.PointerEvent) => void;
+    onResizedChange: (newResized: Resize[], event: any) => void;
+    setColumns: (columns: SchemaHeaderField[]) => void;
+    reorderColumns: (toMove: SchemaHeaderField, relativeTo: SchemaHeaderField, before: boolean, columnsValues: SchemaHeaderField[]) => void;
+    changeColumns: (oldKey: string, newKey: string, addNew: boolean) => void;
+    setHeaderIsEditing: (isEditing: boolean) => void;
+    changeColumnSort: (columnField: SchemaHeaderField, descending: boolean | undefined) => void;
+}
+
+@observer
+export class SchemaTable extends React.Component<SchemaTableProps> {
+    @observable _cellIsEditing: boolean = false;
+    @observable _focusedCell: { row: number, col: number } = { row: 0, col: 0 };
+    @observable _openCollections: Set<number> = new Set;
+
+    @observable _showDoc: Doc | undefined;
+    @observable _showDataDoc: any = "";
+    @observable _showDocPos: number[] = [];
+
+    @observable _showTitleDropdown: boolean = false;
+
+    @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); }
+    @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; }
+    @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); }
+
+    @computed get childDocs() {
+        if (this.props.childDocs) return this.props.childDocs;
+
+        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
+        return DocListCast(doc[this.props.fieldKey]);
+    }
+    set childDocs(docs: Doc[]) {
+        const doc = this.props.dataDoc ? this.props.dataDoc : this.props.Document;
+        doc[this.props.fieldKey] = new List<Doc>(docs);
+    }
+
+    @computed get textWrappedRows() {
+        return Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
+    }
+    set textWrappedRows(textWrappedRows: string[]) {
+        this.props.Document.textwrappedSchemaRows = new List<string>(textWrappedRows);
+    }
+
+    @computed get resized(): { id: string, value: number }[] {
+        return this.props.columns.reduce((resized, shf) => {
+            (shf.width > -1) && resized.push({ id: shf.heading, value: shf.width });
+            return resized;
+        }, [] as { id: string, value: number }[]);
+    }
+    @computed get sorted(): SortingRule[] {
+        return this.props.columns.reduce((sorted, shf) => {
+            shf.desc !== undefined && sorted.push({ id: shf.heading, desc: shf.desc });
+            return sorted;
+        }, [] as SortingRule[]);
+    }
+
+    @action
+    changeSorting = (col: any) => {
+        this.props.changeColumnSort(col, col.desc === true ? false : col.desc === false ? undefined : true);
+    }
+
+    @action
+    changeTitleMode = () => this._showTitleDropdown = !this._showTitleDropdown
+
+    @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); }
+    @computed get tableColumns(): Column<Doc>[] {
+        const possibleKeys = this.props.documentKeys.filter(key => this.props.columns.findIndex(existingKey => existingKey.heading.toUpperCase() === key.toUpperCase()) === -1);
+        const columns: Column<Doc>[] = [];
+        const tableIsFocused = this.props.isFocused(this.props.Document, false);
+        const focusedRow = this._focusedCell.row;
+        const focusedCol = this._focusedCell.col;
+        const isEditable = !this.props.headerIsEditing;
+
+        columns.push({
+            expander: true, Header: "", width: 58,
+            Expander: (rowInfo) => {
+                return rowInfo.original.type !== DocumentType.COL ? (null) :
+                    <div className="collectionSchemaView-expander" onClick={action(() => (this._openCollections[rowInfo.isExpanded ? "delete" : "add"])(rowInfo.viewIndex))}>
+                        <FontAwesomeIcon icon={rowInfo.isExpanded ? "caret-down" : "caret-right"} size="lg" />
+                    </div>;
+            }
+        });
+        columns.push(...this.props.columns.map(col => {
+            const icon: IconProp = this.getColumnType(col) === ColumnType.Number ? "hashtag" : this.getColumnType(col) === ColumnType.String ? "font" :
+                this.getColumnType(col) === ColumnType.Boolean ? "check-square" : this.getColumnType(col) === ColumnType.Doc ? "file" :
+                    this.getColumnType(col) === ColumnType.Image ? "image" : this.getColumnType(col) === ColumnType.List ? "list-ul" :
+                        this.getColumnType(col) === ColumnType.Date ? "calendar" : "align-justify";
+
+            const keysDropdown = <KeysDropdown
+                keyValue={col.heading}
+                possibleKeys={possibleKeys}
+                existingKeys={this.props.columns.map(c => c.heading)}
+                canAddNew={true}
+                addNew={false}
+                onSelect={this.props.changeColumns}
+                setIsEditing={this.props.setHeaderIsEditing}
+                docs={this.props.childDocs}
+                Document={this.props.Document}
+                dataDoc={this.props.dataDoc}
+                fieldKey={this.props.fieldKey}
+                ContainingCollectionDoc={this.props.ContainingCollectionDoc}
+                ContainingCollectionView={this.props.ContainingCollectionView}
+                active={this.props.active}
+                openHeader={this.props.openHeader}
+                icon={icon}
+                col={col}
+                // try commenting this out
+                width={"100%"}
+            />;
+
+            const sortIcon = col.desc === undefined ? "caret-right" : col.desc === true ? "caret-down" : "caret-up";
+            const header = <div className="collectionSchemaView-menuOptions-wrapper" style={{ background: col.color, padding: "2px", display: "flex", cursor: "default", height: "100%", }}>
+                {keysDropdown}
+                <div onClick={e => this.changeSorting(col)} style={{ width: 21, padding: 1, display: "inline", zIndex: 1, background: "inherit", cursor: "hand" }}>
+                    <FontAwesomeIcon icon={sortIcon} size="lg" />
+                </div>
+            </div>;
+
+            return {
+                Header: <MovableColumn columnRenderer={header} columnValue={col} allColumns={this.props.columns} reorderColumns={this.props.reorderColumns} ScreenToLocalTransform={this.props.ScreenToLocalTransform} />,
+                accessor: (doc: Doc) => doc ? Field.toString(doc[col.heading] as Field) : 0,
+                id: col.heading,
+                Cell: (rowProps: CellInfo) => {
+                    const rowIndex = rowProps.index;
+                    const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
+                    const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
+
+                    const props: CellProps = {
+                        row: rowIndex,
+                        col: columnIndex,
+                        rowProps: rowProps,
+                        isFocused: isFocused,
+                        changeFocusedCellByIndex: this.changeFocusedCellByIndex,
+                        CollectionView: this.props.CollectionView,
+                        ContainingCollection: this.props.ContainingCollectionView,
+                        Document: this.props.Document,
+                        fieldKey: this.props.fieldKey,
+                        renderDepth: this.props.renderDepth,
+                        addDocTab: this.props.addDocTab,
+                        pinToPres: this.props.pinToPres,
+                        moveDocument: this.props.moveDocument,
+                        setIsEditing: this.setCellIsEditing,
+                        isEditable: isEditable,
+                        setPreviewDoc: this.props.setPreviewDoc,
+                        setComputed: this.setComputed,
+                        getField: this.getField,
+                        showDoc: this.showDoc,
+                    };
+
+
+                    switch (this.getColumnType(col, rowProps.original, rowProps.column.id)) {
+                        case ColumnType.Number: return <CollectionSchemaNumberCell {...props} />;
+                        case ColumnType.String: return <CollectionSchemaStringCell {...props} />;
+                        case ColumnType.Boolean: return <CollectionSchemaCheckboxCell {...props} />;
+                        case ColumnType.Doc: return <CollectionSchemaDocCell {...props} />;
+                        case ColumnType.Image: return <CollectionSchemaImageCell {...props} />;
+                        case ColumnType.List: return <CollectionSchemaListCell {...props} />;
+                        case ColumnType.Date: return <CollectionSchemaDateCell {...props} />;
+                        default:
+                            return <CollectionSchemaCell {...props} />;
+                    }
+                },
+                minWidth: 200,
+            };
+        }));
+        columns.push({
+            Header: <CollectionSchemaAddColumnHeader createColumn={this.createColumn} />,
+            accessor: (doc: Doc) => 0,
+            id: "add",
+            Cell: (rowProps: CellInfo) => {
+                const rowIndex = rowProps.index;
+                const columnIndex = this.props.columns.map(c => c.heading).indexOf(rowProps.column.id!);
+                const isFocused = focusedRow === rowIndex && focusedCol === columnIndex && tableIsFocused;
+                return <CollectionSchemaButtons  {...{
+                    row: rowProps.index,
+                    col: columnIndex,
+                    rowProps: rowProps,
+                    isFocused: isFocused,
+                    changeFocusedCellByIndex: this.changeFocusedCellByIndex,
+                    CollectionView: this.props.CollectionView,
+                    ContainingCollection: this.props.ContainingCollectionView,
+                    Document: this.props.Document,
+                    fieldKey: this.props.fieldKey,
+                    renderDepth: this.props.renderDepth,
+                    addDocTab: this.props.addDocTab,
+                    pinToPres: this.props.pinToPres,
+                    moveDocument: this.props.moveDocument,
+                    setIsEditing: this.setCellIsEditing,
+                    isEditable: isEditable,
+                    setPreviewDoc: this.props.setPreviewDoc,
+                    setComputed: this.setComputed,
+                    getField: this.getField,
+                    showDoc: this.showDoc,
+                }} />;
+            },
+            width: 28,
+            resizable: false
+        });
+        return columns;
+    }
+
+
+    constructor(props: SchemaTableProps) {
+        super(props);
+        if (this.props.Document._schemaHeaders === undefined) {
+            this.props.Document._schemaHeaders = new List<SchemaHeaderField>([new SchemaHeaderField("title", "#f1efeb"), new SchemaHeaderField("author", "#f1efeb"), new SchemaHeaderField("*lastModified", "#f1efeb", ColumnType.Date),
+            new SchemaHeaderField("text", "#f1efeb", ColumnType.String), new SchemaHeaderField("type", "#f1efeb"), new SchemaHeaderField("context", "#f1efeb", ColumnType.Doc)]);
+        }
+    }
+
+    componentDidMount() {
+        document.addEventListener("keydown", this.onKeyDown);
+    }
+
+    componentWillUnmount() {
+        document.removeEventListener("keydown", this.onKeyDown);
+    }
+
+    tableAddDoc = (doc: Doc, relativeTo?: Doc, before?: boolean) => {
+        const tableDoc = this.props.Document[DataSym];
+        const effectiveAcl = GetEffectiveAcl(tableDoc);
+
+        if (effectiveAcl !== AclPrivate && effectiveAcl !== AclReadonly) {
+            doc.context = this.props.Document;
+            tableDoc[this.props.fieldKey + "-lastModified"] = new DateField(new Date(Date.now()));
+            return Doc.AddDocToList(this.props.Document, this.props.fieldKey, doc, relativeTo, before);
+        }
+        return false;
+    }
+
+    private getTrProps: ComponentPropsGetterR = (state, rowInfo) => {
+        return !rowInfo ? {} : {
+            ScreenToLocalTransform: this.props.ScreenToLocalTransform,
+            addDoc: this.tableAddDoc,
+            removeDoc: this.props.deleteDocument,
+            rowInfo,
+            rowFocused: !this.props.headerIsEditing && rowInfo.index === this._focusedCell.row && this.props.isFocused(this.props.Document, true),
+            textWrapRow: this.toggleTextWrapRow,
+            rowWrapped: this.textWrappedRows.findIndex(id => rowInfo.original[Id] === id) > -1,
+            dropAction: StrCast(this.props.Document.childDropAction),
+            addDocTab: this.props.addDocTab
+        };
+    }
+
+    private getTdProps: ComponentPropsGetterR = (state, rowInfo, column, instance) => {
+        if (!rowInfo || column) return {};
+
+        const row = rowInfo.index;
+        //@ts-ignore
+        const col = this.columns.map(c => c.heading).indexOf(column!.id);
+        const isFocused = this._focusedCell.row === row && this._focusedCell.col === col && this.props.isFocused(this.props.Document, true);
+        // TODO: editing border doesn't work :(
+        return {
+            style: { border: !this.props.headerIsEditing && isFocused ? "2px solid rgb(255, 160, 160)" : "1px solid #f1efeb" }
+        };
+    }
+
+    @action setCellIsEditing = (isEditing: boolean) => this._cellIsEditing = isEditing;
+
+    @action
+    onKeyDown = (e: KeyboardEvent): void => {
+        if (!this._cellIsEditing && !this.props.headerIsEditing && this.props.isFocused(this.props.Document, true)) {// && this.props.isSelected(true)) {
+            const direction = e.key === "Tab" ? "tab" : e.which === 39 ? "right" : e.which === 37 ? "left" : e.which === 38 ? "up" : e.which === 40 ? "down" : "";
+            this._focusedCell = this.changeFocusedCellByDirection(direction, this._focusedCell.row, this._focusedCell.col);
+
+            if (direction) {
+                const pdoc = FieldValue(this.childDocs[this._focusedCell.row]);
+                pdoc && this.props.setPreviewDoc(pdoc);
+                e.stopPropagation();
+            }
+        } else if (e.keyCode === 27) {
+            this.props.setPreviewDoc(undefined);
+            e.stopPropagation(); // stopPropagation for left/right arrows 
+        }
+    }
+
+    changeFocusedCellByDirection = (direction: string, curRow: number, curCol: number) => {
+        switch (direction) {
+            case "tab": return { row: (curRow + 1 === this.childDocs.length ? 0 : curRow + 1), col: curCol + 1 === this.props.columns.length ? 0 : curCol + 1 };
+            case "right": return { row: curRow, col: curCol + 1 === this.props.columns.length ? curCol : curCol + 1 };
+            case "left": return { row: curRow, col: curCol === 0 ? curCol : curCol - 1 };
+            case "up": return { row: curRow === 0 ? curRow : curRow - 1, col: curCol };
+            case "down": return { row: curRow + 1 === this.childDocs.length ? curRow : curRow + 1, col: curCol };
+        }
+        return this._focusedCell;
+    }
+
+    @action
+    changeFocusedCellByIndex = (row: number, col: number): void => {
+        if (this._focusedCell.row !== row || this._focusedCell.col !== col) {
+            this._focusedCell = { row: row, col: col };
+        }
+        this.props.setFocused(this.props.Document);
+    }
+
+    @undoBatch
+    createRow = action(() => {
+        this.props.addDocument?.(Docs.Create.TextDocument("", { title: "", _width: 100, _height: 30 }));
+        this._focusedCell = { row: this.childDocs.length, col: this._focusedCell.col };
+    });
+
+    @undoBatch
+    @action
+    createColumn = () => {
+        let index = 0;
+        let found = this.props.columns.findIndex(col => col.heading.toUpperCase() === "New field".toUpperCase()) > -1;
+        while (found) {
+            index++;
+            found = this.props.columns.findIndex(col => col.heading.toUpperCase() === ("New field (" + index + ")").toUpperCase()) > -1;
+        }
+        this.props.columns.push(new SchemaHeaderField(`New field ${index ? "(" + index + ")" : ""}`, "#f1efeb"));
+    }
+
+    @action
+    getColumnType = (column: SchemaHeaderField, doc?: Doc, field?: string): ColumnType => {
+        if (doc && field && column.type === ColumnType.Any) {
+            const val = doc[CollectionSchemaCell.resolvedFieldKey(field, doc)];
+            if (val instanceof ImageField) return ColumnType.Image;
+            if (val instanceof Doc) return ColumnType.Doc;
+            if (val instanceof DateField) return ColumnType.Date;
+            if (val instanceof List) return ColumnType.List;
+        }
+        if (column.type && column.type !== 0) {
+            return column.type;
+        }
+        if (columnTypes.get(column.heading)) {
+            return column.type = columnTypes.get(column.heading)!;
+        }
+        return column.type = ColumnType.Any;
+    }
+
+    @undoBatch
+    @action
+    toggleTextwrap = async () => {
+        const textwrappedRows = Cast(this.props.Document.textwrappedSchemaRows, listSpec("string"), []);
+        if (textwrappedRows.length) {
+            this.props.Document.textwrappedSchemaRows = new List<string>([]);
+        } else {
+            const docs = DocListCast(this.props.Document[this.props.fieldKey]);
+            const allRows = docs instanceof Doc ? [docs[Id]] : docs.map(doc => doc[Id]);
+            this.props.Document.textwrappedSchemaRows = new List<string>(allRows);
+        }
+    }
+
+    @action
+    toggleTextWrapRow = (doc: Doc): void => {
+        const textWrapped = this.textWrappedRows;
+        const index = textWrapped.findIndex(id => doc[Id] === id);
+
+        index > -1 ? textWrapped.splice(index, 1) : textWrapped.push(doc[Id]);
+
+        this.textWrappedRows = textWrapped;
+    }
+
+    @computed
+    get reactTable() {
+        const children = this.childDocs;
+        const hasCollectionChild = children.reduce((found, doc) => found || doc.type === DocumentType.COL, false);
+        const expanded: { [name: string]: any } = {};
+        Array.from(this._openCollections.keys()).map(col => expanded[col.toString()] = true);
+        const rerender = [...this.textWrappedRows]; // TODO: get component to rerender on text wrap change without needign to console.log :((((
+
+        return <ReactTable
+            style={{ position: "relative" }}
+            data={children}
+            page={0}
+            pageSize={children.length}
+            showPagination={false}
+            columns={this.tableColumns}
+            getTrProps={this.getTrProps}
+            getTdProps={this.getTdProps}
+            sortable={false}
+            TrComponent={MovableRow}
+            sorted={this.sorted}
+            expanded={expanded}
+            resized={this.resized}
+            onResizedChange={this.props.onResizedChange}
+            // if it has a child, render another table with the children
+            SubComponent={!hasCollectionChild ? undefined : row => (row.original.type !== DocumentType.COL) ? (null) :
+                <div style={{ paddingLeft: 57 + "px" }} className="reactTable-sub"><SchemaTable {...this.props} Document={row.original} dataDoc={undefined} childDocs={undefined} /></div>}
+
+        />;
+    }
+
+    onContextMenu = (e: React.MouseEvent): void => {
+        ContextMenu.Instance.addItem({ description: "Toggle text wrapping", event: this.toggleTextwrap, icon: "table" });
+    }
+
+    getField = (row: number, col?: number) => {
+        const docs = this.childDocs;
+
+        row = row % docs.length;
+        while (row < 0) row += docs.length;
+        const columns = this.props.columns;
+        const doc = docs[row];
+        if (col === undefined) {
+            return doc;
+        }
+        if (col >= 0 && col < columns.length) {
+            const column = this.props.columns[col].heading;
+            return doc[column];
+        }
+        return undefined;
+    }
+
+    createTransformer = (row: number, col: number): Transformer => {
+        const self = this;
+        const captures: { [name: string]: Field } = {};
+
+        const transformer: ts.TransformerFactory<ts.SourceFile> = context => {
+            return root => {
+                function visit(node: ts.Node) {
+                    node = ts.visitEachChild(node, visit, context);
+                    if (ts.isIdentifier(node)) {
+                        const isntPropAccess = !ts.isPropertyAccessExpression(node.parent) || node.parent.expression === node;
+                        const isntPropAssign = !ts.isPropertyAssignment(node.parent) || node.parent.name !== node;
+                        if (isntPropAccess && isntPropAssign) {
+                            if (node.text === "$r") {
+                                return ts.createNumericLiteral(row.toString());
+                            } else if (node.text === "$c") {
+                                return ts.createNumericLiteral(col.toString());
+                            } else if (node.text === "$") {
+                                if (ts.isCallExpression(node.parent)) {
+                                    // captures.doc = self.props.Document;
+                                    // captures.key = self.props.fieldKey;
+                                }
+                            }
+                        }
+                    }
+
+                    return node;
+                }
+                return ts.visitNode(root, visit);
+            };
+        };
+
+        // const getVars = () => {
+        //     return { capturedVariables: captures };
+        // };
+
+        return { transformer, /*getVars*/ };
+    }
+
+    setComputed = (script: string, doc: Doc, field: string, row: number, col: number): boolean => {
+        script =
+            `const $ = (row:number, col?:number) => {
+                const rval = (doc as any)[key][row + ${row}];
+                return col === undefined ? rval : rval[(doc as any)._schemaHeaders[col + ${col}].heading];
+            }
+            return ${script}`;
+        const compiled = CompileScript(script, { params: { this: Doc.name }, capturedVariables: { doc: this.props.Document, key: this.props.fieldKey }, typecheck: false, transformer: this.createTransformer(row, col) });
+        if (compiled.compiled) {
+            doc[field] = new ComputedField(compiled);
+            return true;
+        }
+        return false;
+    }
+
+    @action
+    showDoc = (doc: Doc | undefined, dataDoc?: Doc, screenX?: number, screenY?: number) => {
+        this._showDoc = doc;
+        if (dataDoc && screenX && screenY) {
+            this._showDocPos = this.props.ScreenToLocalTransform().transformPoint(screenX, screenY);
+        }
+    }
+
+    onOpenClick = () => {
+        this._showDoc && this.props.addDocTab(this._showDoc, "add:right");
+    }
+
+    getPreviewTransform = (): Transform => {
+        return this.props.ScreenToLocalTransform().translate(- this.borderWidth - 4 - this.tableWidth, - this.borderWidth);
+    }
+
+    render() {
+        const preview = "";
+        return <div className="collectionSchemaView-table"
+            onPointerDown={this.props.onPointerDown} onClick={this.props.onClick} onWheel={e => this.props.active(true) && e.stopPropagation()}
+            onDrop={e => this.props.onDrop(e, {})} onContextMenu={this.onContextMenu} >
+            {this.reactTable}
+            {this.props.Document._chromeHidden ? undefined : <div className="collectionSchemaView-addRow" onClick={this.createRow}>+ new</div>}
+            {!this._showDoc ? (null) :
+                <div className="collectionSchemaView-documentPreview" ref="overlay"
+                    style={{
+                        position: "absolute", width: 150, height: 150,
+                        background: "dimGray", display: "block", top: 0, left: 0,
+                        transform: `translate(${this._showDocPos[0]}px, ${this._showDocPos[1] - 180}px)`
+                    }} >
+                    <DocumentView
+                        Document={this._showDoc}
+                        DataDoc={this._showDataDoc}
+                        styleProvider={DefaultStyleProvider}
+                        layerProvider={undefined}
+                        docViewPath={returnEmptyDoclist}
+                        freezeDimensions={true}
+                        focus={DocUtils.DefaultFocus}
+                        renderDepth={this.props.renderDepth}
+                        rootSelected={returnFalse}
+                        isContentActive={returnTrue}
+                        isDocumentActive={returnFalse}
+                        PanelWidth={() => 150}
+                        PanelHeight={() => 150}
+                        ScreenToLocalTransform={this.getPreviewTransform}
+                        docFilters={returnEmptyFilter}
+                        docRangeFilters={returnEmptyFilter}
+                        searchFilterDocs={returnEmptyDoclist}
+                        ContainingCollectionDoc={this.props.CollectionView?.props.Document}
+                        ContainingCollectionView={this.props.CollectionView}
+                        moveDocument={this.props.moveDocument}
+                        whenChildContentsActiveChanged={emptyFunction}
+                        addDocTab={this.props.addDocTab}
+                        pinToPres={this.props.pinToPres}
+                        bringToFront={returnFalse}>
+                    </DocumentView>
+                </div>}
+        </div>;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx
index f0a54e4ac..ecf4c0901 100644
--- a/src/client/views/nodes/DocumentContentsView.tsx
+++ b/src/client/views/nodes/DocumentContentsView.tsx
@@ -8,7 +8,7 @@ import { emptyPath, OmitKeys, Without } from "../../../Utils";
 import { DirectoryImportBox } from "../../util/Import & Export/DirectoryImportBox";
 import { CollectionDockingView } from "../collections/CollectionDockingView";
 import { CollectionFreeFormView } from "../collections/collectionFreeForm/CollectionFreeFormView";
-import { CollectionSchemaView } from "../collections/CollectionSchemaView";
+import { CollectionSchemaView } from "../collections/schemaView/CollectionSchemaView";
 import { CollectionView } from "../collections/CollectionView";
 import { InkingStroke } from "../InkingStroke";
 import { PresElementBox } from "../presentationview/PresElementBox";
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 5c168d8a9..a671c955d 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -18,7 +18,7 @@ import { SetupDrag } from '../../util/DragManager';
 import { SearchUtil } from '../../util/SearchUtil';
 import { Transform } from '../../util/Transform';
 import { CollectionDockingView } from "../collections/CollectionDockingView";
-import { CollectionSchemaView, ColumnType } from "../collections/CollectionSchemaView";
+import { CollectionSchemaView, ColumnType } from "../collections/schemaView/CollectionSchemaView";
 import { CollectionViewType } from '../collections/CollectionView';
 import { ViewBoxBaseComponent } from "../DocComponent";
 import { FieldView, FieldViewProps } from '../nodes/FieldView';
@@ -119,7 +119,7 @@ export class SearchBox extends ViewBoxBaseComponent<FieldViewProps, SearchBoxDoc
 
     getFinalQuery(query: string): string {
         //alters the query so it looks in the correct fields
-        //if this is true, th`en not all of the field boxes are checked
+        //if this is true, then not all of the field boxes are checked
         //TODO: data
         const initialfilters = Cast(this.props.Document._docFilters, listSpec("string"), []);
 
diff --git a/src/fields/SchemaHeaderField.ts b/src/fields/SchemaHeaderField.ts
index 88de3a19f..74cf934f2 100644
--- a/src/fields/SchemaHeaderField.ts
+++ b/src/fields/SchemaHeaderField.ts
@@ -3,7 +3,7 @@ import { serializable, primitive } from "serializr";
 import { ObjectField } from "./ObjectField";
 import { Copy, ToScriptString, ToString, OnUpdate } from "./FieldSymbols";
 import { scriptingGlobal } from "../client/util/Scripting";
-import { ColumnType } from "../client/views/collections/CollectionSchemaView";
+import { ColumnType } from "../client/views/collections/schemaView/CollectionSchemaView";
 
 export const PastelSchemaPalette = new Map<string, string>([
     // ["pink1", "#FFB4E8"],
-- 
cgit v1.2.3-70-g09d2


From 7995c8b9b810df4ed5ade1db71fcb0e2de3d3da2 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 14 Jul 2021 09:47:18 -0400
Subject: fixed selections so that they persist on deselect to allow linking a
 selection on one document directly to a selection on another document.   Also
 fixed recently closed to move closed document to top of list.

---
 src/client/views/DocComponent.tsx     |  5 ++++-
 src/client/views/MarqueeAnnotator.tsx | 23 ++++++++++++-----------
 src/client/views/nodes/ImageBox.tsx   | 15 ++++++++++++---
 src/client/views/nodes/WebBox.tsx     |  2 +-
 src/client/views/pdf/AnchorMenu.tsx   |  4 ++--
 5 files changed, 31 insertions(+), 18 deletions(-)

(limited to 'src')

diff --git a/src/client/views/DocComponent.tsx b/src/client/views/DocComponent.tsx
index a878a7afb..0b54e3cd6 100644
--- a/src/client/views/DocComponent.tsx
+++ b/src/client/views/DocComponent.tsx
@@ -154,7 +154,10 @@ export function ViewBoxAnnotatableComponent<P extends ViewBoxAnnotatableProps, T
                         leavePushpin && DocUtils.LeavePushpin(doc, annotationKey ?? this.annotationKey);
                         Doc.RemoveDocFromList(targetDataDoc, annotationKey ?? this.annotationKey, doc);
                         doc.context = undefined;
-                        recent && Doc.AddDocToList(recent, "data", doc, undefined, true, true);
+                        if (recent) {
+                            Doc.RemoveDocFromList(recent, "data", doc);
+                            Doc.AddDocToList(recent, "data", doc, undefined, true, true);
+                        }
                     });
                     this.props.select(false);
                     return true;
diff --git a/src/client/views/MarqueeAnnotator.tsx b/src/client/views/MarqueeAnnotator.tsx
index b5df7b79b..717bd0768 100644
--- a/src/client/views/MarqueeAnnotator.tsx
+++ b/src/client/views/MarqueeAnnotator.tsx
@@ -67,7 +67,7 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
 
         AnchorMenu.Instance.OnClick = (e: PointerEvent) => this.props.anchorMenuClick?.()?.(this.highlight("rgba(173, 216, 230, 0.75)", true));
         AnchorMenu.Instance.Highlight = this.highlight;
-        AnchorMenu.Instance.GetAnchor = () => this.highlight("rgba(173, 216, 230, 0.75)", true);
+        AnchorMenu.Instance.GetAnchor = (savedAnnotations?: ObservableMap<number, HTMLDivElement[]>) => this.highlight("rgba(173, 216, 230, 0.75)", true, savedAnnotations);
         /**
          * This function is used by the AnchorMenu to create an anchor highlight and a new linked text annotation.  
          * It also initiates a Drag/Drop interaction to place the text annotation.
@@ -102,12 +102,13 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
 
     @undoBatch
     @action
-    makeAnnotationDocument = (color: string, isLinkButton?: boolean): Opt<Doc> => {
-        if (this.props.savedAnnotations.size === 0) return undefined;
-        const savedAnnos = Array.from(this.props.savedAnnotations.values())[0];
+    makeAnnotationDocument = (color: string, isLinkButton?: boolean, savedAnnotations?: ObservableMap<number, HTMLDivElement[]>): Opt<Doc> => {
+        const savedAnnoMap = savedAnnotations ?? this.props.savedAnnotations;
+        if (savedAnnoMap.size === 0) return undefined;
+        const savedAnnos = Array.from(savedAnnoMap.values())[0];
         if (savedAnnos.length && (savedAnnos[0] as any).marqueeing) {
             const scale = this.props.scaling?.() || 1;
-            const anno = Array.from(this.props.savedAnnotations.values())[0][0];
+            const anno = savedAnnos[0];
             const containerOffset = this.props.containerOffset?.() || [0, 0];
             const marqueeAnno = Docs.Create.FreeformDocument([], { _isLinkButton: isLinkButton, backgroundColor: color, annotationOn: this.props.rootDoc, title: "Annotation on " + this.props.rootDoc.title });
             marqueeAnno.x = (parseInt(anno.style.left || "0") - containerOffset[0]) / scale;
@@ -115,7 +116,7 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
             marqueeAnno._height = parseInt(anno.style.height || "0") / scale;
             marqueeAnno._width = parseInt(anno.style.width || "0") / scale;
             anno.remove();
-            this.props.savedAnnotations.clear();
+            savedAnnoMap.clear();
             return marqueeAnno;
         }
 
@@ -123,7 +124,7 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
         let maxX = -Number.MAX_VALUE;
         let minY = Number.MAX_VALUE;
         const annoDocs: Doc[] = [];
-        this.props.savedAnnotations.forEach((value: HTMLDivElement[], key: number) => value.map(anno => {
+        savedAnnoMap.forEach((value: HTMLDivElement[], key: number) => value.map(anno => {
             const textRegion = new Doc();
             textRegion.x = parseInt(anno.style.left ?? "0");
             textRegion.y = parseInt(anno.style.top ?? "0");
@@ -142,15 +143,15 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
         textRegionAnnoProto.x = Math.max(maxX, 0);
         // mainAnnoDocProto.text = this._selectionText;
         textRegionAnnoProto.textInlineAnnotations = new List<Doc>(annoDocs);
-        this.props.savedAnnotations.clear();
+        savedAnnoMap.clear();
         return textRegionAnno;
     }
     @action
-    highlight = (color: string, isLinkButton: boolean) => {
+    highlight = (color: string, isLinkButton: boolean, savedAnnotations?: ObservableMap<number, HTMLDivElement[]>) => {
         // creates annotation documents for current highlights
         const effectiveAcl = GetEffectiveAcl(this.props.rootDoc[DataSym]);
-        const annotationDoc = [AclAddonly, AclEdit, AclAdmin].includes(effectiveAcl) && this.makeAnnotationDocument(color, isLinkButton);
-        annotationDoc && this.props.addDocument(annotationDoc);
+        const annotationDoc = [AclAddonly, AclEdit, AclAdmin].includes(effectiveAcl) && this.makeAnnotationDocument(color, isLinkButton, savedAnnotations);
+        !savedAnnotations && annotationDoc && this.props.addDocument(annotationDoc);
         return annotationDoc as Doc ?? undefined;
     }
 
diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx
index 13dfad0fe..b803c94ba 100644
--- a/src/client/views/nodes/ImageBox.tsx
+++ b/src/client/views/nodes/ImageBox.tsx
@@ -7,7 +7,7 @@ import { List } from '../../../fields/List';
 import { ObjectField } from '../../../fields/ObjectField';
 import { createSchema, makeInterface } from '../../../fields/Schema';
 import { ComputedField } from '../../../fields/ScriptField';
-import { Cast, NumCast } from '../../../fields/Types';
+import { Cast, NumCast, StrCast } from '../../../fields/Types';
 import { ImageField } from '../../../fields/URLField';
 import { TraceMobx } from '../../../fields/util';
 import { emptyFunction, OmitKeys, returnOne, Utils } from '../../../Utils';
@@ -28,6 +28,8 @@ import "./ImageBox.scss";
 import React = require("react");
 import { InkTool } from '../../../fields/InkField';
 import { CurrentUserUtils } from '../../util/CurrentUserUtils';
+import { AnchorMenu } from '../pdf/AnchorMenu';
+import { Docs } from '../../documents/Documents';
 const path = require('path');
 
 export const pageSchema = createSchema({
@@ -62,6 +64,13 @@ export class ImageBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
 
     } // sets viewing information for a componentview, typically when following a link. 'preview' tells the view to use the values without writing to the document
 
+
+    getAnchor = () => {
+        const anchor = AnchorMenu.Instance?.GetAnchor(this._savedAnnotations);
+        anchor && this.addDocument(anchor);
+        return anchor ?? this.rootDoc;
+    }
+
     componentDidMount() {
         this.props.setContentView?.(this); // bcz: do not remove this.  without it, stepping into an image in the lightbox causes an infinite loop....
         this._disposers.sizer = reaction(() => (
@@ -74,8 +83,8 @@ export class ImageBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
             { fireImmediately: true, delay: 1000 });
         this._disposers.selection = reaction(() => this.props.isSelected(),
             selected => !selected && setTimeout(() => {
-                Array.from(this._savedAnnotations.values()).forEach(v => v.forEach(a => a.remove()));
-                this._savedAnnotations.clear();
+                // Array.from(this._savedAnnotations.values()).forEach(v => v.forEach(a => a.remove()));
+                // this._savedAnnotations.clear();
             }));
         this._disposers.path = reaction(() => ({ nativeSize: this.nativeSize, width: this.layoutDoc[WidthSym]() }),
             ({ nativeSize, width }) => {
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index a16881b66..5791e2310 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -176,7 +176,7 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
 
     getAnchor = () => {
         const anchor =
-            AnchorMenu.Instance?.GetAnchor() ??
+            AnchorMenu.Instance?.GetAnchor(this._savedAnnotations) ??
             Docs.Create.TextanchorDocument({
                 title: StrCast(this.rootDoc.title + " " + this.layoutDoc._scrollTop),
                 annotationOn: this.rootDoc,
diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx
index 86b124de5..c24c4eaaf 100644
--- a/src/client/views/pdf/AnchorMenu.tsx
+++ b/src/client/views/pdf/AnchorMenu.tsx
@@ -1,7 +1,7 @@
 import React = require("react");
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { Tooltip } from "@material-ui/core";
-import { action, computed, observable, IReactionDisposer, reaction } from "mobx";
+import { action, computed, observable, IReactionDisposer, reaction, ObservableMap } from "mobx";
 import { observer } from "mobx-react";
 import { ColorState } from "react-color";
 import { Doc, Opt } from "../../../fields/Doc";
@@ -46,7 +46,7 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
     public OnClick: (e: PointerEvent) => void = unimplementedFunction;
     public StartDrag: (e: PointerEvent, ele: HTMLElement) => void = unimplementedFunction;
     public Highlight: (color: string, isPushpin: boolean) => Opt<Doc> = (color: string, isPushpin: boolean) => undefined;
-    public GetAnchor: () => Opt<Doc> = () => undefined;
+    public GetAnchor: (savedAnnotations?: ObservableMap<number, HTMLDivElement[]>) => Opt<Doc> = () => undefined;
     public Delete: () => void = unimplementedFunction;
     public AddTag: (key: string, value: string) => boolean = returnFalse;
     public PinToPres: () => void = unimplementedFunction;
-- 
cgit v1.2.3-70-g09d2


From a9459901be6ed608fef28d4703072aa594748f84 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 14 Jul 2021 11:19:51 -0400
Subject: fixed dropping onto filesystem view to drop document into specific
 location/folder instead of hanging.

---
 src/client/documents/Documents.ts                  | 18 ++++++------
 src/client/views/collections/CollectionSubView.tsx | 20 +++++++------
 .../views/collections/CollectionTreeView.tsx       |  2 +-
 src/client/views/collections/TreeView.tsx          | 33 ++++++++++++++++------
 4 files changed, 45 insertions(+), 28 deletions(-)

(limited to 'src')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 24682cbd0..040571b10 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -1329,16 +1329,14 @@ export namespace DocUtils {
                 d._timecodeToShow = undefined;  // bcz: this should be automatic somehow.. along with any other properties that were logically associated with the original collection
             });
         });
-        if (x !== undefined && y !== undefined) {
-            const newCollection = Docs.Create.PileDocument(docList, { title: "pileup", x: x - 55, y: y - 55, _width: 110, _height: 100, _overflow: "visible" });
-            newCollection.x = NumCast(newCollection.x) + NumCast(newCollection._width) / 2 - 55;
-            newCollection.y = NumCast(newCollection.y) + NumCast(newCollection._height) / 2 - 55;
-            newCollection._width = newCollection._height = 110;
-            //newCollection.borderRounding = "40px";
-            newCollection._jitterRotation = 10;
-            newCollection._backgroundColor = "gray";
-            return newCollection;
-        }
+        const newCollection = Docs.Create.PileDocument(docList, { title: "pileup", x: (x || 0) - 55, y: (y || 0) - 55, _width: 110, _height: 100, _overflow: "visible" });
+        newCollection.x = NumCast(newCollection.x) + NumCast(newCollection._width) / 2 - 55;
+        newCollection.y = NumCast(newCollection.y) + NumCast(newCollection._height) / 2 - 55;
+        newCollection._width = newCollection._height = 110;
+        //newCollection.borderRounding = "40px";
+        newCollection._jitterRotation = 10;
+        newCollection._backgroundColor = "gray";
+        return newCollection;
     }
 
     export function LeavePushpin(doc: Doc, annotationField: string) {
diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx
index 8d549bd56..ca45536f4 100644
--- a/src/client/views/collections/CollectionSubView.tsx
+++ b/src/client/views/collections/CollectionSubView.tsx
@@ -241,7 +241,7 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
 
         @undoBatch
         @action
-        protected async onExternalDrop(e: React.DragEvent, options: DocumentOptions, completed?: () => void) {
+        protected async onExternalDrop(e: React.DragEvent, options: DocumentOptions, completed?: (docs: Doc[]) => void) {
             if (e.ctrlKey) {
                 e.stopPropagation(); // bcz: this is a hack to stop propagation when dropping an image on a text document with shift+ctrl
                 return;
@@ -439,7 +439,7 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
             }
             this.slowLoadDocuments(files, options, generatedDocuments, text, completed, e.clientX, e.clientY, addDocument).then(batch.end);
         }
-        slowLoadDocuments = async (files: (File[] | string), options: DocumentOptions, generatedDocuments: Doc[], text: string, completed: (() => void) | undefined, clientX: number, clientY: number, addDocument: (doc: Doc | Doc[]) => boolean) => {
+        slowLoadDocuments = async (files: (File[] | string), options: DocumentOptions, generatedDocuments: Doc[], text: string, completed: ((doc: Doc[]) => void) | undefined, clientX: number, clientY: number, addDocument: (doc: Doc | Doc[]) => boolean) => {
             const disposer = OverlayView.Instance.addElement(
                 <ReactLoading type={"spinningBubbles"} color={"green"} height={250} width={250} />, { x: clientX - 125, y: clientY - 125 });
             if (typeof files === "string") {
@@ -448,13 +448,17 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
                 generatedDocuments.push(...await DocUtils.uploadFilesToDocs(files, options));
             }
             if (generatedDocuments.length) {
-                const set = generatedDocuments.length > 1 && generatedDocuments.map(d => DocUtils.iconify(d));
-                if (set) {
-                    addDocument(DocUtils.pileup(generatedDocuments, options.x!, options.y!)!);
-                } else {
-                    generatedDocuments.forEach(addDocument);
+                const isFreeformView = this.props.Document._viewType === CollectionViewType.Freeform;
+                const set = !isFreeformView ? generatedDocuments :
+                    generatedDocuments.length > 1 ? generatedDocuments.map(d => { DocUtils.iconify(d); return d; }) : [];
+                if (completed) completed(set);
+                else {
+                    if (isFreeformView) {
+                        addDocument(DocUtils.pileup(generatedDocuments, options.x!, options.y!)!);
+                    } else {
+                        generatedDocuments.forEach(addDocument);
+                    }
                 }
-                completed?.();
             } else {
                 if (text && !text.includes("https://")) {
                     addDocument(Docs.Create.TextDocument(text, { ...options, title: text.substring(0, 20), _width: 400, _height: 315 }));
diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx
index 82c8a9114..3eece0086 100644
--- a/src/client/views/collections/CollectionTreeView.tsx
+++ b/src/client/views/collections/CollectionTreeView.tsx
@@ -154,7 +154,7 @@ export class CollectionTreeView extends CollectionSubView<Document, Partial<coll
             !existingOnClick && ContextMenu.Instance.addItem({ description: "OnClick...", noexpand: true, subitems: onClicks, icon: "mouse-pointer" });
         }
     }
-    onTreeDrop = (e: React.DragEvent) => this.onExternalDrop(e, {});
+    onTreeDrop = (e: React.DragEvent, addDocs?: (docs: Doc[]) => void) => this.onExternalDrop(e, {}, addDocs);
 
     @undoBatch
     makeTextCollection = (childDocs: Doc[]) => {
diff --git a/src/client/views/collections/TreeView.tsx b/src/client/views/collections/TreeView.tsx
index 2e98fb508..c1125c233 100644
--- a/src/client/views/collections/TreeView.tsx
+++ b/src/client/views/collections/TreeView.tsx
@@ -261,15 +261,19 @@ export class TreeView extends React.Component<TreeViewProps> {
         if (docDragData) {
             e.stopPropagation();
             if (docDragData.draggedDocuments[0] === this.doc) return true;
-            const parentAddDoc = (doc: Doc | Doc[]) => this.props.addDocument(doc, undefined, before);
-            const canAdd = !StrCast((inside ? this.props.document : this.props.containerCollection)?.freezeChildren).includes("add") || docDragData.treeViewDoc === this.props.treeView.props.Document;
-            const localAdd = (doc: Doc) => Doc.AddDocToList(this.dataDoc, this.fieldKey, doc) && ((doc.context = this.doc.context) || true) ? true : false;
-            const addDoc = !inside ? parentAddDoc :
-                (doc: Doc | Doc[]) => (doc instanceof Doc ? [doc] : doc).reduce((flg, doc) => flg && localAdd(doc), true as boolean);
-            const move = (!docDragData.dropAction || docDragData.dropAction === "proto" || docDragData.dropAction === "move" || docDragData.dropAction === "same") && docDragData.moveDocument;
-            if (canAdd) {
-                UndoManager.RunInTempBatch(() => docDragData.droppedDocuments.reduce((added, d) => (move ? move(d, undefined, addDoc) || (docDragData.dropAction === "proto" ? addDoc(d) : false) : addDoc(d)) || added, false));
-            }
+            this.dropDocuments(docDragData.droppedDocuments, before, inside, docDragData.dropAction, docDragData.moveDocument, docDragData.treeViewDoc === this.props.treeView.props.Document);
+        }
+    }
+
+    dropDocuments(droppedDocuments: Doc[], before: boolean, inside: number | boolean, dropAction: dropActionType, moveDocument: DragManager.MoveFunction | undefined, forceAdd: boolean) {
+        const parentAddDoc = (doc: Doc | Doc[]) => this.props.addDocument(doc, undefined, before);
+        const canAdd = !StrCast((inside ? this.props.document : this.props.containerCollection)?.freezeChildren).includes("add") || forceAdd;
+        const localAdd = (doc: Doc) => Doc.AddDocToList(this.dataDoc, this.fieldKey, doc) && ((doc.context = this.doc.context) || true) ? true : false;
+        const addDoc = !inside ? parentAddDoc :
+            (doc: Doc | Doc[]) => (doc instanceof Doc ? [doc] : doc).reduce((flg, doc) => flg && localAdd(doc), true as boolean);
+        const move = (!dropAction || dropAction === "proto" || dropAction === "move" || dropAction === "same") && moveDocument;
+        if (canAdd) {
+            UndoManager.RunInTempBatch(() => droppedDocuments.reduce((added, d) => (move ? move(d, undefined, addDoc) || (dropAction === "proto" ? addDoc(d) : false) : addDoc(d)) || added, false));
         }
     }
 
@@ -727,12 +731,23 @@ export class TreeView extends React.Component<TreeViewProps> {
         </div>;
     }
 
+    onTreeDrop = (de: React.DragEvent) => {
+        const pt = [de.clientX, de.clientY];
+        const rect = this._header.current!.getBoundingClientRect();
+        const before = pt[1] < rect.top + rect.height / 2;
+        const inside = this.props.treeView.fileSysMode && !this.doc.isFolder ? false : pt[0] > Math.min(rect.left + 75, rect.left + rect.width * .75) || (!before && this.treeViewOpen && this.childDocList.length);
+
+        const docs = this.props.treeView.onTreeDrop(de, (docs: Doc[]) => this.dropDocuments(docs, before, inside, "copy", undefined, false));
+    }
+
     render() {
         TraceMobx();
         const hideTitle = this.doc.treeViewHideHeader || this.props.treeView.outlineMode;
         return this.props.renderedIds.indexOf(this.doc[Id]) !== -1 ? "<" + this.doc.title + ">" : // just print the title of documents we've previously rendered in this hierarchical path to avoid cycles
             <div className={`treeView-container${this.props.isContentActive() ? "-active" : ""}`}
                 ref={this.createTreeDropTarget}
+
+                onDrop={this.onTreeDrop}
                 //onPointerDown={e => this.props.isContentActive(true) && SelectionManager.DeselectAll()} // bcz: this breaks entering a text filter in a filterBox since it deselects the filter's target document
                 onKeyDown={this.onKeyDown}>
                 <li className="collection-child">
-- 
cgit v1.2.3-70-g09d2


From 6b5c40fda530337f3dcb70aa640b085d0d4f1adf Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 14 Jul 2021 13:47:46 -0400
Subject: fixed dragging marquees on nested images.  fixed images to allow
 marquees on nested images.  changed drag titlebar message.

---
 src/client/util/DragManager.ts       |  2 +-
 src/client/views/GlobalKeyHandler.ts |  2 --
 src/client/views/nodes/ImageBox.tsx  | 15 +++++++++------
 src/client/views/nodes/WebBox.tsx    |  8 ++++----
 4 files changed, 14 insertions(+), 13 deletions(-)

(limited to 'src')

diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index d8c2f913e..88bf6f36d 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -340,7 +340,7 @@ export namespace DragManager {
             dragLabel.style.zIndex = "100001";
             dragLabel.style.fontSize = "10px";
             dragLabel.style.position = "absolute";
-            dragLabel.innerText = "press 'a' to embed on drop"; // bcz: need to move this to a status bar
+            dragLabel.innerText = "drag titlebar to embed on drop"; // bcz: need to move this to a status bar
             dragDiv.appendChild(dragLabel);
             DragManager.Root().appendChild(dragDiv);
         }
diff --git a/src/client/views/GlobalKeyHandler.ts b/src/client/views/GlobalKeyHandler.ts
index cbaa706e0..c4162a6bb 100644
--- a/src/client/views/GlobalKeyHandler.ts
+++ b/src/client/views/GlobalKeyHandler.ts
@@ -89,8 +89,6 @@ export class KeyManager {
 
     private unmodified = action((keyname: string, e: KeyboardEvent) => {
         switch (keyname) {
-            case "a": SnappingManager.GetIsDragging() && (DragManager.CanEmbed = true);
-                break;
             case "u":
                 if (document.activeElement?.tagName === "INPUT" || document.activeElement?.tagName === "TEXTAREA") {
                     return { stopPropagation: false, preventDefault: false };
diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx
index b803c94ba..6f249d27d 100644
--- a/src/client/views/nodes/ImageBox.tsx
+++ b/src/client/views/nodes/ImageBox.tsx
@@ -10,7 +10,7 @@ import { ComputedField } from '../../../fields/ScriptField';
 import { Cast, NumCast, StrCast } from '../../../fields/Types';
 import { ImageField } from '../../../fields/URLField';
 import { TraceMobx } from '../../../fields/util';
-import { emptyFunction, OmitKeys, returnOne, Utils } from '../../../Utils';
+import { emptyFunction, OmitKeys, returnOne, Utils, returnFalse } from '../../../Utils';
 import { GooglePhotos } from '../../apis/google_docs/GooglePhotosClientUtils';
 import { CognitiveServices, Confidence, Service, Tag } from '../../cognitive_services/CognitiveServices';
 import { Networking } from '../../Network';
@@ -332,12 +332,15 @@ export class ImageBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
     }
     @action
     marqueeDown = (e: React.PointerEvent) => {
-        if (!e.altKey && e.button === 0 && this.layoutDoc._viewScale === 1 && this.isContentActive(true) && ![InkTool.Highlighter, InkTool.Pen].includes(CurrentUserUtils.SelectedTool)) this._marqueeing = [e.clientX, e.clientY];
+        if (!e.altKey && e.button === 0 && this.layoutDoc._viewScale === 1 && this.isContentActive(true) && ![InkTool.Highlighter, InkTool.Pen].includes(CurrentUserUtils.SelectedTool)) {
+            this._marqueeing = [e.clientX, e.clientY];
+            e.stopPropagation();
+        }
     }
     @action
     finishMarquee = () => {
         this._marqueeing = undefined;
-        this.props.select(true);
+        this.props.select(false);
     }
 
     render() {
@@ -353,16 +356,16 @@ export class ImageBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
             }} >
             <CollectionFreeFormView {...OmitKeys(this.props, ["NativeWidth", "NativeHeight", "setContentView"]).omit}
                 renderDepth={this.props.renderDepth + 1}
+                isAnnotationOverlay={true}
                 fieldKey={this.annotationKey}
                 CollectionView={undefined}
-                isAnnotationOverlay={true}
                 annotationLayerHostsContent={true}
                 PanelWidth={this.props.PanelWidth}
                 PanelHeight={this.props.PanelHeight}
                 ScreenToLocalTransform={this.screenToLocalTransform}
-                select={emptyFunction}
-                isContentActive={this.isContentActive}
                 scaling={returnOne}
+                select={emptyFunction}
+                isContentActive={returnFalse}
                 whenChildContentsActiveChanged={this.whenChildContentsActiveChanged}
                 removeDocument={this.removeDocument}
                 moveDocument={this.moveDocument}
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index 5791e2310..88e38712a 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -508,11 +508,15 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
                         }}>
                             {this.content}
                             <CollectionFreeFormView {...OmitKeys(this.props, ["NativeWidth", "NativeHeight", "setContentView"]).omit}
+                                renderDepth={this.props.renderDepth + 1}
                                 isAnnotationOverlay={true}
                                 fieldKey={this.annotationKey}
+                                CollectionView={undefined}
                                 setPreviewCursor={this.setPreviewCursor}
                                 PanelWidth={this.panelWidth}
                                 PanelHeight={this.panelHeight}
+                                ScreenToLocalTransform={this.scrollXf}
+                                scaling={returnOne}
                                 dropAction={"alias"}
                                 select={emptyFunction}
                                 isContentActive={returnFalse}
@@ -522,10 +526,6 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
                                 removeDocument={this.removeDocument}
                                 moveDocument={this.moveDocument}
                                 addDocument={this.sidebarAddDocument}
-                                CollectionView={undefined}
-                                ScreenToLocalTransform={this.scrollXf}
-                                renderDepth={this.props.renderDepth + 1}
-                                scaling={returnOne}
                                 childPointerEvents={true}
                                 pointerEvents={this._isAnnotating || SnappingManager.GetIsDragging() ? "all" : "none"} />
                             {this.annotationLayer}
-- 
cgit v1.2.3-70-g09d2


From 0400d09d8fc52e5c5ded50d9b8c0dfab400fd111 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 14 Jul 2021 14:25:48 -0400
Subject: from last

---
 src/client/views/nodes/ImageBox.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx
index 6f249d27d..d876ae818 100644
--- a/src/client/views/nodes/ImageBox.tsx
+++ b/src/client/views/nodes/ImageBox.tsx
@@ -340,7 +340,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
     @action
     finishMarquee = () => {
         this._marqueeing = undefined;
-        this.props.select(false);
+        this.props.select(false)
     }
 
     render() {
@@ -365,7 +365,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
                 ScreenToLocalTransform={this.screenToLocalTransform}
                 scaling={returnOne}
                 select={emptyFunction}
-                isContentActive={returnFalse}
+                isContentActive={this.isContentActive}
                 whenChildContentsActiveChanged={this.whenChildContentsActiveChanged}
                 removeDocument={this.removeDocument}
                 moveDocument={this.moveDocument}
-- 
cgit v1.2.3-70-g09d2


From 48620bbe25f92eb179d53846aae5f0164ca6f1c2 Mon Sep 17 00:00:00 2001
From: vkalev <vjk1883@gmail.com>
Date: Thu, 15 Jul 2021 01:27:43 -0500
Subject: adding new point creates tangent handle lines + snapping handle
 tangents not working

---
 src/client/views/InkControls.tsx        |  12 ++-
 src/client/views/InkHandles.tsx         |   1 -
 src/client/views/InkStrokeProperties.ts | 170 +++++++++++++++++++++-----------
 src/fields/InkField.ts                  |   3 -
 4 files changed, 121 insertions(+), 65 deletions(-)

(limited to 'src')

diff --git a/src/client/views/InkControls.tsx b/src/client/views/InkControls.tsx
index 4d8b2c6b5..da7b0df16 100644
--- a/src/client/views/InkControls.tsx
+++ b/src/client/views/InkControls.tsx
@@ -30,12 +30,18 @@ export class InkControls extends React.Component<InkControlProps> {
             InkStrokeProperties.Instance.moveControl(0, 0, 1);
             const controlUndo = UndoManager.StartBatch("DocDecs set radius");
             const screenScale = this.props.ScreenToLocalTransform().Scale;
+            const order = controlIndex % 4;
+            const handleIndexA  = order === 2 ? controlIndex - 1 : controlIndex - 2;
+            const handleIndexB = order === 2 ? controlIndex + 2 : controlIndex + 1;
             setupMoveUpEvents(this, e,
                 (e: PointerEvent, down: number[], delta: number[]) => {
                     InkStrokeProperties.Instance?.moveControl(-delta[0] * screenScale, -delta[1] * screenScale, controlIndex);
                     return false;
                 },
-                () => controlUndo?.end(), emptyFunction);
+                () => controlUndo?.end(), action((e: PointerEvent, doubleTap: boolean | undefined) =>
+                { if (doubleTap && InkStrokeProperties.Instance?._brokenIndices.includes(controlIndex)) {
+                    InkStrokeProperties.Instance?.snapHandleTangent(controlIndex, handleIndexA, handleIndexB);
+                }}));
         }
     }
 
@@ -112,7 +118,9 @@ export class InkControls extends React.Component<InkControlProps> {
                             width={this._overControl === i ? strokeWidth * 1.5 : strokeWidth} 
                             strokeWidth={strokeWidth / 6} stroke="#1F85DE" 
                             fill={formatInstance?._currentPoint === control.I ? "#1F85DE" : "white"}
-                            onPointerDown={(e) => { this.changeCurrPoint(control.I); this.onControlDown(e, control.I); }} 
+                            onPointerDown={(e) => { 
+                                this.changeCurrPoint(control.I); 
+                                this.onControlDown(e, control.I); }} 
                             onMouseEnter={() => this.onEnterControl(i)} 
                             onMouseLeave={this.onLeaveControl} 
                             pointerEvents="all" 
diff --git a/src/client/views/InkHandles.tsx b/src/client/views/InkHandles.tsx
index a33380221..ba3fdf9db 100644
--- a/src/client/views/InkHandles.tsx
+++ b/src/client/views/InkHandles.tsx
@@ -24,7 +24,6 @@ export class InkHandles extends React.Component<InkControlProps> {
             InkStrokeProperties.Instance.moveControl(0, 0, 1);
             const controlUndo = UndoManager.StartBatch("DocDecs set radius");
             const screenScale = this.props.ScreenToLocalTransform().Scale;
-
             const order = handleIndex % 4;
             const oppositeHandleIndex = order === 1 ? handleIndex - 3 : handleIndex + 3;
             const controlIndex = order === 1 ? handleIndex - 1 : handleIndex + 2;
diff --git a/src/client/views/InkStrokeProperties.ts b/src/client/views/InkStrokeProperties.ts
index 4ec03c560..a3f7562e0 100644
--- a/src/client/views/InkStrokeProperties.ts
+++ b/src/client/views/InkStrokeProperties.ts
@@ -71,70 +71,109 @@ export class InkStrokeProperties {
      */
     @undoBatch
     @action
-    addPoints = (x: number, y: number, pts: { X: number, Y: number }[], index: number, control: { X: number, Y: number }[]) => {
-        this.selectedInk?.forEach(action(inkView => {
-            if (this.selectedInk?.length === 1) {
-                const newPoint = { X: x, Y: y };
-                const doc = Document(inkView.rootDoc);
-                if (doc.type === DocumentType.INK) {
-                    const ink = Cast(doc.data, InkField)?.inkData;
-                    if (ink) {
-                        const newPoints: { X: number, Y: number }[] = [];
-                        var counter = 0;
-                        for (var k = 0; k < index; k++) {
-                            control.forEach(pt => (pts[k].X === pt.X && pts[k].Y === pt.Y) && counter++);
-                        }
-                        //decide where to put the new coordinate
-                        const spNum = Math.floor(counter / 2) * 4 + 2;
-
-                        for (var i = 0; i < spNum; i++) {
-                            ink[i] && newPoints.push({ X: ink[i].X, Y: ink[i].Y });
-                        }
-
-                        // Updating the indices of the control points whose handle tangency has been broken.
-                        this._brokenIndices = this._brokenIndices.map((control) => { 
-                            if (control >= spNum) {
-                                return control + 4; 
-                            } else {
-                                return control;
+    addPoints = (x: number, y: number, points: InkData, index: number, controls: { X: number, Y: number }[]) => {
+        this.applyFunction((doc: Doc, ink: InkData) => {
+            const newControl = { X: x, Y: y };
+            const newPoints: InkData = [];
+            let [counter, start, end] = [0, 0, 0];
+            for (let k = 0; k < points.length; k++) {
+                if (end === 0) {
+                    controls.forEach((control) => {
+                        if (control.X === points[k].X && control.Y === points[k].Y) {
+                            if (k < index) {
+                                counter++;
+                                start = k;
+                            } else if (k > index) {
+                                end = k;
                             }
-                        });
-
-                        // const [handleA, handleB] = this.getNewHandlePoints(newPoint, pts[index-1], pts[index+1]);
-                        newPoints.push(newPoint);
-                        newPoints.push(newPoint);
-                        newPoints.push(newPoint);
-                        newPoints.push(newPoint);
-
-                        for (var i = spNum; i < ink.length; i++) {
-                            newPoints.push({ X: ink[i].X, Y: ink[i].Y });
-
                         }
-                        this._currentPoint = -1;
-                        Doc.GetProto(doc).data = new InkField(newPoints);
-                    }
+                    });
                 }
             }
-        }));
+            if (end === 0) end = points.length-1;
+            // Index of new control point with regards to the ink data.
+            const newIndex = Math.floor(counter / 2) * 4 + 2;
+            // Creating new ink data with new control point and handle points inputted.
+            for (let i = 0; i < ink.length; i++) {
+                if (i === newIndex) { 
+                    const [handleA, handleB] = this.getNewHandlePoints(points.slice(start, index+1), points.slice(index, end), newControl);
+                    newPoints.push(handleA, newControl, newControl, handleB);
+                    const [rightControl, rightHandle]  = [points[end], ink[i]];
+                    const scaledVector = this.getScaledHandlePoint(false, start, end, index, rightControl, rightHandle);
+                    rightHandle && newPoints.push({ X: rightControl.X - scaledVector.X, Y: rightControl.Y - scaledVector.Y });
+                } else if (i === newIndex - 1) {
+                    const [leftControl, leftHandle] = [points[start], ink[i]];
+                    const scaledVector = this.getScaledHandlePoint(true, start, end, index, leftControl, leftHandle);
+                    leftHandle && newPoints.push({ X: leftControl.X - scaledVector.X, Y: leftControl.Y - scaledVector.Y });
+                } else {
+                    ink[i] && newPoints.push({ X: ink[i].X, Y: ink[i].Y });
+                }
+                
+            }
+            // Updating the indices of the control points whose handle tangency has been broken.
+            this._brokenIndices = this._brokenIndices.map((control) => { 
+                if (control >= newIndex) {
+                    return control + 4; 
+                } else {
+                    return control;
+                }
+            });
+            this._currentPoint = -1;
+            return newPoints;
+        });
     }
 
-    getNewHandlePoints = (newControl: PointData, a: PointData, b: PointData) => {
-        // find midpoint between the left and right control point of new control
-        // rotate midpoint by +-pi/2 to get new handle points
-        // multiplying x-y coordinates of both by 10/L where L is its current magnitude
-        const angle = this.angleChange(a, b, newControl);
-        const midpoint = this.rotatePoint(a, newControl, angle/2);
-        // const handleA = this.rotatePoint(midpoint, newControl, -Math.PI/2);
-        // const handleB = this.rotatePoint(midpoint, newControl, -Math.PI/2);
-        const handleA = { X: midpoint.X + (20 * Math.cos(-Math.PI/2)), Y: midpoint.Y + (20 * Math.sin(-Math.PI/2)) };
-        const handleB = { X: midpoint.X + (20 * Math.cos(Math.PI/2)), Y: midpoint.Y + (20 * Math.sin(Math.PI/2)) };
+    /**
+     * Scales a handle point of a control point that is adjacent to a newly added one.
+     * @param isLeft Determines if the current control point is on the left or right side of the newly added one.
+     * @param start Beginning index of curve from the left control point to the newly added one.
+     * @param end Final index of curve from the newly added control point to its right neighbor.
+     */
+    getScaledHandlePoint(isLeft: boolean, start: number, end: number, index: number, control: PointData, handle: PointData) {
+        const prevSize = end - start;
+        const newSize = isLeft ? index - start : end - index;
+        const handleVector = { X: control.X - handle.X, Y: control.Y - handle.Y };
+        const scaledVector = { X: handleVector.X * (newSize / prevSize), Y: handleVector.Y * (newSize / prevSize) };
+        return scaledVector;
+    }
 
+    /**
+     * Determines the position of the handle points of a newly added control point by finding the
+     * tangent vectors to the split curve at the new control. Given the properties of Bézier curves,
+     * the tangent vector to a control point is equivalent to the first/last (depending on the direction
+     * of the curve) leg of the Bézier curve's derivative.
+     * (Source: https://pages.mtu.edu/~shene/COURSES/cs3621/NOTES/spline/Bezier/bezier-der.html)
+     * 
+     * @param C The curve represented by all points from the previous control until the newly added point.
+     * @param D The curve represented by all points from the newly added point to the next control.
+     * @param newControl The newly added control point.
+     */
+    getNewHandlePoints = (C: PointData[], D: PointData[], newControl: PointData) => {
+        const [m, n] = [C.length, D.length];
+        let handleSizeA = Math.sqrt((Math.pow(newControl.X - C[0].X, 2)) + (Math.pow(newControl.Y - C[0].Y, 2)));
+        let handleSizeB = Math.sqrt((Math.pow(D[n-1].X - newControl.X, 2)) + (Math.pow(D[n-1].Y - newControl.Y, 2)));
+        if (handleSizeA < 75 && handleSizeB < 75) {
+            handleSizeA *= 3;
+            handleSizeB *= 3;
+        }
+        if (Math.abs(handleSizeA - handleSizeB) < 50) {
+            handleSizeA *= 5;
+            handleSizeB *= 5;
+        } else if (Math.abs(handleSizeA - handleSizeB) < 150) {
+            handleSizeA *= 2;
+            handleSizeB *= 2;
+        }
+        // Finding the last leg of the derivative curve of C.
+        const dC = { X: (handleSizeA / n) * (C[m-1].X - C[m-2].X), Y: (handleSizeA / n) * (C[m-1].Y - C[m-2].Y) };
+        // Finding the first leg of the derivative curve of D. 
+        const dD = { X: (handleSizeB / m) * (D[1].X - D[0].X), Y: (handleSizeB / m) * (D[1].Y - D[0].Y) };
+        const handleA = { X: newControl.X - dC.X, Y: newControl.Y - dC.Y };
+        const handleB = { X: newControl.X + dD.X, Y: newControl.Y + dD.Y };
         return [handleA, handleB];
     }
 
     /**
-     * Deletes the points of the current ink instance.
-     * @returns The changed x- and y-coordinates of the control points.
+     * Deletes the current control point of the selected ink instance.
      */
     @undoBatch
     @action
@@ -160,9 +199,8 @@ export class InkStrokeProperties {
     }, true)
 
     /**
-     * Rotates the points of the current ink instance by a certain angle degree.
-     * @param angle The angle at which to rotate the ink (all of its x- and y-coordinates).
-     * @returns The changed x- and y-coordinates of the control points.
+     * Rotates the entire selected ink instance.
+     * @param angle The angle at which to rotate the ink in radians.
      */
     @undoBatch
     @action
@@ -210,6 +248,18 @@ export class InkStrokeProperties {
             return newPoints;
         })
 
+    snapHandleTangent = (controlIndex: number, handleIndexA: number, handleIndexB: number) => {
+        this.applyFunction((doc: Doc, ink: InkData) => {
+            this._brokenIndices.splice(this._brokenIndices.indexOf(controlIndex), 1);
+            const [controlPoint, handleA, handleB] = [ink[controlIndex], ink[handleIndexA], ink[handleIndexB]];
+            const oppositeHandleA = this.rotatePoint(handleA, controlPoint, Math.PI);
+            const angleDifference = this.angleChange(handleB, oppositeHandleA, controlPoint);
+            const newHandleB = this.rotatePoint(handleB, controlPoint, angleDifference);
+            ink[handleIndexB] = newHandleB;
+            return ink;
+        });
+    }
+
     /**
      * Rotates the target point about the origin point for a given angle (radians).
      */
@@ -224,6 +274,11 @@ export class InkStrokeProperties {
         return target;
     }
 
+    /**
+     * Finds the angle between two inputted vectors.
+     * 
+     * α = arccos(a·b / |a|·|b|), where a and b are both vectors.
+     */
     angleBetweenTwoVectors = (vectorA: PointData, vectorB: PointData) => {
         const magnitudeA = Math.sqrt(vectorA.X * vectorA.X + vectorA.Y * vectorA.Y);
         const magnitudeB = Math.sqrt(vectorB.X * vectorB.X + vectorB.Y * vectorB.Y);
@@ -255,20 +310,17 @@ export class InkStrokeProperties {
     @action
     moveHandle = (deltaX: number, deltaY: number, handleIndex: number, oppositeHandleIndex: number, controlIndex: number) =>
         this.applyFunction((doc: Doc, ink: InkData, xScale: number, yScale: number) => {
-            const order = handleIndex % 4;
             const oldHandlePoint = ink[handleIndex];
             let oppositeHandlePoint = ink[oppositeHandleIndex];
             const controlPoint = ink[controlIndex];
             const newHandlePoint = { X: ink[handleIndex].X - deltaX / xScale, Y: ink[handleIndex].Y - deltaY / yScale };
             ink[handleIndex] = newHandlePoint;
-            
             // Rotate opposite handle if user hasn't held 'Alt' key or not first/final control (which have only 1 handle).
             if (!this._brokenIndices.includes(controlIndex) && handleIndex !== 1 && handleIndex !== ink.length - 2) {
                 const angle = this.angleChange(oldHandlePoint, newHandlePoint, controlPoint);
                 oppositeHandlePoint = this.rotatePoint(oppositeHandlePoint, controlPoint, angle);
                 ink[oppositeHandleIndex] = oppositeHandlePoint;
             }
-
             return ink;
         })
 }
\ No newline at end of file
diff --git a/src/fields/InkField.ts b/src/fields/InkField.ts
index 485376a34..1270a2dab 100644
--- a/src/fields/InkField.ts
+++ b/src/fields/InkField.ts
@@ -57,13 +57,10 @@ const strokeDataSchema = createSimpleSchema({
     "*": true
 });
 
-// Holistic class representing the store of an ink.
 @Deserializable("ink")
 export class InkField extends ObjectField {
     @serializable(list(object(strokeDataSchema)))
     readonly inkData: InkData;
-    // inkData: InkData;
-
 
     constructor(data: InkData) {
         super();
-- 
cgit v1.2.3-70-g09d2


From 6ecd0222232a9fd1ac1f9c915cfb192a0da7dac1 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 15 Jul 2021 10:33:54 -0400
Subject: hide sidebar handle and fix scrolling for secondary formattedTextBox
 views (eg when in a layout template)

---
 src/client/views/DocComponent.tsx                      |  2 +-
 src/client/views/nodes/DocumentView.tsx                |  2 +-
 .../views/nodes/formattedText/FormattedTextBox.tsx     | 18 ++++++++++--------
 3 files changed, 12 insertions(+), 10 deletions(-)

(limited to 'src')

diff --git a/src/client/views/DocComponent.tsx b/src/client/views/DocComponent.tsx
index 0b54e3cd6..da8af7cc0 100644
--- a/src/client/views/DocComponent.tsx
+++ b/src/client/views/DocComponent.tsx
@@ -119,7 +119,7 @@ export function ViewBoxAnnotatableComponent<P extends ViewBoxAnnotatableProps, T
 
         styleFromLayoutString = (scale: number) => {
             const style: { [key: string]: any } = {};
-            const divKeys = ["width", "height", "fontSize", "left", "background", "top", "pointerEvents", "position"];
+            const divKeys = ["width", "height", "fontSize", "left", "background", "left", "right", "top", "bottom", "pointerEvents", "position"];
             const replacer = (match: any, expr: string, offset: any, string: any) => { // bcz: this executes a script to convert a property expression string:  { script }  into a value
                 return ScriptField.MakeFunction(expr, { self: Doc.name, this: Doc.name, scale: "number" })?.script.run({ self: this.rootDoc, this: this.layoutDoc, scale }).result as string || "";
             };
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 5646a9790..60fa462ad 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -137,7 +137,7 @@ export interface DocumentViewProps extends DocumentViewSharedProps {
     hideDecorationTitle?: boolean;  // forces suppression of title. e.g, treeView document labels suppress titles in case they are globally active via settings
     treeViewDoc?: Doc;
     isDocumentActive?: () => boolean | undefined; // whether a document should handle pointer events
-    isContentActive: () => boolean | undefined; // whether a document should handle pointer events
+    isContentActive: () => boolean | undefined; // whether document contents should handle pointer events
     contentPointerEvents?: string; // pointer events allowed for content of a document view.  eg. set to "none" in menuSidebar for sharedDocs so that you can select a document, but not interact with its contents
     radialMenu?: String[];
     LayoutTemplateString?: string;
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 911ec1560..2070b9863 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -876,7 +876,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
         var quickScroll: string | undefined = "";
         this._disposers.scroll = reaction(() => NumCast(this.layoutDoc._scrollTop),
             pos => {
-                if (!this._ignoreScroll && this._scrollRef.current) {
+                if (!this._ignoreScroll && this._scrollRef.current && !this.props.dontSelectOnLoad) {
                     const viewTrans = quickScroll ?? StrCast(this.Document._viewTransition);
                     const durationMiliStr = viewTrans.match(/([0-9]*)ms/);
                     const durationSecStr = viewTrans.match(/([0-9.]*)s/);
@@ -1413,9 +1413,13 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
     }
     onScroll = (e: React.UIEvent) => {
         if (!LinkDocPreview.LinkInfo && this._scrollRef.current) {
-            this._ignoreScroll = true;
-            this.layoutDoc._scrollTop = this._scrollRef.current.scrollTop;
-            this._ignoreScroll = false;
+            if (this.props.dontSelectOnLoad) {
+                console.log("here");
+            } else {
+                this._ignoreScroll = true;
+                this.layoutDoc._scrollTop = this._scrollRef.current.scrollTop;
+                this._ignoreScroll = false;
+            }
         }
     }
     tryUpdateScrollHeight() {
@@ -1517,8 +1521,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
         const selPad = Math.min(margins, 10);
         const padding = Math.max(margins + ((selected && !this.layoutDoc._singleLine) || minimal ? -selPad : 0), 0);
         const selPaddingClass = selected && !this.layoutDoc._singleLine && margins >= 10 ? "-selected" : "";
-        const col = this.props.color ? this.props.color : this.props.styleProvider?.(this.layoutDoc, this.props, StyleProp.Color);
-        const back = this.props.background ? this.props.background : this.props.styleProvider?.(this.layoutDoc, this.props, StyleProp.BackgroundColor);
         return (
             <div className="formattedTextBox-cont"
                 onWheel={e => this.isContentActive() && e.stopPropagation()}
@@ -1566,8 +1568,8 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
                             }}
                         />
                     </div>
-                    {(this.props.noSidebar || this.Document._noSidebar) || !this.layoutDoc._showSidebar || this.sidebarWidthPercent === "0%" ? (null) : this.sidebarCollection}
-                    {(this.props.noSidebar || this.Document._noSidebar) || this.Document._singleLine ? (null) : this.sidebarHandle}
+                    {(this.props.noSidebar || this.Document._noSidebar) || this.props.dontSelectOnLoad || !this.layoutDoc._showSidebar || this.sidebarWidthPercent === "0%" ? (null) : this.sidebarCollection}
+                    {(this.props.noSidebar || this.Document._noSidebar) || this.props.dontSelectOnLoad || this.Document._singleLine ? (null) : this.sidebarHandle}
                     {!this.layoutDoc._showAudio ? (null) : this.audioHandle}
                 </div>
             </div >
-- 
cgit v1.2.3-70-g09d2


From cd5cecb339044e65ab016d8962eee8341c5f9dd8 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 15 Jul 2021 11:18:00 -0400
Subject: from last

---
 src/client/views/nodes/formattedText/FormattedTextBox.tsx | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 2070b9863..b97b5ff01 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -71,7 +71,7 @@ export interface FormattedTextBoxProps {
     xPadding?: number;   // used to override document's settings for xMargin --- see CollectionCarouselView
     yPadding?: number;
     noSidebar?: boolean;
-    dontSelectOnLoad?: boolean; // suppress selecting the text box when loaded
+    dontSelectOnLoad?: boolean; // suppress selecting the text box when loaded (and mark as not being associated with scrollTop document field)
 }
 export const GoogleRef = "googleDocId";
 
@@ -1413,9 +1413,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
     }
     onScroll = (e: React.UIEvent) => {
         if (!LinkDocPreview.LinkInfo && this._scrollRef.current) {
-            if (this.props.dontSelectOnLoad) {
-                console.log("here");
-            } else {
+            if (!this.props.dontSelectOnLoad) {
                 this._ignoreScroll = true;
                 this.layoutDoc._scrollTop = this._scrollRef.current.scrollTop;
                 this._ignoreScroll = false;
-- 
cgit v1.2.3-70-g09d2


From 1a1fc27a66c95c947dc8d2a812484f37586133cd Mon Sep 17 00:00:00 2001
From: Ashley Cai <ashley.lcai@gmail.com>
Date: Thu, 15 Jul 2021 12:37:31 -0700
Subject: Starting Color consistency

---
 src/client/views/AntimodeMenu.scss                 |  2 +-
 src/client/views/ContextMenu.scss                  |  2 +-
 src/client/views/DocumentButtonBar.scss            |  4 +-
 src/client/views/DocumentDecorations.scss          |  8 +--
 src/client/views/MainView.scss                     | 58 +++++++++++-----------
 src/client/views/PropertiesButtons.scss            |  6 +--
 src/client/views/StyleProvider.tsx                 | 31 ++++++------
 src/client/views/_nodeModuleOverrides.scss         |  2 +-
 src/client/views/animationtimeline/Timeline.scss   |  2 +-
 .../views/animationtimeline/TimelineMenu.scss      |  4 +-
 src/client/views/animationtimeline/Track.scss      |  2 +-
 .../views/collections/CollectionDockingView.scss   | 14 +++---
 .../views/collections/CollectionLinearView.scss    |  4 +-
 src/client/views/collections/CollectionMenu.scss   |  2 +-
 .../views/collections/CollectionStackingView.scss  |  6 +--
 .../views/collections/CollectionStackingView.tsx   |  2 +-
 src/client/views/global/globalCssVariables.scss    | 18 ++++---
 src/client/views/global/globalEnums.tsx            | 17 ++++---
 src/client/views/linking/LinkEditor.scss           |  2 +-
 src/client/views/linking/LinkMenuItem.scss         |  2 +-
 src/client/views/nodes/FontIconBox.scss            | 13 +++--
 src/client/views/search/CheckBox.scss              |  2 +-
 src/client/views/search/IconButton.scss            |  2 +-
 src/client/views/search/IconButton.tsx             |  2 +-
 src/client/views/search/SearchBox.scss             |  4 +-
 src/client/views/search/SelectorContextMenu.scss   |  4 +-
 26 files changed, 111 insertions(+), 104 deletions(-)

(limited to 'src')

diff --git a/src/client/views/AntimodeMenu.scss b/src/client/views/AntimodeMenu.scss
index 8670b1747..2bac03af4 100644
--- a/src/client/views/AntimodeMenu.scss
+++ b/src/client/views/AntimodeMenu.scss
@@ -5,7 +5,7 @@
     position: absolute;
     z-index: 10001;
     height: $antimodemenu-height;
-    background: #323232;
+    background: $dark-gray;
     box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.25);
     // border-radius: 0px 6px 6px 6px;
     z-index: 1001;
diff --git a/src/client/views/ContextMenu.scss b/src/client/views/ContextMenu.scss
index 2590e34c6..795529780 100644
--- a/src/client/views/ContextMenu.scss
+++ b/src/client/views/ContextMenu.scss
@@ -137,7 +137,7 @@
 
 .contextMenu-item:hover {
     transition: all 0.1s ease;
-    background: $lighter-alt-accent;
+    background: $light-blue;
 }
 
 .contextMenu-description {
diff --git a/src/client/views/DocumentButtonBar.scss b/src/client/views/DocumentButtonBar.scss
index e816c52a3..2a0b494f5 100644
--- a/src/client/views/DocumentButtonBar.scss
+++ b/src/client/views/DocumentButtonBar.scss
@@ -25,7 +25,7 @@ $linkGap : 3px;
     border-radius: 50%;
     opacity: 0.9;
     pointer-events: auto;
-    background-color: $dark-color;
+    background-color: $dark-gray;
     color: $white;
     text-transform: uppercase;
     letter-spacing: 2px;
@@ -64,7 +64,7 @@ $linkGap : 3px;
     text-align: center;
     border-radius: 50%;
     pointer-events: auto;
-    background-color: $dark-color;
+    background-color: $dark-gray;
     border: none;
     transition: 0.2s ease all;
 
diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss
index 47a8326bb..1715f35e7 100644
--- a/src/client/views/DocumentDecorations.scss
+++ b/src/client/views/DocumentDecorations.scss
@@ -286,8 +286,8 @@ $linkGap : 3px;
     text-align: center;
     border-radius: 50%;
     pointer-events: auto;
-    color: $dark-color;
-    border: $dark-color 1px solid;
+    color: $dark-gray;
+    border: $dark-gray 1px solid;
 }
 
 .linkButton-linker:hover {
@@ -302,7 +302,7 @@ $linkGap : 3px;
     border-radius: 50%;
     opacity: 0.9;
     pointer-events: auto;
-    background-color: $dark-color;
+    background-color: $dark-gray;
     color: $white;
     text-transform: uppercase;
     letter-spacing: 2px;
@@ -343,7 +343,7 @@ $linkGap : 3px;
     border-radius: 50%;
     opacity: 0.9;
     font-size: 14;
-    background-color: $dark-color;
+    background-color: $dark-gray;
     color: $white;
     text-align: center;
     cursor: pointer;
diff --git a/src/client/views/MainView.scss b/src/client/views/MainView.scss
index d76458460..07ca0257c 100644
--- a/src/client/views/MainView.scss
+++ b/src/client/views/MainView.scss
@@ -56,50 +56,50 @@
     touch-action: none;
 
     .searchBox-container {
-        background: lightgray;
+        background: $light-gray;
     }
 }
 
 .mainView-container {
-    color: black;
+    color: $dark-gray;
 
     .lm_title {
-        background: #cacaca;
-        color: black;
+        background: $light-gray;
+        color: $dark-gray;
     }
 }
 
 .mainView-container-dark {
-    color: lightgray;
+    color: $light-gray;
 
     .lm_goldenlayout {
-        background: dimgray;
+        background: $medium-gray;
     }
 
     .lm_title {
-        background: black;
+        background: $dark-gray;
         color: unset;
     }
 
     .marquee {
-        border-color: white;
+        border-color: $white;
     }
 
     #search-input {
-        background: lightgray;
+        background: $light-gray;
     }
 
     .searchBox-container {
-        background: rgb(45, 45, 45);
+        background: $dark-gray;
     }
 
     .contextMenu-cont,
     .contextMenu-item {
-        background: dimGray;
+        background: $medium-gray;
     }
 
     .contextMenu-item:hover {
-        background: gray;
+        background: $medium-gray;
     }
 }
 
@@ -113,7 +113,7 @@
 
 .mainView-propertiesDragger {
     //background-color: rgb(140, 139, 139);
-    background-color: lightgrey;
+    background-color: $light-gray;
     height: 55px;
     width: 17px;
     position: absolute;
@@ -163,10 +163,10 @@
         flex-direction: column;
         position: relative;
         height: 100%;
-        background: dimgray;
+        background: $medium-gray;
 
         .documentView-node-topmost {
-            background: lightgrey;
+            background: $light-gray;
         }
     }
 
@@ -174,32 +174,32 @@
         right: 0;
         position: absolute;
         z-index: 2;
-        background-color: rgb(159, 159, 159);
+        background-color: $medium-gray;
         .editable-title {
-            background-color: lightgrey;
+            background-color: $light-gray;
         }
     }
 
 }
 .mainView-libraryHandle {
-    background-color: lightgrey;
+    background-color: $light-gray;
 }
 .mainView-innerContent-dark 
 {
     .propertiesView {
         background-color: #252525;
         input {
-            background-color: dimgrey;
+            background-color: $medium-gray;
         }
         .propertiesView-sharingTable 
         {
-            background-color: dimgrey;
+            background-color: $medium-gray;
         }
         .editable-title {
-            background-color: dimgrey;
+            background-color: $medium-gray;
         }
         .propertiesView-field {
-            background-color: dimgrey;
+            background-color: $medium-gray;
         }
     }
     .mainView-propertiesDragger,
@@ -209,17 +209,17 @@
 }
 .mainView-container-dark {
     .contextMenu-cont {
-        background: dimgrey;
-        color: white;
+        background: $medium-gray;
+        color: $white;
         input::placeholder {
-            color:white;
+            color:$white;
         }
     }
 }
 
 .mainView-menuPanel {
     min-width: var(--menuPanelWidth);
-    background-color: #121721;
+    background-color: $dark-gray;
 
     .collectionStackingView {
         scrollbar-width: none;
@@ -233,13 +233,13 @@
         padding: 7px;
         padding-left: 7px;
         width: 100%;
-        background: black;
+        background: $dark-gray;
 
         .mainView-menuPanel-button-wrap {
             width: 45px;
             /* padding: 5px; */
             touch-action: none;
-            background: black;
+            background: $dark-gray;
             transform-origin: top left;
             /* margin-bottom: 5px; */
             margin-top: 5px;
@@ -247,7 +247,7 @@
             border-radius: 8px;
 
             &:hover {
-                background: rgb(61, 61, 61);
+                background: $black;
                 cursor: pointer;
             }
         }
diff --git a/src/client/views/PropertiesButtons.scss b/src/client/views/PropertiesButtons.scss
index 4ef7763be..484522bc7 100644
--- a/src/client/views/PropertiesButtons.scss
+++ b/src/client/views/PropertiesButtons.scss
@@ -24,7 +24,7 @@ $linkGap : 3px;
     width: 29px;
     border-radius: 6px;
     pointer-events: auto;
-    background-color: $dark-color;
+    background-color: $dark-gray;
     color: #fcfbf7;
     text-transform: uppercase;
     letter-spacing: 2px;
@@ -45,11 +45,11 @@ $linkGap : 3px;
 }
 .propertiesButtons-linkButton-empty.toggle-on {
     background-color: white;
-    color: $dark-color;
+    color: $dark-gray;
 }
 .propertiesButtons-linkButton-empty.toggle-hover {
     background-color: gray;
-    color: $dark-color;
+    color: $dark-gray;
 }
 .propertiesButtons-linkButton-empty.toggle-off {
     color: white;
diff --git a/src/client/views/StyleProvider.tsx b/src/client/views/StyleProvider.tsx
index 9e61351c4..1bf47f6ac 100644
--- a/src/client/views/StyleProvider.tsx
+++ b/src/client/views/StyleProvider.tsx
@@ -1,4 +1,5 @@
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { Colors } from './global/globalEnums';
 import { IconProp } from '@fortawesome/fontawesome-svg-core';
 import 'golden-layout/src/css/goldenlayout-base.css';
 import 'golden-layout/src/css/goldenlayout-dark-theme.css';
@@ -97,14 +98,14 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
         case StyleProp.Color:
             const docColor: Opt<string> = StrCast(doc?.[fieldKey + "color"], StrCast(doc?._color));
             if (docColor) return docColor;
-            const backColor = backgroundCol();// || (darkScheme() ? "black" : "white");
+            const backColor = backgroundCol();
             if (!backColor) return undefined;
             const nonAlphaColor = backColor.startsWith("#") ? (backColor as string).substring(0, 7) :
                 backColor.startsWith("rgba") ? backColor.replace(/,.[^,]*\)/, ")").replace("rgba", "rgb") : backColor
             const col = Color(nonAlphaColor).rgb();
             const colsum = (col.red() + col.green() + col.blue());
-            if (colsum / col.alpha() > 400 || col.alpha() < 0.25) return "black";
-            return "white";
+            if (colsum / col.alpha() > 400 || col.alpha() < 0.25) return Colors.DARK_GRAY;
+            return Colors.WHITE;
         case StyleProp.Hidden: return BoolCast(doc?._hidden);
         case StyleProp.BorderRounding: return StrCast(doc?.[fieldKey + "borderRounding"]);
         case StyleProp.TitleHeight: return 15;
@@ -114,30 +115,30 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
             doc?.type === DocumentType.RTF) && showTitle() && !StrCast(doc?.showTitle).includes(":hover") ? 15 : 0;
         case StyleProp.BackgroundColor: {
             let docColor: Opt<string> = StrCast(doc?.[fieldKey + "backgroundColor"], StrCast(doc?._backgroundColor, isCaption ? "rgba(0,0,0,0.4)" : ""));
-            if (MainView.Instance.LastButton === doc) return darkScheme() ? "dimgrey" : "lightgrey";
+            if (MainView.Instance.LastButton === doc) return darkScheme() ? Colors.MEDIUM_GRAY : Colors.LIGHT_GRAY;
             switch (doc?.type) {
                 case DocumentType.PRESELEMENT: docColor = docColor || (darkScheme() ? "" : ""); break;
-                case DocumentType.PRES: docColor = docColor || (darkScheme() ? "#3e3e3e" : "white"); break;
-                case DocumentType.FONTICON: docColor = docColor || "black"; break;
-                case DocumentType.RTF: docColor = docColor || (darkScheme() ? "#2d2d2d" : "#f1efeb"); break;
-                case DocumentType.FILTER: docColor = docColor || (darkScheme() ? "#2d2d2d" : "rgba(105, 105, 105, 0.432)"); break;
+                case DocumentType.PRES: docColor = docColor || (darkScheme() ? Colors.DARK_GRAY : Colors.WHITE); break;
+                case DocumentType.FONTICON: docColor = docColor || Colors.DARK_GRAY; break;
+                case DocumentType.RTF: docColor = docColor || (darkScheme() ? Colors.DARK_GRAY : Colors.LIGHT_GRAY); break;
+                case DocumentType.FILTER: docColor = docColor || (darkScheme() ? Colors.DARK_GRAY : "rgba(105, 105, 105, 0.432)"); break;
                 case DocumentType.INK: docColor = doc?.isInkMask ? "rgba(0,0,0,0.7)" : undefined; break;
                 case DocumentType.SLIDER: break;
                 case DocumentType.EQUATION: docColor = docColor || "transparent"; break;
                 case DocumentType.LABEL: docColor = docColor || (doc.annotationOn !== undefined ? "rgba(128, 128, 128, 0.18)" : undefined); break;
-                case DocumentType.BUTTON: docColor = docColor || (darkScheme() ? "#2d2d2d" : "lightgray"); break;
-                case DocumentType.LINKANCHOR: docColor = isAnchor ? "lightblue" : "transparent"; break;
+                case DocumentType.BUTTON: docColor = docColor || (darkScheme() ? Colors.DARK_GRAY : Colors.LIGHT_GRAY); break;
+                case DocumentType.LINKANCHOR: docColor = isAnchor ? Colors.LIGHT_BLUE : "transparent"; break;
                 case DocumentType.LINK: docColor = docColor || "transparent"; break;
                 case DocumentType.IMG:
                 case DocumentType.WEB:
                 case DocumentType.PDF:
                 case DocumentType.SCREENSHOT:
-                case DocumentType.VID: docColor = docColor || (darkScheme() ? "#2d2d2d" : "lightgray"); break;
+                case DocumentType.VID: docColor = docColor || (darkScheme() ? Colors.DARK_GRAY : Colors.LIGHT_GRAY); break;
                 case DocumentType.COL:
                     if (StrCast(Doc.LayoutField(doc)).includes("SliderBox")) break;
-                    docColor = docColor ? docColor :
+                    docColor = docColor ? Colors.DARK_GRAY :
                         doc?._isGroup ? "#00000004" : // very faint highlight to show bounds of group
-                            (Doc.IsSystem(doc) ? (darkScheme() ? "rgb(62,62,62)" : "lightgrey") : // system docs (seen in treeView) get a grayish background
+                            (Doc.IsSystem(doc) ? (darkScheme() ? Colors.DARK_GRAY : Colors.LIGHT_GRAY) : // system docs (seen in treeView) get a grayish background
                                 isBackground() ? "cyan" : // ?? is there a good default for a background collection
                                     doc.annotationOn ? "#00000015" : // faint interior for collections on PDFs, images, etc
                                         StrCast((props?.renderDepth || 0) > 0 ?
@@ -145,7 +146,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
                                             Doc.UserDoc().activeCollectionBackground));
                     break;
                 //if (doc._viewType !== CollectionViewType.Freeform && doc._viewType !== CollectionViewType.Time) return "rgb(62,62,62)";
-                default: docColor = docColor || (darkScheme() ? "black" : "white"); break;
+                default: docColor = docColor || (darkScheme() ? Colors.DARK_GRAY : Colors.WHITE); break;
             }
             if (docColor && (!doc || props?.layerProvider?.(doc) === false)) docColor = Color(docColor.toLowerCase()).fade(0.5).toString();
             return docColor;
@@ -159,7 +160,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
                 case DocumentType.COL:
                     return StrCast(doc?.boxShadow,
                         isBackground() || doc?._isGroup || docProps?.LayoutTemplateString ? undefined : // groups have no drop shadow -- they're supposed to be "invisible".  LayoutString's imply collection is being rendered as something else (e.g., title of a Slide)
-                            `${darkScheme() ? "rgb(30, 32, 31) " : "#9c9396 "} ${StrCast(doc.boxShadow, "0.2vw 0.2vw 0.8vw")}`);
+                            `${darkScheme() ? Colors.DARK_GRAY : Colors.MEDIUM_GRAY} ${StrCast(doc.boxShadow, "0.2vw 0.2vw 0.8vw")}`);
 
                 case DocumentType.LABEL:
                     if (doc?.annotationOn !== undefined) return "black 2px 2px 1px";
diff --git a/src/client/views/_nodeModuleOverrides.scss b/src/client/views/_nodeModuleOverrides.scss
index b8a7db034..56346b68b 100644
--- a/src/client/views/_nodeModuleOverrides.scss
+++ b/src/client/views/_nodeModuleOverrides.scss
@@ -2,7 +2,7 @@
 
 // goldenlayout stuff
 div .lm_header {
-    background: $dark-color;
+    background: $dark-gray;
 }
 
 .lm_tab {
diff --git a/src/client/views/animationtimeline/Timeline.scss b/src/client/views/animationtimeline/Timeline.scss
index d82eb85bf..48422b789 100644
--- a/src/client/views/animationtimeline/Timeline.scss
+++ b/src/client/views/animationtimeline/Timeline.scss
@@ -251,7 +251,7 @@ $timelineDark: #77a1aa;
             top: 0px;
             width: 100px;
             height: 30%;
-            border: 1px solid $dark-color;
+            border: 1px solid $dark-gray;
             font-size: 12px;
             line-height: 11px;
             background-color: $timelineDark;
diff --git a/src/client/views/animationtimeline/TimelineMenu.scss b/src/client/views/animationtimeline/TimelineMenu.scss
index 935f04aba..43a89419e 100644
--- a/src/client/views/animationtimeline/TimelineMenu.scss
+++ b/src/client/views/animationtimeline/TimelineMenu.scss
@@ -39,7 +39,7 @@
         border-top-left-radius: 15px; 
         border-top-right-radius: 15px; 
         text-transform: uppercase; 
-        background: $dark-color; 
+        background: $dark-gray; 
         letter-spacing: 2px; 
 
         .timeline-menu-header-desc{
@@ -82,7 +82,7 @@
         border-color: $medium-gray;
         border-bottom-style: solid;
         border-top-style: solid;
-        background: $darker-alt-accent; 
+        background: $medium-blue; 
     }
 
     .timeline-menu-desc {
diff --git a/src/client/views/animationtimeline/Track.scss b/src/client/views/animationtimeline/Track.scss
index 6d6d1620f..f45e0556d 100644
--- a/src/client/views/animationtimeline/Track.scss
+++ b/src/client/views/animationtimeline/Track.scss
@@ -7,7 +7,7 @@
             top: 0px;
             width: calc(100%);
             background-color: $white;
-            border: 1px solid $dark-color;
+            border: 1px solid $dark-gray;
             position: relative;
             z-index: 100;
         }
diff --git a/src/client/views/collections/CollectionDockingView.scss b/src/client/views/collections/CollectionDockingView.scss
index 6d5dc9b18..a054f0ae1 100644
--- a/src/client/views/collections/CollectionDockingView.scss
+++ b/src/client/views/collections/CollectionDockingView.scss
@@ -110,7 +110,7 @@
     }
 
     .flexlayout__splitter {
-        background-color: $dark-color;
+        background-color: $dark-gray;
     }
 
     .flexlayout__splitter:hover {
@@ -179,7 +179,7 @@
         position: absolute;
         box-sizing: border-box;
         background-color: #222;
-        color: $dark-color;
+        color: $dark-gray;
     }
 
     .flexlayout__tab_button {
@@ -268,7 +268,7 @@
     }
 
     .flexlayout__tab_header_outer {
-        background-color: $dark-color;
+        background-color: $dark-gray;
         position: absolute;
         left: 0;
         right: 0;
@@ -332,28 +332,28 @@
     }
 
     .flexlayout__border_top {
-        background-color: $dark-color;
+        background-color: $dark-gray;
         border-bottom: 1px solid #ddd;
         box-sizing: border-box;
         overflow: hidden;
     }
 
     .flexlayout__border_bottom {
-        background-color: $dark-color;
+        background-color: $dark-gray;
         border-top: 1px solid #333;
         box-sizing: border-box;
         overflow: hidden;
     }
 
     .flexlayout__border_left {
-        background-color: $dark-color;
+        background-color: $dark-gray;
         border-right: 1px solid #333;
         box-sizing: border-box;
         overflow: hidden;
     }
 
     .flexlayout__border_right {
-        background-color: $dark-color;
+        background-color: $dark-gray;
         border-left: 1px solid #333;
         box-sizing: border-box;
         overflow: hidden;
diff --git a/src/client/views/collections/CollectionLinearView.scss b/src/client/views/collections/CollectionLinearView.scss
index 632ce4417..ec8805907 100644
--- a/src/client/views/collections/CollectionLinearView.scss
+++ b/src/client/views/collections/CollectionLinearView.scss
@@ -12,7 +12,7 @@
         align-items: center;
 
         >span {
-            background: $dark-color;
+            background: $dark-gray;
             color: $white;
             border-radius: 18px;
             margin-right: 6px;
@@ -63,7 +63,7 @@
         >label {
             margin-top: "auto";
             margin-bottom: "auto";
-            background: $dark-color;
+            background: $dark-gray;
             color: $white;
             display: inline-block;
             border-radius: 18px;
diff --git a/src/client/views/collections/CollectionMenu.scss b/src/client/views/collections/CollectionMenu.scss
index 328d7c081..7e507d6b5 100644
--- a/src/client/views/collections/CollectionMenu.scss
+++ b/src/client/views/collections/CollectionMenu.scss
@@ -411,7 +411,7 @@
             }
 
             .switchToText:hover {
-                color: $dark-color;
+                color: $dark-gray;
             }
         }
 
diff --git a/src/client/views/collections/CollectionStackingView.scss b/src/client/views/collections/CollectionStackingView.scss
index f103d9581..4b123c8b6 100644
--- a/src/client/views/collections/CollectionStackingView.scss
+++ b/src/client/views/collections/CollectionStackingView.scss
@@ -96,7 +96,7 @@
         height: 2vw;
         width: 100%;
         font-family: $sans-serif;
-        background: $dark-color;
+        background: $dark-gray;
         color: $white;
     }
 
@@ -184,7 +184,7 @@
         // overflow: hidden; overflow is visible so the color menu isn't hidden -ftong
 
         .editableView-input {
-            color: $dark-color;
+            color: $dark-gray;
         }
 
         .editableView-input:hover,
@@ -205,7 +205,7 @@
             display: flex;
             align-items: center;
             justify-content: center;
-            color: $dark-color;
+            color: $dark-gray;
 
             .editableView-container-editing-oneLine,
             .editableView-container-editing {
diff --git a/src/client/views/collections/CollectionStackingView.tsx b/src/client/views/collections/CollectionStackingView.tsx
index 30f8e0112..7aa8dfd56 100644
--- a/src/client/views/collections/CollectionStackingView.tsx
+++ b/src/client/views/collections/CollectionStackingView.tsx
@@ -480,7 +480,7 @@ export class CollectionStackingView extends CollectionSubView<StackingDocument,
         if (value && this.columnHeaders) {
             const schemaHdrField = new SchemaHeaderField(value);
             this.columnHeaders.push(schemaHdrField);
-            DocUtils.addFieldEnumerations(undefined, this.pivotField, [{ title: value, _backgroundColor: schemaHdrField.color }]);
+            DocUtils.addFieldEnumerations(undefined, this.pivotField, [{ title: value, _backgroundColor: "schemaHdrField.color" }]);
             return true;
         }
         return false;
diff --git a/src/client/views/global/globalCssVariables.scss b/src/client/views/global/globalCssVariables.scss
index 218bdbf3c..bdae3b9b1 100644
--- a/src/client/views/global/globalCssVariables.scss
+++ b/src/client/views/global/globalCssVariables.scss
@@ -3,19 +3,21 @@
 $white: #ffffff;
 $light-gray:#dfdfdf;
 $medium-gray: #9F9F9F;
+$dark-gray: #323232;
+$black: #000000;
 
-$lighter-alt-accent: rgb(207, 220, 240);
-$darker-alt-accent: #b2cef8;
+$light-blue: #BDDDF5;
+$medium-blue: #4476F7;
+$pink: "#E0217D";
+$yellow: "#F5D747";
+
+$antimodemenu-height: 36px;
 
-$dark-color: #111111;
-$link-color: #add8e6;
-$antimodemenu-height: 35px;
 // fonts
 $sans-serif: "Noto Sans",
 sans-serif;
 // $sans-serif: "Roboto Slab", sans-serif;
-$serif: "Crimson Text",
-serif;
+
 // misc values
 $border-radius: 0.3em;
 //
@@ -31,7 +33,7 @@ $docDecorations-zindex: 998; // then doc decorations appear over everything else
 $remoteCursors-zindex: 997; // ... not sure what level the remote cursors should go -- is this right?
 $COLLECTION_BORDER_WIDTH: 0;
 $SCHEMA_DIVIDER_WIDTH: 4;
-$MINIMIZED_ICON_SIZE:25;
+$MINIMIZED_ICON_SIZE:24;
 $MAX_ROW_HEIGHT: 44px;
 $DFLT_IMAGE_NATIVE_DIM: 900px;
 $MENU_PANEL_WIDTH: 60px;
diff --git a/src/client/views/global/globalEnums.tsx b/src/client/views/global/globalEnums.tsx
index 9d182ee0f..80558e1c1 100644
--- a/src/client/views/global/globalEnums.tsx
+++ b/src/client/views/global/globalEnums.tsx
@@ -1,12 +1,13 @@
 export enum Colors {
-    DarkGray = "#111111",
-    MediumGray = "#9F9F9F",
-    LightGray = "#DFDFDF",
-    White = "#FFFFFF",
-    MediumBlue = "#4476F7",
-    LightBlue = "#BDDDF5",
-    Pink = "#E0217D",
-    Yellow = "#F5D747"
+    BLACK = "#000000",
+    DARK_GRAY = "#323232",
+    MEDIUM_GRAY = "#9F9F9F",
+    LIGHT_GRAY = "#DFDFDF",
+    WHITE = "#FFFFFF",
+    MEDIUM_BLUE = "#4476F7",
+    LIGHT_BLUE = "#BDDDF5",
+    PINK = "#E0217D",
+    YELLOW = "#F5D747"
 }
 
 export enum FontSizes {
diff --git a/src/client/views/linking/LinkEditor.scss b/src/client/views/linking/LinkEditor.scss
index eee072ed5..839ebf894 100644
--- a/src/client/views/linking/LinkEditor.scss
+++ b/src/client/views/linking/LinkEditor.scss
@@ -272,7 +272,7 @@
 
 .linkEditor-typeButton {
     background-color: transparent;
-    color: $dark-color;
+    color: $dark-gray;
     height: 20px;
     padding: 0 3px;
     padding-bottom: 2px;
diff --git a/src/client/views/linking/LinkMenuItem.scss b/src/client/views/linking/LinkMenuItem.scss
index a07e540ae..4f9881565 100644
--- a/src/client/views/linking/LinkMenuItem.scss
+++ b/src/client/views/linking/LinkMenuItem.scss
@@ -143,7 +143,7 @@
         padding-right: 6px;
         border-radius: 50%;
         pointer-events: auto;
-        background-color: $dark-color;
+        background-color: $dark-gray;
         color: $white;
         font-size: 65%;
         transition: transform 0.2s;
diff --git a/src/client/views/nodes/FontIconBox.scss b/src/client/views/nodes/FontIconBox.scss
index 33ac85a0e..718af2c16 100644
--- a/src/client/views/nodes/FontIconBox.scss
+++ b/src/client/views/nodes/FontIconBox.scss
@@ -1,5 +1,7 @@
+@import "../global/globalCssVariables";
+
 .fontIconBox-label {
-    color: white;
+    color: $white;
     margin-right: 4px;
     margin-top: 1px;
     position: relative;
@@ -22,8 +24,8 @@
         position: absolute;
         top: -10px;
         right: -10px;
-        color: white;
-        background: #f44b42;
+        color: $white;
+        background: $pink;
         font-weight: 300;
         border-radius: 100%;
         width: 25px;
@@ -37,7 +39,7 @@
 .menuButton-circle,
 .menuButton-round {
     border-radius: 100%;
-    background-color: black;
+    background-color: $dark-gray;
     padding: 0;
 
     .fontIconBox-label {
@@ -47,13 +49,14 @@
     }
 
     &:hover {
-        background-color: #aaaaa3;
+        background-color: $light-gray;
     }
 }
 
 .menuButton-square {
     padding-top: 3px;
     padding-bottom: 3px;
+    background-color: $dark-gray;
 
     .fontIconBox-label {
         border-radius: 0px;
diff --git a/src/client/views/search/CheckBox.scss b/src/client/views/search/CheckBox.scss
index c46b3eb20..2a0085ade 100644
--- a/src/client/views/search/CheckBox.scss
+++ b/src/client/views/search/CheckBox.scss
@@ -13,7 +13,7 @@
         margin-top: 0px;
 
         .check-container:hover~.check-box {
-            background-color: $darker-alt-accent;
+            background-color: $medium-blue;
         }
 
         .check-container {
diff --git a/src/client/views/search/IconButton.scss b/src/client/views/search/IconButton.scss
index d87b8bd5c..3cb08d756 100644
--- a/src/client/views/search/IconButton.scss
+++ b/src/client/views/search/IconButton.scss
@@ -43,7 +43,7 @@
 
     .type-icon:hover {
         transform: scale(1.1);
-        background-color: $darker-alt-accent;
+        background-color: $medium-blue;
         opacity: 1;
 
         +.filter-description {
diff --git a/src/client/views/search/IconButton.tsx b/src/client/views/search/IconButton.tsx
index 6fd91c9c1..2dd6b1b79 100644
--- a/src/client/views/search/IconButton.tsx
+++ b/src/client/views/search/IconButton.tsx
@@ -104,7 +104,7 @@ export class IconButton extends React.Component<IconButtonProps>{
     hoverStyle = {
         opacity: 1,
         backgroundColor: "rgb(128, 128, 128)"
-        //backgroundColor: "rgb(178, 206, 248)" //$darker-alt-accent
+        //backgroundColor: "rgb(178, 206, 248)" //$medium-blue
     };
 
     render() {
diff --git a/src/client/views/search/SearchBox.scss b/src/client/views/search/SearchBox.scss
index 8d6bc86cb..6a2fe6f19 100644
--- a/src/client/views/search/SearchBox.scss
+++ b/src/client/views/search/SearchBox.scss
@@ -20,7 +20,7 @@
         display: flex;
         justify-content: center;
         align-items: center;
-        background-color: $dark-color;
+        background-color: $dark-gray;
 
         .searchBox-lozenges {
             position: absolute;
@@ -86,7 +86,7 @@
             &.searchBox-input {
                 margin:5px;
                 border-radius:20px;
-                border:$dark-color;    
+                border:$dark-gray;    
                 display: block;
                 width: 130px;
                 -webkit-transition: width 0.4s;
diff --git a/src/client/views/search/SelectorContextMenu.scss b/src/client/views/search/SelectorContextMenu.scss
index 438b6a0c2..a114f679c 100644
--- a/src/client/views/search/SelectorContextMenu.scss
+++ b/src/client/views/search/SelectorContextMenu.scss
@@ -1,7 +1,7 @@
 @import "../global/globalCssVariables";
 
 .parents {
-    background: $lighter-alt-accent;
+    background: $light-blue;
     padding: 10px;
     // width: 300px;
 
@@ -10,7 +10,7 @@
     }
 
     .collection {
-        border-color: $darker-alt-accent;
+        border-color: $medium-blue;
         border-bottom-style: solid;
     }
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From 31a00f5e5d374b8a2945525a75f80f4148c143b7 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 15 Jul 2021 17:29:04 -0400
Subject: fixed onClick scripts for layout fields of HTMLtags.  adjusted
 formatting of fieldViews/checkboxes/inputs

---
 src/client/views/nodes/DocumentContentsView.tsx           |  2 +-
 src/client/views/nodes/formattedText/DashFieldView.scss   | 11 +++++++----
 src/client/views/nodes/formattedText/FormattedTextBox.tsx |  2 +-
 3 files changed, 9 insertions(+), 6 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx
index 34488ffbe..a0a40becb 100644
--- a/src/client/views/nodes/DocumentContentsView.tsx
+++ b/src/client/views/nodes/DocumentContentsView.tsx
@@ -180,7 +180,7 @@ export class DocumentContentsView extends React.Component<DocumentViewProps & Fo
         const replacer = (match: any, prefix: string, expr: string, postfix: string, offset: any, string: any) => {
             return prefix + (ScriptField.MakeFunction(expr, { self: Doc.name, this: Doc.name })?.script.run({ this: this.props.Document }).result as string || "") + postfix;
         };
-        layoutFrame = layoutFrame.replace(/(>[^{]*)\{([^.'][^<}]+)\}([^}]*<)/g, replacer);
+        layoutFrame = layoutFrame.replace(/(>[^{]*)[^=]\{([^.'][^<}]+)\}([^}]*<)/g, replacer);
 
         // replace HTML<tag> with corresponding HTML tag as in:  <HTMLdiv> becomes  <HTMLtag Document={props.Document} htmltag='div'> 
         const replacer2 = (match: any, p1: string, offset: any, string: any) => {
diff --git a/src/client/views/nodes/formattedText/DashFieldView.scss b/src/client/views/nodes/formattedText/DashFieldView.scss
index e16036000..e7dd286a5 100644
--- a/src/client/views/nodes/formattedText/DashFieldView.scss
+++ b/src/client/views/nodes/formattedText/DashFieldView.scss
@@ -1,6 +1,7 @@
 .dashFieldView {
     position: relative;
-    display: inline-block;
+    display: inline-flex;
+    align-items: center;
 
     .dashFieldView-enumerables {
         width: 10px;
@@ -13,6 +14,8 @@
         min-width: 12px;
         position: relative;
         display: inline-block;
+        margin: 0;
+        transform: scale(0.7);
         background-color: rgba(155, 155, 155, 0.24);
     }
     .dashFieldView-labelSpan {
@@ -22,11 +25,11 @@
         background: rgba(0,0,0,0.1);
     }
     .dashFieldView-fieldSpan {
-        min-width: 20px;
+        min-width: 8px;
         margin-left: 2px;
         margin-right: 5px;
-        position: relative;
-        display: inline;
+        padding-left: 2px;
+        display: inline-block;
         background-color: rgba(155, 155, 155, 0.24);
         font-weight: bold;
         span {
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index b97b5ff01..42cb02782 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -1554,7 +1554,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
                 >
                     <div className={`formattedTextBox-outer${selected ? "-selected" : ""}`} ref={this._scrollRef}
                         style={{
-                            width: `calc(100% - ${this.sidebarWidthPercent})`,
+                            width: this.props.dontSelectOnLoad ? "100%" : `calc(100% - ${this.sidebarWidthPercent})`,
                             pointerEvents: !active && !SnappingManager.GetIsDragging() ? "none" : undefined,
                             overflow: this.layoutDoc._singleLine ? "hidden" : undefined,
                         }}
-- 
cgit v1.2.3-70-g09d2


From 212d49772c1c2aa3d0a9382ef144dc3037faa8c2 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 15 Jul 2021 23:59:38 -0400
Subject: cleaned up autoHeight for text in conjunction with sidebars and
 titles and some layout scripts

---
 src/client/util/CurrentUserUtils.ts                | 13 +++++++---
 src/client/views/DocumentDecorations.tsx           |  4 +--
 src/client/views/SidebarAnnos.tsx                  |  5 +++-
 .../views/nodes/formattedText/FormattedTextBox.tsx | 29 +++++++++++-----------
 4 files changed, 31 insertions(+), 20 deletions(-)

(limited to 'src')

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 12733e815..5bab827d5 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -406,11 +406,18 @@ export class CurrentUserUtils {
                 storedMarks: []
             };
             const headerTemplate = Docs.Create.RTFDocument(new RichTextField(JSON.stringify(json), ""), { title: "header", version: headerViewVersion, target: doc, _height: 70, _headerPointerEvents: "all", _headerHeight: 12, _headerFontSize: 9, _autoHeight: true, system: true, cloneFieldFilter: new List<string>(["system"]) }, "header"); // text needs to be a space to allow templateText to be created
+            const headerBtnHgt = 10;
             headerTemplate[DataSym].layout =
-                "<div style={'height:100%'}>" +
-                "    <FormattedTextBox {...props} fieldKey={'header'} dontSelectOnLoad={'true'} ignoreAutoHeight={'true'} pointerEvents='{this._headerPointerEvents||`none`}' fontSize='{this._headerFontSize}px' height='{this._headerHeight}px' background='{this._headerColor||this.target.mySharedDocs.userColor}' />" +
-                "    <FormattedTextBox {...props} fieldKey={'text'} position='absolute' top='{(this._headerHeight)*scale}px' height='calc({100/scale}% - {this._headerHeight}px)'/>" +
+                "<div style='height:100%'>" +
+                `    <FormattedTextBox {...props} fieldKey={'text'} height='calc(100% - ${headerBtnHgt}px - {this._headerHeight}px)'/>` +
+                "    <FormattedTextBox {...props} fieldKey={'header'}  dontSelectOnLoad='true' ignoreAutoHeight='true' fontSize='{this._headerFontSize}px' height='{this._headerHeight||1}px' background={this._headerColor ||this.target.mySharedDocs.userColor||'lightGray'} />" +
+                `    <HTMLdiv fontSize='${headerBtnHgt - 1}' onClick={‘(this._headerHeight=Math.min(Math.max(1,this._height-30),this._headerHeight===1?50:1)) && (this._autoHeightMargins=this._headerHeight+${headerBtnHgt})’}  height='${headerBtnHgt}px' background='yellow' >Metadata</HTMLdiv>` +
                 "</div>";
+
+            // "<div style={'height:100%'}>" +
+            // "    <FormattedTextBox {...props} fieldKey={'header'} dontSelectOnLoad={'true'} ignoreAutoHeight={'true'} pointerEvents='{this._headerPointerEvents||`none`}' fontSize='{this._headerFontSize}px' height='{this._headerHeight}px' background='{this._headerColor||this.target.mySharedDocs.userColor}' />" +
+            // "    <FormattedTextBox {...props} fieldKey={'text'} position='absolute' top='{(this._headerHeight)*scale}px' height='calc({100/scale}% - {this._headerHeight}px)'/>" +
+            // "</div>";
             (headerTemplate.proto as Doc).isTemplateDoc = makeTemplate(headerTemplate.proto as Doc, true, "headerView");
             doc.emptyHeader = headerTemplate;
             ((doc.emptyHeader as Doc).proto as Doc)["dragFactory-count"] = 0;
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index bf939d57c..65a97a49d 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -235,7 +235,7 @@ export class DocumentDecorations extends React.Component<{ boundsLeft: number, b
         this._resizeUndo = UndoManager.StartBatch("DocDecs resize");
         this._snapX = e.pageX;
         this._snapY = e.pageY;
-        DragManager.docsBeingDragged.forEach(doc => this._dragHeights.set(doc, { start: NumCast(doc._height), lowest: NumCast(doc._height) }));
+        SelectionManager.Views().forEach(docView => this._dragHeights.set(docView.layoutDoc, { start: NumCast(docView.rootDoc._height), lowest: NumCast(docView.rootDoc._height) }));
     }
 
     onPointerMove = (e: PointerEvent, down: number[], move: number[]): boolean => {
@@ -382,7 +382,7 @@ export class DocumentDecorations extends React.Component<{ boundsLeft: number, b
         SnappingManager.clearSnapLines();
 
         // detect autoHeight gesture and apply
-        DragManager.docsBeingDragged.map(doc => ({ doc, hgts: this._dragHeights.get(doc) }))
+        SelectionManager.Views().map(docView => ({ doc: docView.layoutDoc, hgts: this._dragHeights.get(docView.layoutDoc) }))
             .filter(pair => pair.hgts && pair.hgts.lowest < pair.hgts.start && pair.hgts.lowest <= 20)
             .forEach(pair => pair.doc._autoHeight = true);
         //need to change points for resize, or else rotation/control points will fail.
diff --git a/src/client/views/SidebarAnnos.tsx b/src/client/views/SidebarAnnos.tsx
index 59ff1c340..9c5a54574 100644
--- a/src/client/views/SidebarAnnos.tsx
+++ b/src/client/views/SidebarAnnos.tsx
@@ -78,7 +78,9 @@ export class SidebarAnnos extends React.Component<FieldViewProps & ExtraProps> {
     docFilters = () => [...StrListCast(this.props.layoutDoc._docFilters), ...StrListCast(this.props.layoutDoc[this.filtersKey])];
 
     sidebarStyleProvider = (doc: Opt<Doc>, props: Opt<FieldViewProps | DocumentViewProps>, property: string) => {
-        if (property === StyleProp.ShowTitle) return StrCast(this.props.layoutDoc["sidebar-childShowTitle"], "title");
+        if (property === StyleProp.ShowTitle) {
+            return doc === this.props.rootDoc ? 0 : StrCast(this.props.layoutDoc["sidebar-childShowTitle"], "title");
+        }
         return this.props.styleProvider?.(doc, props, property);
     }
     render() {
@@ -117,6 +119,7 @@ export class SidebarAnnos extends React.Component<FieldViewProps & ExtraProps> {
                         styleProvider={this.sidebarStyleProvider}
                         docFilters={this.docFilters}
                         scaleField={this.sidebarKey() + "-scale"}
+                        setHeight={(height) => this.props.setHeight(height + this.filtersHeight())}
                         isAnnotationOverlay={false}
                         select={emptyFunction}
                         scaling={returnOne}
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 42cb02782..95d8f555c 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -124,8 +124,9 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
     @computed get autoHeight() { return this.layoutDoc._autoHeight && !this.props.ignoreAutoHeight; }
     @computed get textHeight() { return NumCast(this.rootDoc[this.fieldKey + "-height"]); }
     @computed get scrollHeight() { return NumCast(this.rootDoc[this.fieldKey + "-scrollHeight"]); }
-    @computed get sidebarHeight() { return NumCast(this.rootDoc[this.SidebarKey + "-height"]); }
+    @computed get sidebarHeight() { return !this.sidebarWidth() ? 0 : NumCast(this.rootDoc[this.SidebarKey + "-height"]); }
     @computed get titleHeight() { return this.props.styleProvider?.(this.layoutDoc, this.props, StyleProp.HeaderMargin) || 0; }
+    @computed get autoHeightMargins() { return this.titleHeight + (this.layoutDoc._autoHeightMargins && !this.props.dontSelectOnLoad ? NumCast(this.layoutDoc._autoHeightMargins) : 0); }
     @computed get _recording() { return this.dataDoc?.mediaState === "recording"; }
     set _recording(value) {
         !this.dataDoc.recordingSource && (this.dataDoc.mediaState = value ? "recording" : undefined);
@@ -780,7 +781,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
     // Since we also monitor all component height changes, this will update the document's height.
     resetNativeHeight = (scrollHeight: number) => {
         const nh = this.layoutDoc.isTemplateForField ? 0 : NumCast(this.layoutDoc._nativeHeight);
-        this.rootDoc[this.fieldKey + "-height"] = scrollHeight + this.titleHeight;
+        this.rootDoc[this.fieldKey + "-height"] = scrollHeight;
         if (nh) this.layoutDoc._nativeHeight = scrollHeight;
     }
 
@@ -793,8 +794,8 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
             ({ width, scrollHeight, autoHeight }) => width && autoHeight && this.resetNativeHeight(scrollHeight)
         );
         this._disposers.componentHeights = reaction(  // set the document height when one of the component heights changes and autoHeight is on
-            () => ({ sidebarHeight: this.sidebarHeight, textHeight: this.textHeight, autoHeight: this.autoHeight }),
-            ({ sidebarHeight, textHeight, autoHeight }) => autoHeight && this.props.setHeight(Math.max(sidebarHeight, textHeight)));
+            () => ({ sidebarHeight: this.sidebarHeight, textHeight: this.textHeight, autoHeight: this.autoHeight, marginsHeight: this.autoHeightMargins }),
+            ({ sidebarHeight, textHeight, autoHeight, marginsHeight }) => autoHeight && this.props.setHeight(marginsHeight + Math.max(sidebarHeight, textHeight)));
         this._disposers.links = reaction(() => DocListCast(this.Document.links), // if a link is deleted, then remove all hyperlinks that reference it from the text's marks
             newLinks => {
                 this._cachedLinks.forEach(l => !newLinks.includes(l) && this.RemoveLinkFromDoc(l));
@@ -1422,16 +1423,15 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
     }
     tryUpdateScrollHeight() {
         if (!LightboxView.LightboxDoc || LightboxView.IsLightboxDocView(this.props.docViewPath())) {
-            setTimeout(() => { // bcz: don't know why this is needed, but without it, the size of the textbox is too big as it includes the size of the title header.  after the timeout, the size seems to get computed correctly.
-                const proseHeight = this.ProseRef?.scrollHeight || 0;
-                const scrollHeight = this.ProseRef && Math.min(NumCast(this.layoutDoc.docMaxAutoHeight, proseHeight), proseHeight);
-                if (scrollHeight && this.props.renderDepth && !this.props.dontRegisterView) {  // if top === 0, then the text box is growing upward (as the overlay caption) which doesn't contribute to the height computation
-                    const setScrollHeight = () => this.rootDoc[this.fieldKey + "-scrollHeight"] = scrollHeight;
-                    if (this.rootDoc === this.layoutDoc.doc || this.layoutDoc.resolvedDataDoc) {
-                        setScrollHeight();
-                    } else setTimeout(setScrollHeight, 10); // if we have a template that hasn't been resolved yet, we can't set the height or we'd be setting it on the unresolved template.  So set a timeout and hope its arrived...
-                }
-            });
+            const margins = 2 * NumCast(this.layoutDoc._yMargin, this.props.yPadding || 0);
+            const proseHeight = !this.ProseRef ? 0 : Array.from(this.ProseRef.children[0].children).reduce((p, child) => p + Number(getComputedStyle(child).height.replace("px", "")), margins);
+            const scrollHeight = this.ProseRef && Math.min(NumCast(this.layoutDoc.docMaxAutoHeight, proseHeight), proseHeight);
+            if (scrollHeight && this.props.renderDepth && !this.props.dontRegisterView) {  // if top === 0, then the text box is growing upward (as the overlay caption) which doesn't contribute to the height computation
+                const setScrollHeight = () => this.rootDoc[this.fieldKey + "-scrollHeight"] = scrollHeight;
+                if (this.rootDoc === this.layoutDoc.doc || this.layoutDoc.resolvedDataDoc) {
+                    setScrollHeight();
+                } else setTimeout(setScrollHeight, 10); // if we have a template that hasn't been resolved yet, we can't set the height or we'd be setting it on the unresolved template.  So set a timeout and hope its arrived...
+            }
         }
     }
     fitToBox = () => this.props.Document._fitToBox;
@@ -1471,6 +1471,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
                     layoutDoc={this.layoutDoc}
                     dataDoc={this.dataDoc}
                     PanelWidth={this.sidebarWidth}
+                    setHeight={this.setSidebarHeight}
                     sidebarAddDocument={this.sidebarAddDocument}
                     moveDocument={this.moveDocument}
                     removeDocument={this.removeDocument}
-- 
cgit v1.2.3-70-g09d2


From e3b1401b854e5f968385dcc469c02fae86308bea Mon Sep 17 00:00:00 2001
From: geireann <60007097+geireann@users.noreply.github.com>
Date: Sat, 17 Jul 2021 13:51:25 -0400
Subject: added broken indices to layoutDoc

:broken_heart:
---
 src/client/views/InkHandles.tsx         | 60 +++++++++++++++++++--------------
 src/client/views/InkStrokeProperties.ts | 31 +++++++++++------
 src/client/views/InkingStroke.tsx       | 60 +++++++++++++++++----------------
 3 files changed, 86 insertions(+), 65 deletions(-)

(limited to 'src')

diff --git a/src/client/views/InkHandles.tsx b/src/client/views/InkHandles.tsx
index ba3fdf9db..ffb6986f1 100644
--- a/src/client/views/InkHandles.tsx
+++ b/src/client/views/InkHandles.tsx
@@ -6,8 +6,12 @@ import { setupMoveUpEvents, emptyFunction } from "../../Utils";
 import { UndoManager } from "../util/UndoManager";
 import { InkData, HandlePoint, HandleLine } from "../../fields/InkField";
 import { Transform } from "../util/Transform";
+import { Doc } from "../../fields/Doc";
+import { listSpec } from "../../fields/Schema";
+import { Cast } from "../../fields/Types";
 
 export interface InkControlProps {
+    inkDoc: Doc;
     data: InkData;
     format: number[];
     ScreenToLocalTransform: () => Transform;
@@ -19,7 +23,7 @@ export class InkHandles extends React.Component<InkControlProps> {
      * Handles the movement of a selected handle point when the user clicks and drags.
      * @param handleNum The index of the currently selected handle point.
      */
-     onHandleDown = (e: React.PointerEvent, handleIndex: number): void => {
+    onHandleDown = (e: React.PointerEvent, handleIndex: number): void => {
         if (InkStrokeProperties.Instance) {
             InkStrokeProperties.Instance.moveControl(0, 0, 1);
             const controlUndo = UndoManager.StartBatch("DocDecs set radius");
@@ -29,9 +33,9 @@ export class InkHandles extends React.Component<InkControlProps> {
             const controlIndex = order === 1 ? handleIndex - 1 : handleIndex + 2;
             document.addEventListener("keydown", (e: KeyboardEvent) => this.onBreakTangent(e, controlIndex), true);
             setupMoveUpEvents(this, e, (e: PointerEvent, down: number[], delta: number[]) => {
-                    InkStrokeProperties.Instance?.moveHandle(-delta[0] * screenScale, -delta[1] * screenScale, handleIndex, oppositeHandleIndex, controlIndex);
-                    return false;
-                }, () => controlUndo?.end(), emptyFunction
+                InkStrokeProperties.Instance?.moveHandle(-delta[0] * screenScale, -delta[1] * screenScale, handleIndex, oppositeHandleIndex, controlIndex);
+                return false;
+            }, () => controlUndo?.end(), emptyFunction
             );
         }
     }
@@ -43,13 +47,19 @@ export class InkHandles extends React.Component<InkControlProps> {
      */
     @action
     onBreakTangent = (e: KeyboardEvent, controlIndex: number) => {
+        const doc: Doc = this.props.inkDoc;
         if (["Alt"].includes(e.key)) {
-            if (!InkStrokeProperties.Instance?._brokenIndices.includes(controlIndex)) {
-                InkStrokeProperties.Instance?._brokenIndices.push(controlIndex);
+            if (doc) {
+                let brokenIndices = Cast(doc.brokenInkIndices, listSpec("number"));
+                if (brokenIndices && brokenIndices.includes(controlIndex)) {
+                    brokenIndices.push(controlIndex);
+                }
+
+                doc.brokenInkIndices = brokenIndices;
             }
         }
     }
- 
+
     render() {
         const formatInstance = InkStrokeProperties.Instance;
         if (!formatInstance) return (null);
@@ -76,33 +86,33 @@ export class InkHandles extends React.Component<InkControlProps> {
             <>
                 {handlePoints.map((pts, i) =>
                     <svg height="10" width="10" key={`hdl${i}`}>
-                        <circle 
-                            cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} 
-                            cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} 
-                            r={strokeWidth / 2} 
-                            strokeWidth={0} 
+                        <circle
+                            cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2}
+                            cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
+                            r={strokeWidth / 2}
+                            strokeWidth={0}
                             fill="#1F85DE"
-                            onPointerDown={(e) => this.onHandleDown(e, pts.I)} 
-                            pointerEvents="all" 
-                            cursor="default" 
+                            onPointerDown={(e) => this.onHandleDown(e, pts.I)}
+                            pointerEvents="all"
+                            cursor="default"
                             display={(pts.dot1 === formatInstance._currentPoint || pts.dot2 === formatInstance._currentPoint) ? "inherit" : "none"} />
                     </svg>)}
                 {handleLines.map((pts, i) =>
                     <svg height="100" width="100" key={`line${i}`}>
-                        <line 
-                            x1={(pts.X1 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} 
+                        <line
+                            x1={(pts.X1 - left - strokeWidth / 2) * scaleX + strokeWidth / 2}
                             y1={(pts.Y1 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
-                            x2={(pts.X2 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} 
-                            y2={(pts.Y2 - top - strokeWidth / 2) * scaleY + strokeWidth / 2} 
-                            stroke="#1F85DE" 
+                            x2={(pts.X2 - left - strokeWidth / 2) * scaleX + strokeWidth / 2}
+                            y2={(pts.Y2 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
+                            stroke="#1F85DE"
                             strokeWidth={dotsize / 8}
                             display={(pts.dot1 === formatInstance._currentPoint || pts.dot2 === formatInstance._currentPoint) ? "inherit" : "none"} />
-                        <line 
-                            x1={(pts.X2 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} 
+                        <line
+                            x1={(pts.X2 - left - strokeWidth / 2) * scaleX + strokeWidth / 2}
                             y1={(pts.Y2 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
-                            x2={(pts.X3 - left - strokeWidth / 2) * scaleX + strokeWidth / 2} 
-                            y2={(pts.Y3 - top - strokeWidth / 2) * scaleY + strokeWidth / 2} 
-                            stroke="#1F85DE" 
+                            x2={(pts.X3 - left - strokeWidth / 2) * scaleX + strokeWidth / 2}
+                            y2={(pts.Y3 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
+                            stroke="#1F85DE"
                             strokeWidth={dotsize / 8}
                             display={(pts.dot1 === formatInstance._currentPoint || pts.dot2 === formatInstance._currentPoint) ? "inherit" : "none"} />
                     </svg>)}
diff --git a/src/client/views/InkStrokeProperties.ts b/src/client/views/InkStrokeProperties.ts
index a3f7562e0..4c225210e 100644
--- a/src/client/views/InkStrokeProperties.ts
+++ b/src/client/views/InkStrokeProperties.ts
@@ -1,7 +1,9 @@
 import { action, computed, observable } from "mobx";
-import { Doc, Field, Opt } from "../../fields/Doc";
+import { Doc, DocListCast, Field, Opt } from "../../fields/Doc";
 import { Document } from "../../fields/documentSchemas";
 import { InkField, InkData, PointData, ControlPoint } from "../../fields/InkField";
+import { List } from "../../fields/List";
+import { listSpec } from "../../fields/Schema";
 import { Cast, NumCast } from "../../fields/Types";
 import { DocumentType } from "../documents/DocumentTypes";
 import { SelectionManager } from "../util/SelectionManager";
@@ -13,7 +15,7 @@ export class InkStrokeProperties {
     @observable _lock = false;
     @observable _controlButton = false;
     @observable _currentPoint = -1;
-    @observable _brokenIndices: number[] = [];
+    // @observable _brokenIndices: List<number> = new List<number>();
 
     constructor() {
         InkStrokeProperties.Instance = this;
@@ -110,14 +112,20 @@ export class InkStrokeProperties {
                 }
                 
             }
+
+            let brokenIndices = Cast(doc.brokenInkIndices, listSpec("number"));
+
             // Updating the indices of the control points whose handle tangency has been broken.
-            this._brokenIndices = this._brokenIndices.map((control) => { 
-                if (control >= newIndex) {
-                    return control + 4; 
-                } else {
-                    return control;
-                }
-            });
+            if(brokenIndices){
+                brokenIndices = new List(brokenIndices.map((control) => { 
+                    if (control >= newIndex) {
+                        return control + 4; 
+                    } else {
+                        return control;
+                    }
+                }));
+            }
+            doc.brokenInkIndices = brokenIndices;
             this._currentPoint = -1;
             return newPoints;
         });
@@ -250,7 +258,7 @@ export class InkStrokeProperties {
 
     snapHandleTangent = (controlIndex: number, handleIndexA: number, handleIndexB: number) => {
         this.applyFunction((doc: Doc, ink: InkData) => {
-            this._brokenIndices.splice(this._brokenIndices.indexOf(controlIndex), 1);
+            // doc.brokenIndices.splice(this._brokenIndices.indexOf(controlIndex), 1);
             const [controlPoint, handleA, handleB] = [ink[controlIndex], ink[handleIndexA], ink[handleIndexB]];
             const oppositeHandleA = this.rotatePoint(handleA, controlPoint, Math.PI);
             const angleDifference = this.angleChange(handleB, oppositeHandleA, controlPoint);
@@ -315,8 +323,9 @@ export class InkStrokeProperties {
             const controlPoint = ink[controlIndex];
             const newHandlePoint = { X: ink[handleIndex].X - deltaX / xScale, Y: ink[handleIndex].Y - deltaY / yScale };
             ink[handleIndex] = newHandlePoint;
+            let brokenIndices = Cast(doc.brokenInkIndices, listSpec("number"));
             // Rotate opposite handle if user hasn't held 'Alt' key or not first/final control (which have only 1 handle).
-            if (!this._brokenIndices.includes(controlIndex) && handleIndex !== 1 && handleIndex !== ink.length - 2) {
+            if (brokenIndices && !brokenIndices.includes(controlIndex) && handleIndex !== 1 && handleIndex !== ink.length - 2) {
                 const angle = this.angleChange(oldHandlePoint, newHandlePoint, controlPoint);
                 oppositeHandlePoint = this.rotatePoint(oppositeHandlePoint, controlPoint, angle);
                 ink[oppositeHandleIndex] = oppositeHandlePoint;
diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx
index b630c20cc..bd71aaf19 100644
--- a/src/client/views/InkingStroke.tsx
+++ b/src/client/views/InkingStroke.tsx
@@ -34,8 +34,8 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         this._properties = InkStrokeProperties.Instance;
     }
 
-    public static LayoutString(fieldStr: string) { 
-        return FieldView.LayoutString(InkingStroke, fieldStr); 
+    public static LayoutString(fieldStr: string) {
+        return FieldView.LayoutString(InkingStroke, fieldStr);
     }
 
     analyzeStrokes() {
@@ -57,9 +57,9 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
      */
     onPointerDown = (e: React.PointerEvent) => {
         if (this.props.isSelected(true)) {
-            setupMoveUpEvents(this, e, returnFalse, emptyFunction, 
+            setupMoveUpEvents(this, e, returnFalse, emptyFunction,
                 action((e: PointerEvent, doubleTap: boolean | undefined) =>
-                doubleTap && this._properties && (this._properties._controlButton = true))
+                    doubleTap && this._properties && (this._properties._controlButton = true))
             );
         }
     }
@@ -68,6 +68,7 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         TraceMobx();
         // Extracting the ink data and formatting information of the current ink stroke.
         const data: InkData = Cast(this.dataDoc[this.fieldKey], InkField)?.inkData ?? [];
+        const inkDoc: Doc = this.layoutDoc;
         const strokeWidth = Number(this.layoutDoc.strokeWidth);
         const lineTop = Math.min(...data.map(p => p.Y));
         const lineBottom = Math.max(...data.map(p => p.Y));
@@ -85,31 +86,31 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         const dotsize = Math.max(width * scaleX, height * scaleY) / 40;
 
         // Visually renders the polygonal line made by the user.
-        const inkLine = InteractionUtils.CreatePolyline(data, left, top, strokeColor, strokeWidth, strokeWidth, 
-            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"), 
-            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker), 
-            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", 
-            this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1, 
+        const inkLine = InteractionUtils.CreatePolyline(data, left, top, strokeColor, strokeWidth, strokeWidth,
+            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
+            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
+            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none",
+            this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1,
             false);
         // Thin blue line indicating that the current ink stroke is selected.
         const selectedLine = InteractionUtils.CreatePolyline(
-            data, lineLeft - strokeWidth * 3, lineTop - strokeWidth * 3, "#1F85DE", strokeWidth / 6, 
-            strokeWidth / 6,StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
+            data, lineLeft - strokeWidth * 3, lineTop - strokeWidth * 3, "#1F85DE", strokeWidth / 6,
+            strokeWidth / 6, StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
             StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
-            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", 
-            this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1, 
+            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none",
+            this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1,
             false);
         // Invisible polygonal line that enables the ink to be selected by the user.
-        const clickableLine = InteractionUtils.CreatePolyline(data, left, top, 
-            this.props.isSelected() && strokeWidth > 5 ? strokeColor : "transparent", strokeWidth, 
-            strokeWidth + 15, StrCast(this.layoutDoc.strokeBezier), 
-            StrCast(this.layoutDoc.fillColor, "none"), "none", "none", undefined, scaleX, scaleY, "", 
+        const clickableLine = InteractionUtils.CreatePolyline(data, left, top,
+            this.props.isSelected() && strokeWidth > 5 ? strokeColor : "transparent", strokeWidth,
+            strokeWidth + 15, StrCast(this.layoutDoc.strokeBezier),
+            StrCast(this.layoutDoc.fillColor, "none"), "none", "none", undefined, scaleX, scaleY, "",
             this.props.layerProvider?.(this.props.Document) === false ? "none" : "visiblepainted", false, true);
         // Set of points rendered upon the ink that can be added if a user clicks on one.
         const addedPoints = InteractionUtils.CreatePoints(data, left, top, strokeColor, strokeWidth, strokeWidth,
             StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
             StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
-            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", 
+            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none",
             this.props.isSelected() && strokeWidth <= 5, false);
 
         return (
@@ -126,25 +127,26 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
                     if (cm) {
                         !Doc.UserDoc().noviceMode && cm.addItem({ description: "Recognize Writing", event: this.analyzeStrokes, icon: "paint-brush" });
                         cm.addItem({ description: "Toggle Mask", event: () => InkingStroke.toggleMask(this.rootDoc), icon: "paint-brush" });
-                        cm.addItem({ description: "Edit Points", event: action(() => {if (this._properties) { this._properties._controlButton = !this._properties._controlButton; }} ), icon: "paint-brush" });
+                        cm.addItem({ description: "Edit Points", event: action(() => { if (this._properties) { this._properties._controlButton = !this._properties._controlButton; } }), icon: "paint-brush" });
                     }
                 }}
             >
-                
+
                 {clickableLine}
                 {inkLine}
                 {this.props.isSelected() ? selectedLine : ""}
-                {this.props.isSelected() && this._properties?._controlButton ? 
+                {this.props.isSelected() && this._properties?._controlButton ?
                     <>
-                        <InkControls 
-                            data={data} 
-                            addedPoints={addedPoints} 
-                            format={[left, top, scaleX, scaleY, strokeWidth, dotsize]} 
+                        <InkControls
+                            data={data}
+                            addedPoints={addedPoints}
+                            format={[left, top, scaleX, scaleY, strokeWidth, dotsize]}
+                            ScreenToLocalTransform={this.props.ScreenToLocalTransform} />
+                        <InkHandles
+                            inkDoc={inkDoc}
+                            data={data}
+                            format={[left, top, scaleX, scaleY, strokeWidth, dotsize]}
                             ScreenToLocalTransform={this.props.ScreenToLocalTransform} />
-                        <InkHandles 
-                            data={data} 
-                            format={[left, top, scaleX, scaleY, strokeWidth, dotsize]} 
-                            ScreenToLocalTransform={this.props.ScreenToLocalTransform} /> 
                     </> : ""}
             </svg>
         );
-- 
cgit v1.2.3-70-g09d2


From 1291e8a45ec9e3aeccd2ca74c0f549a18a16f0d7 Mon Sep 17 00:00:00 2001
From: usodhi <61431818+usodhi@users.noreply.github.com>
Date: Sat, 17 Jul 2021 16:23:29 -0400
Subject: preventing alias of on-screen doc from being added to off-screen doc
 list

---
 src/client/util/CurrentUserUtils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index f3ba7334b..c96a6f656 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -1319,7 +1319,7 @@ Scripting.addGlobal(function dynamicOffScreenDocs(dashboard: Doc) {
         const onScreenTab = DocListCast(dashboard.data)[0];
         const onScreenDocs = DocListCast(onScreenTab.data);
         return new List<Doc>(allDocs.reduce((result: Doc[], doc) => {
-            !onScreenDocs.includes(doc) && (result.push(doc));
+            !onScreenDocs.includes(doc) && !onScreenDocs.includes(doc.aliasOf as Doc) && (result.push(doc));
             return result;
         }, []));
     }
-- 
cgit v1.2.3-70-g09d2


From f8bb8df7a5e1b35f2c6d3bc7bfe6cb7fbf82fd11 Mon Sep 17 00:00:00 2001
From: Ashley Cai <ashley.lcai@gmail.com>
Date: Tue, 20 Jul 2021 14:33:47 -0700
Subject: more color standardization

---
 src/client/views/global/globalCssVariables.scss |   2 +
 src/client/views/nodes/PresBox.scss             | 142 ++++++++++++------------
 2 files changed, 71 insertions(+), 73 deletions(-)

(limited to 'src')

diff --git a/src/client/views/global/globalCssVariables.scss b/src/client/views/global/globalCssVariables.scss
index bdae3b9b1..3a36377f7 100644
--- a/src/client/views/global/globalCssVariables.scss
+++ b/src/client/views/global/globalCssVariables.scss
@@ -11,6 +11,8 @@ $medium-blue: #4476F7;
 $pink: "#E0217D";
 $yellow: "#F5D747";
 
+$drop-shadow: "#32323215";
+
 $antimodemenu-height: 36px;
 
 // fonts
diff --git a/src/client/views/nodes/PresBox.scss b/src/client/views/nodes/PresBox.scss
index 1ba86232b..5d1c5f4eb 100644
--- a/src/client/views/nodes/PresBox.scss
+++ b/src/client/views/nodes/PresBox.scss
@@ -1,7 +1,4 @@
-$light-blue: #AEDDF8;
-$dark-blue: #5B9FDD;
-$light-background: #ececec;
-$dark-grey: #656565;
+@import "../global/globalCssVariables";
 
 .presBox-cont {
     cursor: auto;
@@ -10,7 +7,6 @@ $dark-grey: #656565;
     pointer-events: inherit;
     z-index: 2;
     font-family: Roboto;
-    box-shadow: #AAAAAA .2vw .2vw .4vw;
     width: 100%;
     min-width: 20px;
     height: 100%;
@@ -47,8 +43,8 @@ $dark-grey: #656565;
         align-items: center;
         height: 30px;
         width: 100%;
-        color: white;
-        background-color: #323232;
+        color: $white;
+        background-color: $dark-gray;
 
         .toolbar-button {
             cursor: pointer;
@@ -110,7 +106,7 @@ $dark-grey: #656565;
     }
 
     .toolbar-divider {
-        border-left: solid #ffffff70 0.5px;
+        border-left: solid $medium-gray 0.5px;
         height: 20px;
     }
 }
@@ -118,7 +114,7 @@ $dark-grey: #656565;
 .dropdown {
     font-size: 10;
     margin-left: 5px;
-    color: darkgrey;
+    color: $medium-gray;
     transition: 0.5s ease;
 }
 
@@ -174,7 +170,7 @@ $dark-grey: #656565;
 
     .ribbon-colorBox {
         cursor: pointer;
-        border: solid 1px black;
+        border: solid 1px $black;
         display: flex;
         margin-left: 5px;
         margin-top: 5px;
@@ -191,9 +187,9 @@ $dark-grey: #656565;
         font-size: 11;
         font-weight: 200;
         height: 20;
-        background-color: #ececec;
-        color: black;
-        border: solid 1px black;
+        background-color: $white;
+        color: $black;
+        border: solid 1px $black;
         display: flex;
         margin-left: 5px;
         margin-top: 5px;
@@ -220,11 +216,11 @@ $dark-grey: #656565;
             align-items: center;
             height: 100%;
             width: 100%;
-            background: black;
+            background: $black;
         }
 
         .ribbon-propertyUpDownItem:hover {
-            background: darkgrey;
+            background: $medium-gray;
             transform: scale(1.05);
         }
     }
@@ -239,7 +235,7 @@ $dark-grey: #656565;
 
         .multiThumb-slider {
             display: grid;
-            background-color: $light-background;
+            background-color: $white;
             height: 10px;
             border-radius: 10px;
             overflow: hidden;
@@ -257,8 +253,8 @@ $dark-grey: #656565;
                 -webkit-appearance: none;
                 height: 10px;
                 cursor: ew-resize;
-                background: $dark-blue;
-                box-shadow: -100vw 0 0 100vw $light-background;
+                background: $medium-blue;
+                box-shadow: -100vw 0 0 100vw $white;
             }
 
             .toolbar-slider.end::-webkit-slider-thumb {
@@ -267,7 +263,7 @@ $dark-grey: #656565;
                 -webkit-appearance: none;
                 height: 10px;
                 cursor: ew-resize;
-                background: $dark-blue;
+                background: $medium-blue;
                 box-shadow: -100vw 0 0 100vw $light-blue;
             }
         }
@@ -282,7 +278,7 @@ $dark-grey: #656565;
             height: 10px;
             border-radius: 10px;
             -webkit-appearance: none;
-            background-color: $light-background;
+            background-color: $white;
         }
 
         .toolbar-slider:focus {
@@ -301,7 +297,7 @@ $dark-grey: #656565;
             -webkit-appearance: none;
             height: 10px;
             cursor: ew-resize;
-            background: $dark-blue;
+            background: $medium-blue;
             box-shadow: -100vw 0 0 100vw $light-blue;
         }
 
@@ -318,7 +314,7 @@ $dark-grey: #656565;
             width: 15px;
             min-width: 15px;
             cursor: pointer;
-            background: $light-background;
+            background: $white;
         }
 
         .presBox-checkbox:focus {
@@ -326,7 +322,7 @@ $dark-grey: #656565;
         }
 
         .presBox-checkbox:hover {
-            background: #c0c0c0;
+            background: $light-gray;
         }
 
         .presBox-checkbox:checked {
@@ -381,9 +377,9 @@ $dark-grey: #656565;
         text-align: center;
         font-size: 16;
         width: 90%;
-        color: black;
+        color: $black;
         transform: translate(5%, 0px);
-        border-bottom: solid 2px darkgrey;
+        border-bottom: solid 2px $medium-gray;
     }
 
 
@@ -396,8 +392,8 @@ $dark-grey: #656565;
         justify-self: left;
         margin-top: 5px;
         padding-left: 10px;
-        background-color: $light-background;
-        border: solid 1px black;
+        background-color: $white;
+        border: solid 1px $black;
         min-width: 80px;
         max-width: 200px;
         width: 100%;
@@ -416,7 +412,7 @@ $dark-grey: #656565;
     }
 
     .ribbon-frameSelector {
-        border: black solid 1px;
+        border: $black solid 1px;
         width: 60px;
         height: 20px;
         margin-top: 5px;
@@ -433,12 +429,12 @@ $dark-grey: #656565;
             cursor: pointer;
             position: relative;
             height: 100%;
-            background: $light-background;
+            background: $white;
             display: flex;
             align-items: center;
             justify-content: center;
             text-align: center;
-            color: black;
+            color: $black;
         }
 
         .numKeyframe {
@@ -446,7 +442,7 @@ $dark-grey: #656565;
             font-size: 10;
             font-weight: 600;
             position: relative;
-            color: black;
+            color: $black;
             display: flex;
             width: 100%;
             height: 100%;
@@ -489,7 +485,7 @@ $dark-grey: #656565;
             padding-left: 10;
             padding-right: 10;
             border-radius: 10px;
-            background-color: #979797;
+            background-color: $medium-gray;
         }
 
         .ribbon-final-button:hover {
@@ -508,13 +504,13 @@ $dark-grey: #656565;
             align-items: center;
             margin-bottom: 5px;
             height: 25px;
-            color: lightgrey;
+            color: $light-gray;
             width: 100%;
             max-width: 120;
             padding-left: 10;
             padding-right: 10;
             border-radius: 10px;
-            background-color: black;
+            background-color: $black;
         }
 
         .ribbon-final-button-hidden:hover {
@@ -525,15 +521,15 @@ $dark-grey: #656565;
         .ribbon-frameList {
             width: calc(100% - 5px);
             height: 50px;
-            background-color: #ececec;
-            border: 1px solid #9f9f9f;
+            background-color: $white;
+            border: 1px solid $medium-gray;
             grid-template-rows: max-content;
 
             .frameList-header {
                 display: grid;
                 width: 100%;
                 height: 20px;
-                background-color: #9f9f9f;
+                background-color: $medium-gray;
 
                 .frameList-headerButtons {
                     display: flex;
@@ -588,7 +584,7 @@ $dark-grey: #656565;
         font-size: 10.5;
         font-weight: 300;
         height: 20;
-        background-color: #979797;
+        background-color: $medium-gray;
         color: white;
         display: flex;
         margin-top: 5px;
@@ -607,8 +603,8 @@ $dark-grey: #656565;
         transition: all 0.4s;
         font-weight: 400;
         opacity: 1;
-        color: white;
-        background-color: black;
+        color: $white;
+        background-color: $black;
     }
 
     .ribbon-toggle {
@@ -616,10 +612,10 @@ $dark-grey: #656565;
         font-size: 10.5;
         font-weight: 200;
         height: 20;
-        background-color: $light-background;
+        background-color: $white;
         border: solid 1px rgba(0, 0, 0, 0.5);
         display: flex;
-        color: black;
+        color: $black;
         margin-top: 5px;
         margin-bottom: 5px;
         border-radius: 5px;
@@ -660,13 +656,13 @@ $dark-grey: #656565;
         position: relative;
         font-size: 13;
         padding-bottom: 10px;
-        border-bottom: solid 1px $dark-grey;
+        border-bottom: solid 1px $dark-gray;
 
         .presBox-dropdown:hover {
-            border: solid 1px $dark-blue;
+            border: solid 1px $medium-blue;
 
             .presBox-dropdownIcon {
-                color: $dark-blue;
+                color: $medium-blue;
             }
         }
 
@@ -675,12 +671,12 @@ $dark-grey: #656565;
             display: grid;
             grid-template-columns: auto 20%;
             position: relative;
-            border: solid 1px black;
-            background-color: $light-background;
+            border: solid 1px $black;
+            background-color: $light-gray;
             border-radius: 5px;
             font-size: 10;
             height: 25;
-            color: black;
+            color: $black;
             padding-left: 5px;
             align-items: center;
             margin-top: 5px;
@@ -744,7 +740,7 @@ $dark-grey: #656565;
     height: 100px;
     padding-top: 5px;
     padding-bottom: 5px;
-    border: solid 1px black;
+    border: solid 1px $black;
     // overflow: auto; 
 
     ::-webkit-scrollbar {
@@ -794,7 +790,7 @@ $dark-grey: #656565;
     cursor: pointer;
     position: relative;
     text-align: center;
-    border-left: solid 1px darkgrey;
+    border-left: solid 1px $medium-gray;
     width: 20%;
     height: 100%;
     display: flex;
@@ -825,7 +821,7 @@ $dark-grey: #656565;
     box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.8);
     z-index: 200;
     background-color: white;
-    color: black;
+    color: $black;
     position: absolute;
     overflow: hidden;
 }
@@ -841,12 +837,12 @@ $dark-grey: #656565;
     align-items: center;
     justify-content: center;
     transform: translate(0px, -1px);
-    background-color: $light-background;
+    background-color: $white;
     width: 40px;
     height: 15px;
     align-self: center;
     justify-self: center;
-    border: solid 1px black;
+    border: solid 1px $black;
     border-top: 0px;
     border-bottom-right-radius: 7px;
     border-bottom-left-radius: 7px;
@@ -855,15 +851,15 @@ $dark-grey: #656565;
 .layout-container {
     padding: 5px;
     display: grid;
-    background-color: $light-background;
+    background-color: $white;
     grid-template-columns: repeat(auto-fit, minmax(90px, 100px));
     width: 100%;
-    border: solid 1px black;
+    border: solid 1px $black;
     min-width: 100px;
     overflow: hidden;
 
     .layout:hover {
-        border: solid 2px #5c9edd;
+        border: solid 2px $medium-blue;
     }
 
     .layout {
@@ -878,7 +874,7 @@ $dark-grey: #656565;
         width: 90px;
         overflow: hidden;
         background-color: white;
-        border: solid darkgrey 1px;
+        border: solid $medium-gray 1px;
         display: grid;
         grid-template-rows: auto;
         align-items: center;
@@ -893,7 +889,7 @@ $dark-grey: #656565;
             height: 13;
             font-size: 12;
             display: flex;
-            background-color: #f1efec;
+            background-color: #white;
         }
 
         .subtitle {
@@ -906,7 +902,7 @@ $dark-grey: #656565;
             height: 13;
             font-size: 9;
             display: flex;
-            background-color: #f1efec;
+            background-color: $white;
         }
 
         .content {
@@ -919,7 +915,7 @@ $dark-grey: #656565;
             height: 13;
             font-size: 10;
             display: flex;
-            background-color: #f1efec;
+            background-color: $white;
             height: 33;
             text-align: left;
             font-size: 8px;
@@ -960,8 +956,8 @@ $dark-grey: #656565;
 
 
     select {
-        background: #323232;
-        color: white;
+        background: $dark-gray;
+        color: $white;
     }
 
     .presBox-button {
@@ -975,8 +971,8 @@ $dark-grey: #656565;
         text-align: center;
         letter-spacing: normal;
         width: inherit;
-        background: #323232;
-        color: white;
+        background: $dark-gray;
+        color: $white;
     }
 
     .presBox-button.active {
@@ -984,7 +980,7 @@ $dark-grey: #656565;
     }
 
     .presBox-button.active:hover {
-        background-color: #233163;
+        background-color: $medium-blue;
     }
 
     .presBox-button.edit {
@@ -1053,8 +1049,8 @@ $dark-grey: #656565;
             font-size: 100;
             display: flex;
             align-items: center;
-            background: #323232;
-            color: white;
+            background: $dark-gray;
+            color: $white;
         }
 
         .presBox-viewPicker {
@@ -1086,7 +1082,7 @@ $dark-grey: #656565;
     top: 10;
     opacity: 0.1;
     transition: all 0.4s;
-    color: white;
+    color: $white;
 }
 
 .miniPres:hover {
@@ -1094,8 +1090,8 @@ $dark-grey: #656565;
 }
 
 .presPanelOverlay {
-    background-color: #323232;
-    color: white;
+    background-color: $dark-gray;
+    color: $white;
     border-radius: 5px;
     grid-template-rows: 100%;
     height: 25;
@@ -1129,7 +1125,7 @@ $dark-grey: #656565;
     .presPanel-divider {
         width: 0.5px;
         height: 80%;
-        border-right: solid 1px #5a5a5a;
+        border-right: solid 1px $medium-gray;
     }
 
     .presPanel-button-frame {
@@ -1161,12 +1157,12 @@ $dark-grey: #656565;
     }
 
     .presPanel-button:hover {
-        background-color: #5a5a5a;
+        background-color: $medium-gray;
         transform: scale(1.2);
     }
 
     .presPanel-button-text:hover {
-        background-color: #5a5a5a;
+        background-color: $medium-gray;
     }
 
 
-- 
cgit v1.2.3-70-g09d2


From 98893e0944f7e04455a30fa128b1c91954c8a16d Mon Sep 17 00:00:00 2001
From: Ashley Cai <ashley.lcai@gmail.com>
Date: Tue, 20 Jul 2021 15:12:24 -0700
Subject: Padding and font size

---
 src/client/views/collections/CollectionMenu.scss |  4 ++--
 src/client/views/global/globalCssVariables.scss  | 19 ++++++++++++++-----
 src/client/views/global/globalEnums.tsx          | 18 ++++++++++++++++--
 3 files changed, 32 insertions(+), 9 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionMenu.scss b/src/client/views/collections/CollectionMenu.scss
index 7e507d6b5..1a9a6d5d9 100644
--- a/src/client/views/collections/CollectionMenu.scss
+++ b/src/client/views/collections/CollectionMenu.scss
@@ -425,7 +425,7 @@
     padding: 12px 10px 11px 10px;
     border: 0px;
     color: black;
-    font-size: 10px;
+    font-size: 9px;
     letter-spacing: 2px;
     outline-color: black;
     background: rgb(238, 238, 238);
@@ -508,7 +508,7 @@
 
 .collectionSchemaViewChrome-cont {
     display: flex;
-    font-size: 10.5px;
+    font-size: 9px;
 
     .collectionSchemaViewChrome-toggle {
         display: flex;
diff --git a/src/client/views/global/globalCssVariables.scss b/src/client/views/global/globalCssVariables.scss
index 3a36377f7..ead5e166e 100644
--- a/src/client/views/global/globalCssVariables.scss
+++ b/src/client/views/global/globalCssVariables.scss
@@ -8,21 +8,30 @@ $black: #000000;
 
 $light-blue: #BDDDF5;
 $medium-blue: #4476F7;
-$pink: "#E0217D";
-$yellow: "#F5D747";
+$pink: #E0217D;
+$yellow: #F5D747;
 
 $drop-shadow: "#32323215";
 
+//padding
+$minimum-padding: 4px;
+$medium-padding: 16px;
+$large-padding: 32px;
+
+//icon sizes
+$icon-size: 28px;
+
 $antimodemenu-height: 36px;
 
 // fonts
-$sans-serif: "Noto Sans",
-sans-serif;
+$sans-serif: "Noto Sans", sans-serif;
+$large-header: 16px;
+$body-text: 12px;
+$small-text: 9px;
 // $sans-serif: "Roboto Slab", sans-serif;
 
 // misc values
 $border-radius: 0.3em;
-//
 $search-thumnail-size: 130;
 
 // dragged items
diff --git a/src/client/views/global/globalEnums.tsx b/src/client/views/global/globalEnums.tsx
index 80558e1c1..1e0381c33 100644
--- a/src/client/views/global/globalEnums.tsx
+++ b/src/client/views/global/globalEnums.tsx
@@ -7,14 +7,28 @@ export enum Colors {
     MEDIUM_BLUE = "#4476F7",
     LIGHT_BLUE = "#BDDDF5",
     PINK = "#E0217D",
-    YELLOW = "#F5D747"
+    YELLOW = "#F5D747",
+    DROP_SHADOW = "#32323215",
 }
 
 export enum FontSizes {
-    LargeHeader = "16px"
+    //Bolded
+    LARGE_HEADER = "16px",
 
+    //Bolded or unbolded
+    BODY_TEXT = "12px",
+
+    //Bolded
+    SMALL_TEXT = "9px",
 }
 
 export enum Padding {
+    MINIMUM_PADDING = "4px",
+    SMALL_PADDING = "8px",
+    MEDIUM_PADDING = "16px",
+    LARGE_PADDING = "32px",
+}
 
+export enum IconSizes {
+    ICON_SIZE = "28px",
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From af33c5a46f0680dad41532a86557193bf8af3b08 Mon Sep 17 00:00:00 2001
From: Ashley Cai <ashley.lcai@gmail.com>
Date: Tue, 20 Jul 2021 15:21:54 -0700
Subject: standardizing edits

---
 src/client/views/collections/CollectionMenu.scss | 135 +++++++++++------------
 1 file changed, 67 insertions(+), 68 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionMenu.scss b/src/client/views/collections/CollectionMenu.scss
index 1a9a6d5d9..c0fc774d3 100644
--- a/src/client/views/collections/CollectionMenu.scss
+++ b/src/client/views/collections/CollectionMenu.scss
@@ -1,6 +1,5 @@
 @import "../global/globalCssVariables";
 
-
 .collectionMenu-cont {
     position: relative;
     display: inline-flex;
@@ -8,8 +7,8 @@
     opacity: 0.9;
     z-index: 901;
     transition: top .5s;
-    background: #323232;
-    color: white;
+    background: $dark-gray;
+    color: $white;
     transform-origin: top left;
     top: 0;
     width: 100%;
@@ -18,7 +17,7 @@
         border-radius: 100%;
         width: 18px;
         height: 18px;
-        border: solid 1px #f5f5f5;
+        border: solid 1px $white;
         display: flex;
         align-items: center;
         justify-content: center;
@@ -28,7 +27,7 @@
         border-radius: 100%;
         width: 70%;
         height: 70%;
-        background: white;
+        background: $white;
     }
 
     .collectionMenu {
@@ -43,7 +42,7 @@
             margin-left: 3px;
             margin-right: 3px;
             width: 1.5px;
-            background-color: #656060;
+            background-color: $medium-gray;
         }
 
         .collectionViewBaseChrome {
@@ -51,11 +50,11 @@
             align-items: center;
 
             .collectionViewBaseChrome-viewPicker {
-                font-size: 75%;
-                outline-color: black;
-                color: white;
+                font-size: $small-text;
+                outline-color: $black;
+                color: $white;
                 border: none;
-                background: #323232;               
+                background: $dark-gray;               
             }
 
             .collectionViewBaseChrome-viewPicker:focus {
@@ -64,16 +63,16 @@
             }
 
             .collectionViewBaseChrome-viewPicker:active {
-                outline-color: black;
+                outline-color: $black;
             }
 
             .collectionViewBaseChrome-button {
-                font-size: 75%;
+                font-size: $small-text;
                 text-transform: uppercase;
                 letter-spacing: 2px;
-                background: rgb(238, 238, 238);
-                color: purple;
-                outline-color: black;
+                background: $white;
+                color: $pink;
+                outline-color: $black;
                 border: none;
                 padding: 12px 10px 11px 10px;
                 margin-left: 10px;
@@ -82,11 +81,11 @@
             .collectionViewBaseChrome-cmdPicker {
                 margin-left: 3px;
                 margin-right: 0px;
-                font-size: 75%;
+                font-size: $small-text;
                 text-transform: capitalize;
-                color: white;
+                color: $white;
                 border: none;
-                background: #323232;     
+                background: $dark-gray;     
             }
 
             .collectionViewBaseChrome-cmdPicker:focus {
@@ -105,7 +104,7 @@
                 overflow: hidden;
 
                 .commandEntry-drop {
-                    color: white;
+                    color: $white;
                     width: 30px;
                     margin-top: auto;
                     margin-bottom: auto;
@@ -113,11 +112,11 @@
             }
 
             .commandEntry-outerDiv:hover{
-                background-color: rgba(0,0,0,0.2);
+                background-color: $drop-shadow;
 
                 .collectionViewBaseChrome-viewPicker,
                 .collectionViewBaseChrome-cmdPicker{
-                    background: rgb(41,41,41);
+                    background: $dark-gray;
                 }
             }
 
@@ -142,7 +141,7 @@
                 height: 100%;
                 display: flex;
                 background: transparent;
-                color: grey;
+                color: $medium-gray;
                 justify-content: center;
             }
 
@@ -150,31 +149,31 @@
                 margin-left: 5px;
                 display: grid;
                 border: none;
-                border-right: solid gray 1px;
+                border-right: solid $medium-gray 1px;
 
                 .collectionViewBaseChrome-filterIcon {
                     position: relative;
                     display: flex;
                     margin: auto;
-                    background: #323232;
-                    color: white;
+                    background: $dark-gray;
+                    color: $white;
                     width: 30px;
                     height: 30px;
                     align-items: center;
                     justify-content: center;
                     border: none;
-                    border-right: solid gray 1px;
+                    border-right: solid $medium-gray 1px;
                 }
 
                 .collectionViewBaseChrome-viewSpecsInput {
                     padding: 12px 10px 11px 10px;
                     border: 0px;
-                    color: grey;
+                    color: $medium-gray;
                     text-align: center;
                     letter-spacing: 2px;
-                    outline-color: black;
-                    font-size: 75%;
-                    background: rgb(238, 238, 238);
+                    outline-color: $black;
+                    font-size: $small-text;
+                    background: $white;
                     height: 100%;
                     width: 75px;
                 }
@@ -187,8 +186,8 @@
                     z-index: 100;
                     display: flex;
                     flex-direction: column;
-                    background: rgb(238, 238, 238);
-                    box-shadow: grey 2px 2px 4px;
+                    background: $white;
+                    box-shadow: $medium-gray 2px 2px 4px;
 
                     .qs-datepicker {
                         left: unset;
@@ -204,13 +203,13 @@
                         .collectionViewBaseChrome-viewSpecsMenu-rowLeft,
                         .collectionViewBaseChrome-viewSpecsMenu-rowMiddle,
                         .collectionViewBaseChrome-viewSpecsMenu-rowRight {
-                            font-size: 75%;
+                            font-size: $small-text;
                             letter-spacing: 2px;
-                            color: grey;
+                            color: $medium-gray;
                             margin-left: 10px;
                             padding: 5px;
                             border: none;
-                            outline-color: black;
+                            outline-color: $black;
                         }
                     }
 
@@ -236,19 +235,19 @@
             margin-left: 10;
 
             .collectionGridViewChrome-viewPicker {
-                font-size: 75%;
+                font-size: $small-text;
                 //text-transform: uppercase;
                 //letter-spacing: 2px;
-                background: #121721;
-                color: white;
-                outline-color: black;
-                color: white;
+                background: $dark-gray;
+                color: $white;
+                outline-color: $black;
+                color: $white;
                 border: none;
-                border-right: solid gray 1px;
+                border-right: solid $medium-gray 1px;
             }
 
             .collectionGridViewChrome-viewPicker:active {
-                outline-color: black;
+                outline-color: $black;
             }
 
             .grid-control {
@@ -268,11 +267,11 @@
 
                 .collectionGridViewChrome-entryBox {
                     width: 50%;
-                    color: black;
+                    color: $black;
                 }
 
                 .collectionGridViewChrome-columnButton {
-                    color: black;
+                    color: $black;
                 }
             }
         }
@@ -302,7 +301,7 @@
             align-items: center;
             display: flex;
             grid-auto-columns: auto;
-            font-size: 75%;
+            font-size: $small-text;
             letter-spacing: 2px;
 
             .collectionStackingViewChrome-pivotField-label,
@@ -311,7 +310,7 @@
                 grid-column: 1;
                 margin-right: 7px;
                 user-select: none;
-                font-family: 'Roboto';
+                font-family: $sans-serif;
                 letter-spacing: normal;
             }
 
@@ -329,13 +328,13 @@
             }
 
             .collectionStackingViewChrome-sortIcon:hover {
-                background-color: rgba(0,0,0,0.2);
+                background-color: $drop-shadow;
             }
 
             .collectionStackingViewChrome-pivotField,
             .collectionTreeViewChrome-pivotField,
             .collection3DCarouselViewChrome-scrollSpeed {
-                color: white;
+                color: $white;
                 grid-column: 2;
                 grid-row: 1;
                 width: 90%;
@@ -344,7 +343,7 @@
                 height: 80%;
                 border-radius: 7px;
                 align-items: center;
-                background: #eeeeee;
+                background: $white;
 
                 .editable-view-input,
                 input,
@@ -352,16 +351,16 @@
                 .editableView-container-editing {
                     margin: auto;
                     border: 0px;
-                    color: grey !important;
+                    color: $light-gray !important;
                     text-align: center;
                     letter-spacing: 2px;
-                    outline-color: black;
+                    outline-color: $black;
                     height: 100%;
                 }
 
                 .react-autosuggest__container {
                     margin: 0;
-                    color: grey;
+                    color: $medium-gray;
                     padding: 0px;
                 }
             }
@@ -424,11 +423,11 @@
 .collectionMenu-urlInput {
     padding: 12px 10px 11px 10px;
     border: 0px;
-    color: black;
-    font-size: 9px;
+    color: $black;
+    font-size: $small-text;
     letter-spacing: 2px;
-    outline-color: black;
-    background: rgb(238, 238, 238);
+    outline-color: $black;
+    background: $white;
     width: 100%;
     min-width: 350px;
     margin-right: 10px;
@@ -477,10 +476,10 @@
         width: 20;
         height: 30;
         bottom: 0;
-        background: #323232;
+        background: $dark-gray;
         display: inline-flex;
         align-items: center;
-        color: white;
+        color: $white;
     }
 
     .backKeyframe {
@@ -502,13 +501,13 @@
             margin: auto;
         }
 
-        border-right: solid gray 1px;
+        border-right: solid $medium-gray 1px;
     }
 }
 
 .collectionSchemaViewChrome-cont {
     display: flex;
-    font-size: 9px;
+    font-size: $small-text;
 
     .collectionSchemaViewChrome-toggle {
         display: flex;
@@ -527,7 +526,7 @@
     .collectionSchemaViewChrome-toggler {
         width: 100px;
         height: 35px;
-        background-color: black;
+        background-color: $black;
         position: relative;
     }
 
@@ -539,7 +538,7 @@
         transition: all 0.5s ease;
         // top: 3px;
         margin-top: 3px;
-        color: gray;
+        color: $medium-gray;
         letter-spacing: 2px;
         text-transform: uppercase;
         display: flex;
@@ -579,7 +578,7 @@
 }
 
 .react-autosuggest__input {
-    border: 1px solid #aaa;
+    border: 1px solid $light-gray;
     border-radius: 4px;
     width: 100%;
 }
@@ -603,11 +602,11 @@
     overflow-y: auto;
     max-height: 400px;
     width: 180px;
-    border: 1px solid #aaa;
-    background-color: #fff;
-    font-family: Helvetica, sans-serif;
+    border: 1px solid $light-gray;
+    background-color: $white;
+    font-family: $sans-serif;
     font-weight: 300;
-    font-size: 16px;
+    font-size: $large-header;
     border-bottom-left-radius: 4px;
     border-bottom-right-radius: 4px;
     z-index: 2;
@@ -625,5 +624,5 @@
 }
 
 .react-autosuggest__suggestion--highlighted {
-    background-color: #ddd;
+    background-color: $light-gray;
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From d358e6952effeb933ab57e4b343d8f0886077d55 Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Wed, 21 Jul 2021 08:52:22 -0400
Subject: fixed date formatting

---
 .../collectionSchema/CollectionSchemaCells.tsx            | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx
index f75179cea..a8d901f4d 100644
--- a/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx
@@ -351,13 +351,16 @@ export class CollectionSchemaDateCell extends CollectionSchemaCell {
         //}
     }
 
+    // If the cell is not clicked on, render the date normally. Otherwise, render a date picker.
     render() {
-        return !this.props.isFocused ? <span onPointerDown={this.onPointerDown}>{this._date ? Field.toString(this._date as Field) : "--"}</span> :
-            <DatePicker
-                selected={this._date?.date || new Date}
-                onSelect={date => this.handleChange(date)}
-                onChange={date => this.handleChange(date)}
-            />;
+        return !this.props.isFocused ? <span style={{ paddingLeft: 20 + "px" }} onPointerDown={this.onPointerDown}>{this._date ? Field.toString(this._date as Field) : "--"}</span> :
+            <div style={{ paddingLeft: 20 + "px" }}>
+                <DatePicker
+                    selected={this._date?.date || new Date}
+                    onSelect={date => this.handleChange(date)}
+                    onChange={date => this.handleChange(date)}
+                />
+            </div>
     }
 }
 
-- 
cgit v1.2.3-70-g09d2


From d5030554055d7f11caba3d95f3d082dbf066f55c Mon Sep 17 00:00:00 2001
From: 0x85FB9C51 <77808164+0x85FB9C51@users.noreply.github.com>
Date: Wed, 21 Jul 2021 08:55:13 -0400
Subject: Revert "fixed date formatting"

This reverts commit d358e6952effeb933ab57e4b343d8f0886077d55.
---
 .../collectionSchema/CollectionSchemaCells.tsx            | 15 ++++++---------
 1 file changed, 6 insertions(+), 9 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx
index a8d901f4d..f75179cea 100644
--- a/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx
@@ -351,16 +351,13 @@ export class CollectionSchemaDateCell extends CollectionSchemaCell {
         //}
     }
 
-    // If the cell is not clicked on, render the date normally. Otherwise, render a date picker.
     render() {
-        return !this.props.isFocused ? <span style={{ paddingLeft: 20 + "px" }} onPointerDown={this.onPointerDown}>{this._date ? Field.toString(this._date as Field) : "--"}</span> :
-            <div style={{ paddingLeft: 20 + "px" }}>
-                <DatePicker
-                    selected={this._date?.date || new Date}
-                    onSelect={date => this.handleChange(date)}
-                    onChange={date => this.handleChange(date)}
-                />
-            </div>
+        return !this.props.isFocused ? <span onPointerDown={this.onPointerDown}>{this._date ? Field.toString(this._date as Field) : "--"}</span> :
+            <DatePicker
+                selected={this._date?.date || new Date}
+                onSelect={date => this.handleChange(date)}
+                onChange={date => this.handleChange(date)}
+            />;
     }
 }
 
-- 
cgit v1.2.3-70-g09d2


From fff9e78427c0373a2a0843d6d8ac1aa24ed7b9e2 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 21 Jul 2021 09:26:56 -0400
Subject: made annotation button clickable for pdf/web when titles are shown.

---
 src/client/views/nodes/PDFBox.scss | 5 +++--
 src/client/views/nodes/WebBox.scss | 1 +
 2 files changed, 4 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/PDFBox.scss b/src/client/views/nodes/PDFBox.scss
index 0f46da294..72dec6e4c 100644
--- a/src/client/views/nodes/PDFBox.scss
+++ b/src/client/views/nodes/PDFBox.scss
@@ -7,7 +7,7 @@
     overflow: hidden;
     cursor: auto;
     transform-origin: top left;
-    z-index: 0;
+    //z-index: 0;
 
     .pdfBox-ui {
         position: absolute;
@@ -30,6 +30,7 @@
             justify-content: center;
             border-radius: 3px;
             pointer-events: all;
+            z-index: 1; // so it appears on top of the document's title, if shown
         }
 
         .pdfBox-pageNums {
@@ -223,7 +224,7 @@
 .pdfBox {
     width: 100%;
     height: 100%;
-    pointer-events: none;
+    //pointer-events: none;
     .pdfViewerDash-text {
         .textLayer {
             display: none;
diff --git a/src/client/views/nodes/WebBox.scss b/src/client/views/nodes/WebBox.scss
index ca82c049c..aae9cd37f 100644
--- a/src/client/views/nodes/WebBox.scss
+++ b/src/client/views/nodes/WebBox.scss
@@ -17,6 +17,7 @@
         justify-content: center;
         border-radius: 3px;
         pointer-events: all;
+        z-index: 1; // so it appears on top of the document's title, if shown
     }
 
     .pdfViewerDash-dragAnnotationBox {
-- 
cgit v1.2.3-70-g09d2


From fabaad0251cf4f64c1af7a37a5f3d6622011c058 Mon Sep 17 00:00:00 2001
From: vkalev <vjk1883@gmail.com>
Date: Thu, 22 Jul 2021 11:30:18 -0400
Subject: adding broken indices to layoutDoc working

---
 src/client/views/InkControls.tsx        | 11 ++++++-----
 src/client/views/InkHandles.tsx         | 12 ++++++------
 src/client/views/InkStrokeProperties.ts | 11 ++++-------
 3 files changed, 16 insertions(+), 18 deletions(-)

(limited to 'src')

diff --git a/src/client/views/InkControls.tsx b/src/client/views/InkControls.tsx
index da7b0df16..23f22c774 100644
--- a/src/client/views/InkControls.tsx
+++ b/src/client/views/InkControls.tsx
@@ -16,7 +16,6 @@ export interface InkControlProps {
 
 @observer
 export class InkControls extends React.Component<InkControlProps> {
-    // @observable private _controlPoints: ControlPoint[] = [];
     @observable private _overControl = -1;
     @observable private _overAddPoint = -1;
 
@@ -38,10 +37,12 @@ export class InkControls extends React.Component<InkControlProps> {
                     InkStrokeProperties.Instance?.moveControl(-delta[0] * screenScale, -delta[1] * screenScale, controlIndex);
                     return false;
                 },
-                () => controlUndo?.end(), action((e: PointerEvent, doubleTap: boolean | undefined) =>
-                { if (doubleTap && InkStrokeProperties.Instance?._brokenIndices.includes(controlIndex)) {
-                    InkStrokeProperties.Instance?.snapHandleTangent(controlIndex, handleIndexA, handleIndexB);
-                }}));
+                () => controlUndo?.end(), 
+                emptyFunction);
+                // action((e: PointerEvent, doubleTap: boolean | undefined) =>
+                // { if (doubleTap && InkStrokeProperties.Instance?._brokenIndices.includes(controlIndex)) {
+                //     InkStrokeProperties.Instance?.snapHandleTangent(controlIndex, handleIndexA, handleIndexB);
+                // }}));
         }
     }
 
diff --git a/src/client/views/InkHandles.tsx b/src/client/views/InkHandles.tsx
index ffb6986f1..28b6dd820 100644
--- a/src/client/views/InkHandles.tsx
+++ b/src/client/views/InkHandles.tsx
@@ -8,9 +8,10 @@ import { InkData, HandlePoint, HandleLine } from "../../fields/InkField";
 import { Transform } from "../util/Transform";
 import { Doc } from "../../fields/Doc";
 import { listSpec } from "../../fields/Schema";
+import { List } from "../../fields/List";
 import { Cast } from "../../fields/Types";
 
-export interface InkControlProps {
+export interface InkHandlesProps {
     inkDoc: Doc;
     data: InkData;
     format: number[];
@@ -18,7 +19,7 @@ export interface InkControlProps {
 }
 
 @observer
-export class InkHandles extends React.Component<InkControlProps> {
+export class InkHandles extends React.Component<InkHandlesProps> {
     /**
      * Handles the movement of a selected handle point when the user clicks and drags.
      * @param handleNum The index of the currently selected handle point.
@@ -50,11 +51,10 @@ export class InkHandles extends React.Component<InkControlProps> {
         const doc: Doc = this.props.inkDoc;
         if (["Alt"].includes(e.key)) {
             if (doc) {
-                let brokenIndices = Cast(doc.brokenInkIndices, listSpec("number"));
-                if (brokenIndices && brokenIndices.includes(controlIndex)) {
+                const brokenIndices = Cast(doc.brokenInkIndices, listSpec("number")) || new List;
+                if (brokenIndices && !brokenIndices.includes(controlIndex)) {
                     brokenIndices.push(controlIndex);
                 }
-
                 doc.brokenInkIndices = brokenIndices;
             }
         }
@@ -73,7 +73,7 @@ export class InkHandles extends React.Component<InkControlProps> {
                 handlePoints.push({ X: data[i + 1].X, Y: data[i + 1].Y, I: i + 1, dot1: i, dot2: i === 0 ? i : i - 1 });
                 handlePoints.push({ X: data[i + 2].X, Y: data[i + 2].Y, I: i + 2, dot1: i + 3, dot2: i === data.length ? i + 3 : i + 4 });
             }
-            // adding first and last (single) handle lines
+            // Adding first and last (single) handle lines.
             handleLines.push({ X1: data[0].X, Y1: data[0].Y, X2: data[0].X, Y2: data[0].Y, X3: data[1].X, Y3: data[1].Y, dot1: 0, dot2: 0 });
             handleLines.push({ X1: data[data.length - 2].X, Y1: data[data.length - 2].Y, X2: data[data.length - 1].X, Y2: data[data.length - 1].Y, X3: data[data.length - 1].X, Y3: data[data.length - 1].Y, dot1: data.length - 1, dot2: data.length - 1 });
             for (let i = 2; i < data.length - 4; i += 4) {
diff --git a/src/client/views/InkStrokeProperties.ts b/src/client/views/InkStrokeProperties.ts
index 4c225210e..f218b4fbf 100644
--- a/src/client/views/InkStrokeProperties.ts
+++ b/src/client/views/InkStrokeProperties.ts
@@ -15,7 +15,6 @@ export class InkStrokeProperties {
     @observable _lock = false;
     @observable _controlButton = false;
     @observable _currentPoint = -1;
-    // @observable _brokenIndices: List<number> = new List<number>();
 
     constructor() {
         InkStrokeProperties.Instance = this;
@@ -112,11 +111,9 @@ export class InkStrokeProperties {
                 }
                 
             }
-
             let brokenIndices = Cast(doc.brokenInkIndices, listSpec("number"));
-
             // Updating the indices of the control points whose handle tangency has been broken.
-            if(brokenIndices){
+            if (brokenIndices) {
                 brokenIndices = new List(brokenIndices.map((control) => { 
                     if (control >= newIndex) {
                         return control + 4; 
@@ -283,7 +280,7 @@ export class InkStrokeProperties {
     }
 
     /**
-     * Finds the angle between two inputted vectors.
+     * Finds the angle (in radians) between two inputted vectors.
      * 
      * α = arccos(a·b / |a|·|b|), where a and b are both vectors.
      */
@@ -323,9 +320,9 @@ export class InkStrokeProperties {
             const controlPoint = ink[controlIndex];
             const newHandlePoint = { X: ink[handleIndex].X - deltaX / xScale, Y: ink[handleIndex].Y - deltaY / yScale };
             ink[handleIndex] = newHandlePoint;
-            let brokenIndices = Cast(doc.brokenInkIndices, listSpec("number"));
+            const brokenIndices = Cast(doc.brokenInkIndices, listSpec("number"));
             // Rotate opposite handle if user hasn't held 'Alt' key or not first/final control (which have only 1 handle).
-            if (brokenIndices && !brokenIndices.includes(controlIndex) && handleIndex !== 1 && handleIndex !== ink.length - 2) {
+            if ((!brokenIndices || !brokenIndices?.includes(controlIndex)) && handleIndex !== 1 && handleIndex !== ink.length - 2) {
                 const angle = this.angleChange(oldHandlePoint, newHandlePoint, controlPoint);
                 oppositeHandlePoint = this.rotatePoint(oppositeHandlePoint, controlPoint, angle);
                 ink[oppositeHandleIndex] = oppositeHandlePoint;
-- 
cgit v1.2.3-70-g09d2


From 44f74e1e8ee82e76d32c6e5e0812ac04bf81c16c Mon Sep 17 00:00:00 2001
From: vkalev <vjk1883@gmail.com>
Date: Thu, 22 Jul 2021 11:58:30 -0400
Subject: additional comments

---
 src/client/views/InkStrokeProperties.ts | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/InkStrokeProperties.ts b/src/client/views/InkStrokeProperties.ts
index f218b4fbf..1a3585f3e 100644
--- a/src/client/views/InkStrokeProperties.ts
+++ b/src/client/views/InkStrokeProperties.ts
@@ -94,15 +94,17 @@ export class InkStrokeProperties {
             if (end === 0) end = points.length-1;
             // Index of new control point with regards to the ink data.
             const newIndex = Math.floor(counter / 2) * 4 + 2;
-            // Creating new ink data with new control point and handle points inputted.
+            // Creating new ink data with the new control point and handle points inputted.
             for (let i = 0; i < ink.length; i++) {
                 if (i === newIndex) { 
                     const [handleA, handleB] = this.getNewHandlePoints(points.slice(start, index+1), points.slice(index, end), newControl);
                     newPoints.push(handleA, newControl, newControl, handleB);
+                    // Adjusting the magnitude of the left handle line of the right neighboring control point.
                     const [rightControl, rightHandle]  = [points[end], ink[i]];
                     const scaledVector = this.getScaledHandlePoint(false, start, end, index, rightControl, rightHandle);
                     rightHandle && newPoints.push({ X: rightControl.X - scaledVector.X, Y: rightControl.Y - scaledVector.Y });
                 } else if (i === newIndex - 1) {
+                    // Adjusting the magnitude of the right handle line of the left neighboring control point.
                     const [leftControl, leftHandle] = [points[start], ink[i]];
                     const scaledVector = this.getScaledHandlePoint(true, start, end, index, leftControl, leftHandle);
                     leftHandle && newPoints.push({ X: leftControl.X - scaledVector.X, Y: leftControl.Y - scaledVector.Y });
@@ -157,6 +159,8 @@ export class InkStrokeProperties {
         const [m, n] = [C.length, D.length];
         let handleSizeA = Math.sqrt((Math.pow(newControl.X - C[0].X, 2)) + (Math.pow(newControl.Y - C[0].Y, 2)));
         let handleSizeB = Math.sqrt((Math.pow(D[n-1].X - newControl.X, 2)) + (Math.pow(D[n-1].Y - newControl.Y, 2)));
+        // Scaling adjustments to improve the ratio between the magnitudes of the two handle lines.
+        // (Ensures that the new point added doesn't augment the inital shape of the curve much).
         if (handleSizeA < 75 && handleSizeB < 75) {
             handleSizeA *= 3;
             handleSizeB *= 3;
-- 
cgit v1.2.3-70-g09d2


From 29853fb97790d16a1dd312fbe2f29023bf17f4fb Mon Sep 17 00:00:00 2001
From: geireann <60007097+geireann@users.noreply.github.com>
Date: Thu, 22 Jul 2021 17:27:33 -0400
Subject: Update server_worker.ts

---
 src/server/DashSession/Session/agents/server_worker.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

(limited to 'src')

diff --git a/src/server/DashSession/Session/agents/server_worker.ts b/src/server/DashSession/Session/agents/server_worker.ts
index 6a19bfa5d..60fc181c7 100644
--- a/src/server/DashSession/Session/agents/server_worker.ts
+++ b/src/server/DashSession/Session/agents/server_worker.ts
@@ -1,10 +1,10 @@
-import { ExitHandler } from "./applied_session_agent";
 import { isMaster } from "cluster";
-import { manage, ErrorLike } from "./promisified_ipc_manager";
-import IPCMessageReceiver from "./process_message_router";
-import { red, green, white, yellow } from "colors";
+import { green, red, white, yellow } from "colors";
 import { get } from "request-promise";
+import { ExitHandler } from "./applied_session_agent";
 import { Monitor } from "./monitor";
+import IPCMessageReceiver from "./process_message_router";
+import { ErrorLike, manage } from "./promisified_ipc_manager";
 
 /**
  * Effectively, each worker repairs the connection to the server by reintroducing a consistent state
-- 
cgit v1.2.3-70-g09d2


From 26f609792f477bc76b95c4c8eb0385da44e809be Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 22 Jul 2021 19:04:55 -0400
Subject: fixed custom text doc template.

---
 src/client/util/CurrentUserUtils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 5bab827d5..8a98304b2 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -405,7 +405,7 @@ export class CurrentUserUtils {
                 selection: { type: "text", anchor: 1, head: 1 },
                 storedMarks: []
             };
-            const headerTemplate = Docs.Create.RTFDocument(new RichTextField(JSON.stringify(json), ""), { title: "header", version: headerViewVersion, target: doc, _height: 70, _headerPointerEvents: "all", _headerHeight: 12, _headerFontSize: 9, _autoHeight: true, system: true, cloneFieldFilter: new List<string>(["system"]) }, "header"); // text needs to be a space to allow templateText to be created
+            const headerTemplate = Docs.Create.RTFDocument(new RichTextField(JSON.stringify(json), ""), { title: "text", version: headerViewVersion, target: doc, _height: 70, _headerPointerEvents: "all", _headerHeight: 12, _headerFontSize: 9, _autoHeight: true, system: true, cloneFieldFilter: new List<string>(["system"]) }, "header"); // text needs to be a space to allow templateText to be created
             const headerBtnHgt = 10;
             headerTemplate[DataSym].layout =
                 "<div style='height:100%'>" +
-- 
cgit v1.2.3-70-g09d2


From 7a8865bbbe7b16219aa63058a159eb4facb06b0b Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Fri, 23 Jul 2021 10:26:02 -0400
Subject: fixed compile errors

---
 src/client/views/collections/CollectionSchemaView.tsx          |  6 +++---
 .../collections/collectionSchema/CollectionSchemaView.scss     |  2 +-
 .../collections/collectionSchema/CollectionSchemaView.tsx      | 10 +++++-----
 3 files changed, 9 insertions(+), 9 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx
index 18926264d..e1e04915a 100644
--- a/src/client/views/collections/CollectionSchemaView.tsx
+++ b/src/client/views/collections/CollectionSchemaView.tsx
@@ -11,7 +11,8 @@ import { listSpec } from "../../../fields/Schema";
 import { PastelSchemaPalette, SchemaHeaderField } from "../../../fields/SchemaHeaderField";
 import { Cast, NumCast } from "../../../fields/Types";
 import { TraceMobx } from "../../../fields/util";
-import { emptyFunction, emptyPath, returnFalse, setupMoveUpEvents, returnEmptyDoclist, returnTrue } from "../../../Utils";
+import { emptyFunction, returnEmptyDoclist, returnFalse, returnTrue, setupMoveUpEvents } from "../../../Utils";
+import { DocUtils } from "../../documents/Documents";
 import { SelectionManager } from "../../util/SelectionManager";
 import { SnappingManager } from "../../util/SnappingManager";
 import { Transform } from "../../util/Transform";
@@ -24,8 +25,7 @@ import { DocumentView } from "../nodes/DocumentView";
 import { DefaultStyleProvider } from "../StyleProvider";
 import "./CollectionSchemaView.scss";
 import { CollectionSubView } from "./CollectionSubView";
-import { SchemaTable } from "./SchemaTable";
-import { DocUtils } from "../../documents/Documents";
+import { SchemaTable } from "../collections/collectionSchema/SchemaTable";
 // bcz: need to add drag and drop of rows and columns.  This seems like it might work for rows: https://codesandbox.io/s/l94mn1q657
 
 export enum ColumnType {
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.scss b/src/client/views/collections/collectionSchema/CollectionSchemaView.scss
index 4cc34cd32..40cdcd14b 100644
--- a/src/client/views/collections/collectionSchema/CollectionSchemaView.scss
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.scss
@@ -1,4 +1,4 @@
-@import "../../globalCssVariables";
+@import "../../global/globalCssVariables.scss";
 .collectionSchemaView-container {
     border-width: $COLLECTION_BORDER_WIDTH;
     border-color: $medium-gray;
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
index ef28f75c8..585cda729 100644
--- a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
@@ -11,21 +11,21 @@ import { listSpec } from "../../../../fields/Schema";
 import { PastelSchemaPalette, SchemaHeaderField } from "../../../../fields/SchemaHeaderField";
 import { Cast, NumCast } from "../../../../fields/Types";
 import { TraceMobx } from "../../../../fields/util";
-import { emptyFunction, emptyPath, returnFalse, setupMoveUpEvents, returnEmptyDoclist, returnTrue } from "../../../../Utils";
+import { emptyFunction, returnEmptyDoclist, returnFalse, returnTrue, setupMoveUpEvents } from "../../../../Utils";
+import { DocUtils } from "../../../documents/Documents";
 import { SelectionManager } from "../../../util/SelectionManager";
 import { SnappingManager } from "../../../util/SnappingManager";
 import { Transform } from "../../../util/Transform";
 import { undoBatch } from "../../../util/UndoManager";
-import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../globalCssVariables.scss';
+import '../../../views/DocumentDecorations.scss';
 import { ContextMenu } from "../../ContextMenu";
 import { ContextMenuProps } from "../../ContextMenuItem";
-import '../../../views/DocumentDecorations.scss';
+import { COLLECTION_BORDER_WIDTH, SCHEMA_DIVIDER_WIDTH } from '../../global/globalCssVariables.scss';
 import { DocumentView } from "../../nodes/DocumentView";
 import { DefaultStyleProvider } from "../../StyleProvider";
-import "./CollectionSchemaView.scss";
 import { CollectionSubView } from "../CollectionSubView";
+import "./CollectionSchemaView.scss";
 import { SchemaTable } from "./SchemaTable";
-import { DocUtils } from "../../../documents/Documents";
 // bcz: need to add drag and drop of rows and columns.  This seems like it might work for rows: https://codesandbox.io/s/l94mn1q657
 
 export enum ColumnType {
-- 
cgit v1.2.3-70-g09d2


From 14e66ac5bcdaa5e244be68ccb8cbb0c495917910 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Fri, 23 Jul 2021 14:41:18 -0400
Subject: fixed issues with layoutString templates (eg customView): scale
 properly when in a time view, have a data doc, scripts are called with
 'scale' parmeter

---
 src/client/util/CurrentUserUtils.ts                | 16 +++++++++------
 src/client/views/DocComponent.tsx                  |  2 +-
 src/client/views/nodes/DocumentContentsView.tsx    | 11 +++++-----
 .../views/nodes/formattedText/FormattedTextBox.tsx | 11 +++++-----
 src/fields/Doc.ts                                  | 24 ++++++++++++++++++++--
 5 files changed, 45 insertions(+), 19 deletions(-)

(limited to 'src')

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 8a98304b2..22504f102 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -405,14 +405,18 @@ export class CurrentUserUtils {
                 selection: { type: "text", anchor: 1, head: 1 },
                 storedMarks: []
             };
-            const headerTemplate = Docs.Create.RTFDocument(new RichTextField(JSON.stringify(json), ""), { title: "text", version: headerViewVersion, target: doc, _height: 70, _headerPointerEvents: "all", _headerHeight: 12, _headerFontSize: 9, _autoHeight: true, system: true, cloneFieldFilter: new List<string>(["system"]) }, "header"); // text needs to be a space to allow templateText to be created
+            const headerTemplate = Docs.Create.RTFDocument(new RichTextField(JSON.stringify(json), ""), {
+                title: "text", version: headerViewVersion, target: doc, _height: 70, _headerPointerEvents: "all",
+                _headerHeight: 12, _headerFontSize: 9, _autoHeight: true, system: true, _fitWidth: true,
+                cloneFieldFilter: new List<string>(["system"])
+            }, "header");
             const headerBtnHgt = 10;
             headerTemplate[DataSym].layout =
-                "<div style='height:100%'>" +
-                `    <FormattedTextBox {...props} fieldKey={'text'} height='calc(100% - ${headerBtnHgt}px - {this._headerHeight}px)'/>` +
-                "    <FormattedTextBox {...props} fieldKey={'header'}  dontSelectOnLoad='true' ignoreAutoHeight='true' fontSize='{this._headerFontSize}px' height='{this._headerHeight||1}px' background={this._headerColor ||this.target.mySharedDocs.userColor||'lightGray'} />" +
-                `    <HTMLdiv fontSize='${headerBtnHgt - 1}' onClick={‘(this._headerHeight=Math.min(Math.max(1,this._height-30),this._headerHeight===1?50:1)) && (this._autoHeightMargins=this._headerHeight+${headerBtnHgt})’}  height='${headerBtnHgt}px' background='yellow' >Metadata</HTMLdiv>` +
-                "</div>";
+                "<HTMLdiv transformOrigin='top left' width='{100/scale}%' height='{100/scale}%' transform='scale({scale})'>" +
+                `    <FormattedTextBox {...props} dontScale='true' fieldKey={'text'}  height='calc(100% - ${headerBtnHgt}px - {this._headerHeight}px)'/>` +
+                "    <FormattedTextBox {...props} dontScale='true' fieldKey={'header'}  dontSelectOnLoad='true' ignoreAutoHeight='true' fontSize='{this._headerFontSize}px' height='{(this._headerHeight||1)}px' background='{this._headerColor ||this.target.mySharedDocs.userColor||`lightGray`}' />" +
+                `    <HTMLdiv fontSize='${headerBtnHgt - 1}px' height='${headerBtnHgt}px' background='yellow' onClick={‘(this._headerHeight=scale*Math.min(Math.max(1,this._height-30),this._headerHeight===1?50:1)) && (this._autoHeightMargins=this._headerHeight+${headerBtnHgt})’}  >Metadata</HTMLdiv>` +
+                "</HTMLdiv>";
 
             // "<div style={'height:100%'}>" +
             // "    <FormattedTextBox {...props} fieldKey={'header'} dontSelectOnLoad={'true'} ignoreAutoHeight={'true'} pointerEvents='{this._headerPointerEvents||`none`}' fontSize='{this._headerFontSize}px' height='{this._headerHeight}px' background='{this._headerColor||this.target.mySharedDocs.userColor}' />" +
diff --git a/src/client/views/DocComponent.tsx b/src/client/views/DocComponent.tsx
index da8af7cc0..0b70ce68d 100644
--- a/src/client/views/DocComponent.tsx
+++ b/src/client/views/DocComponent.tsx
@@ -119,7 +119,7 @@ export function ViewBoxAnnotatableComponent<P extends ViewBoxAnnotatableProps, T
 
         styleFromLayoutString = (scale: number) => {
             const style: { [key: string]: any } = {};
-            const divKeys = ["width", "height", "fontSize", "left", "background", "left", "right", "top", "bottom", "pointerEvents", "position"];
+            const divKeys = ["width", "height", "fontSize", "transform", "left", "background", "left", "right", "top", "bottom", "pointerEvents", "position"];
             const replacer = (match: any, expr: string, offset: any, string: any) => { // bcz: this executes a script to convert a property expression string:  { script }  into a value
                 return ScriptField.MakeFunction(expr, { self: Doc.name, this: Doc.name, scale: "number" })?.script.run({ self: this.rootDoc, this: this.layoutDoc, scale }).result as string || "";
             };
diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx
index a0a40becb..9b75cd8f9 100644
--- a/src/client/views/nodes/DocumentContentsView.tsx
+++ b/src/client/views/nodes/DocumentContentsView.tsx
@@ -64,6 +64,7 @@ interface HTMLtagProps {
     htmltag: string;
     onClick?: ScriptField;
     onInput?: ScriptField;
+    scaling: number;
 }
 
 //"<HTMLdiv borderRadius='100px' onClick={this.bannerColor=this.bannerColor==='red'?'green':'red'} overflow='hidden' position='absolute' width='100%' height='100%' transform='rotate({2*this.x+this.y}deg)'> <ImageBox {...props} fieldKey={'data'}/> <HTMLspan width='200px' top='0' height='35px' textAlign='center' paddingTop='10px' transform='translate(-40px, 45px) rotate(-45deg)' position='absolute' color='{this.bannerColor===`green`?`light`:`dark`}blue' backgroundColor='{this.bannerColor===`green`?`dark`:`light`}blue'> {this.title}</HTMLspan></HTMLdiv>"
@@ -82,7 +83,7 @@ interface HTMLtagProps {
 export class HTMLtag extends React.Component<HTMLtagProps> {
     click = (e: React.MouseEvent) => {
         const clickScript = (this.props as any).onClick as Opt<ScriptField>;
-        clickScript?.script.run({ this: this.props.Document, self: this.props.RootDoc });
+        clickScript?.script.run({ this: this.props.Document, self: this.props.RootDoc, scale: this.props.scaling });
     }
     onInput = (e: React.FormEvent<HTMLDivElement>) => {
         const onInputScript = (this.props as any).onInput as Opt<ScriptField>;
@@ -90,9 +91,9 @@ export class HTMLtag extends React.Component<HTMLtagProps> {
     }
     render() {
         const style: { [key: string]: any } = {};
-        const divKeys = OmitKeys(this.props, ["children", "htmltag", "RootDoc", "Document", "key", "onInput", "onClick", "__proto__"]).omit;
+        const divKeys = OmitKeys(this.props, ["children", "htmltag", "RootDoc", "scaling", "Document", "key", "onInput", "onClick", "__proto__"]).omit;
         const replacer = (match: any, expr: string, offset: any, string: any) => { // bcz: this executes a script to convert a propery expression string:  { script }  into a value
-            return ScriptField.MakeFunction(expr, { self: Doc.name, this: Doc.name })?.script.run({ self: this.props.RootDoc, this: this.props.Document }).result as string || "";
+            return ScriptField.MakeFunction(expr, { self: Doc.name, this: Doc.name, scale: "number" })?.script.run({ self: this.props.RootDoc, this: this.props.Document, scale: this.props.scaling }).result as string || "";
         };
         Object.keys(divKeys).map((prop: string) => {
             const p = (this.props as any)[prop] as string;
@@ -184,7 +185,7 @@ export class DocumentContentsView extends React.Component<DocumentViewProps & Fo
 
         // replace HTML<tag> with corresponding HTML tag as in:  <HTMLdiv> becomes  <HTMLtag Document={props.Document} htmltag='div'> 
         const replacer2 = (match: any, p1: string, offset: any, string: any) => {
-            return `<HTMLtag RootDoc={props.RootDoc} Document={props.Document} htmltag='${p1}'`;
+            return `<HTMLtag RootDoc={props.RootDoc} Document={props.Document} scaling='${this.props.scaling?.() || 1}' htmltag='${p1}'`;
         };
         layoutFrame = layoutFrame.replace(/<HTML([a-zA-Z0-9_-]+)/g, replacer2);
 
@@ -200,7 +201,7 @@ export class DocumentContentsView extends React.Component<DocumentViewProps & Fo
             if (splits.length > 1) {
                 const code = XRegExp.matchRecursive(splits[1], "{", "}", "", { valueNames: ["between", "left", "match", "right", "between"] });
                 layoutFrame = splits[0] + ` ${func}={props.${func}} ` + splits[1].substring(code[1].end + 1);
-                return ScriptField.MakeScript(code[1].value, { this: Doc.name, self: Doc.name, value: "string" });
+                return ScriptField.MakeScript(code[1].value, { this: Doc.name, self: Doc.name, scale: "number", value: "string" });
             }
             return undefined;
             // add input function to props
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 95d8f555c..6dd63fb47 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -71,6 +71,7 @@ export interface FormattedTextBoxProps {
     xPadding?: number;   // used to override document's settings for xMargin --- see CollectionCarouselView
     yPadding?: number;
     noSidebar?: boolean;
+    dontScale?: boolean;
     dontSelectOnLoad?: boolean; // suppress selecting the text box when loaded (and mark as not being associated with scrollTop document field)
 }
 export const GoogleRef = "googleDocId";
@@ -126,7 +127,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
     @computed get scrollHeight() { return NumCast(this.rootDoc[this.fieldKey + "-scrollHeight"]); }
     @computed get sidebarHeight() { return !this.sidebarWidth() ? 0 : NumCast(this.rootDoc[this.SidebarKey + "-height"]); }
     @computed get titleHeight() { return this.props.styleProvider?.(this.layoutDoc, this.props, StyleProp.HeaderMargin) || 0; }
-    @computed get autoHeightMargins() { return this.titleHeight + (this.layoutDoc._autoHeightMargins && !this.props.dontSelectOnLoad ? NumCast(this.layoutDoc._autoHeightMargins) : 0); }
+    @computed get autoHeightMargins() { return this.titleHeight + NumCast(this.layoutDoc._autoHeightMargins); }
     @computed get _recording() { return this.dataDoc?.mediaState === "recording"; }
     set _recording(value) {
         !this.dataDoc.recordingSource && (this.dataDoc.mediaState = value ? "recording" : undefined);
@@ -1524,10 +1525,10 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
             <div className="formattedTextBox-cont"
                 onWheel={e => this.isContentActive() && e.stopPropagation()}
                 style={{
-                    transform: `scale(${scale})`,
-                    transformOrigin: "top left",
-                    width: `${100 / scale}%`,
-                    height: `${100 / scale}%`,
+                    transform: this.props.dontScale ? undefined : `scale(${scale})`,
+                    transformOrigin: this.props.dontScale ? undefined : "top left",
+                    width: this.props.dontScale ? undefined : `${100 / scale}%`,
+                    height: this.props.dontScale ? undefined : `${100 / scale}%`,
                     // overflowY: this.layoutDoc._autoHeight ? "hidden" : undefined,
                     ...this.styleFromLayoutString(scale)   // this converts any expressions in the format string to style props.  e.g., <FormattedTextBox height='{this._headerHeight}px' >
                 }}>
diff --git a/src/fields/Doc.ts b/src/fields/Doc.ts
index bd0ba3ad7..464a8ad05 100644
--- a/src/fields/Doc.ts
+++ b/src/fields/Doc.ts
@@ -803,6 +803,27 @@ export namespace Doc {
         return undefined;
     }
 
+    // Makes a delegate of a document by first creating a delegate where data should be stored
+    // (ie, the 'data' doc), and then creates another delegate of that (ie, the 'layout' doc).
+    // This is appropriate if you're trying to create a document that behaves like all
+    // regularly created documents (e.g, text docs, pdfs, etc which all have data/layout docs)
+    export function MakeDelegateWithProto(doc: Doc, id?: string, title?: string): Doc {
+        const delegateProto = new Doc();
+        delegateProto[Initializing] = true;
+        delegateProto.proto = doc;
+        delegateProto.author = Doc.CurrentUserEmail;
+        delegateProto.isPrototype = true;
+        title && (delegateProto.title = title);
+        const delegate = new Doc(id, true);
+        delegate[Initializing] = true;
+        delegate.proto = delegateProto;
+        delegate.author = Doc.CurrentUserEmail;
+        Doc.AddDocToList(delegateProto[DataSym], "aliases", delegate);
+        delegate[Initializing] = false;
+        delegateProto[Initializing] = false;
+        return delegate;
+    }
+
     let _applyCount: number = 0;
     export function ApplyTemplate(templateDoc: Doc) {
         if (templateDoc) {
@@ -1150,8 +1171,7 @@ export namespace Doc {
         return ndoc;
     }
     export function delegateDragFactory(dragFactory: Doc) {
-        const ndoc = Doc.MakeDelegate(dragFactory);
-        ndoc.isPrototype = true;
+        const ndoc = Doc.MakeDelegateWithProto(dragFactory);
         if (ndoc && dragFactory["dragFactory-count"] !== undefined) {
             dragFactory["dragFactory-count"] = NumCast(dragFactory["dragFactory-count"]) + 1;
             Doc.GetProto(ndoc).title = ndoc.title + " " + NumCast(dragFactory["dragFactory-count"]).toString();
-- 
cgit v1.2.3-70-g09d2


From c7a0a346238c55b8c223798f75cef758418aa051 Mon Sep 17 00:00:00 2001
From: geireann <geireann_lindfield_roberts@brown.edu>
Date: Sat, 24 Jul 2021 14:29:47 -0400
Subject: fixed minor issues and got rid of console error

---
 src/client/util/DragManager.ts                         | 8 ++++----
 src/client/views/ContextMenu.tsx                       | 2 +-
 src/server/DashSession/Session/agents/server_worker.ts | 1 -
 src/server/DashUploadUtils.ts                          | 2 +-
 4 files changed, 6 insertions(+), 7 deletions(-)

(limited to 'src')

diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index 07b2b7dff..ab58f25e9 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -1,4 +1,4 @@
-import { action, observable, runInAction } from "mobx";
+import { action } from "mobx";
 import { DateField } from "../../fields/DateField";
 import { Doc, Field, Opt } from "../../fields/Doc";
 import { List } from "../../fields/List";
@@ -7,12 +7,12 @@ import { listSpec } from "../../fields/Schema";
 import { SchemaHeaderField } from "../../fields/SchemaHeaderField";
 import { ScriptField } from "../../fields/ScriptField";
 import { Cast, NumCast, ScriptCast, StrCast } from "../../fields/Types";
-import { emptyFunction, returnTrue } from "../../Utils";
+import { emptyFunction } from "../../Utils";
 import { Docs, DocUtils } from "../documents/Documents";
 import * as globalCssVariables from "../views/global/globalCssVariables.scss";
-import { UndoManager } from "./UndoManager";
-import { SnappingManager } from "./SnappingManager";
 import { DocumentView } from "../views/nodes/DocumentView";
+import { SnappingManager } from "./SnappingManager";
+import { UndoManager } from "./UndoManager";
 
 export type dropActionType = "alias" | "copy" | "move" | "same" | "proto" | "none" | undefined; // undefined = move, "same" = move but don't call removeDropProperties
 export function SetupDrag(
diff --git a/src/client/views/ContextMenu.tsx b/src/client/views/ContextMenu.tsx
index d96de72e3..c4fabbf99 100644
--- a/src/client/views/ContextMenu.tsx
+++ b/src/client/views/ContextMenu.tsx
@@ -218,7 +218,7 @@ export class ContextMenu extends React.Component {
 
     @computed get menuItems() {
         if (!this._searchString) {
-            return this._items.map(item => <ContextMenuItem {...item} noexpand={this.itemsNeedSearch ? true : (item as any).noexpand} key={item.description} closeMenu={this.closeMenu} />);
+            return this._items.map((item, ind) => <ContextMenuItem {...item} noexpand={this.itemsNeedSearch ? true : (item as any).noexpand} key={ind + item.description} closeMenu={this.closeMenu} />);
         }
         return this.filteredViews;
     }
diff --git a/src/server/DashSession/Session/agents/server_worker.ts b/src/server/DashSession/Session/agents/server_worker.ts
index 60fc181c7..84d35b40e 100644
--- a/src/server/DashSession/Session/agents/server_worker.ts
+++ b/src/server/DashSession/Session/agents/server_worker.ts
@@ -21,7 +21,6 @@ export class ServerWorker extends IPCMessageReceiver {
     private pollTarget: string;
     private serverPort: number;
     private isInitialized = false;
-
     public static Create(work: Function) {
         if (isMaster) {
             console.error(red("cannot create a worker on the monitor process."));
diff --git a/src/server/DashUploadUtils.ts b/src/server/DashUploadUtils.ts
index 5ce69999a..a617571ae 100644
--- a/src/server/DashUploadUtils.ts
+++ b/src/server/DashUploadUtils.ts
@@ -1,4 +1,4 @@
-import { red, green } from 'colors';
+import { green, red } from 'colors';
 import { ExifImage } from 'exif';
 import { File } from 'formidable';
 import { createWriteStream, existsSync, readFileSync, rename, unlinkSync, writeFile } from 'fs';
-- 
cgit v1.2.3-70-g09d2


From 7b6de64a1244ba0944edf8301a7adc2cb1445f8a Mon Sep 17 00:00:00 2001
From: dinhanhtruong <70963346+dinhanhtruong@users.noreply.github.com>
Date: Sat, 24 Jul 2021 15:21:23 -0400
Subject: In-progress link popup

---
 .../views/collections/CollectionSchemaCells.tsx    |  1 +
 src/client/views/linking/LinkPopup.tsx             | 26 +++++++++++++++++++---
 .../views/nodes/formattedText/FormattedTextBox.tsx |  3 ++-
 .../views/nodes/formattedText/RichTextMenu.tsx     |  1 +
 4 files changed, 27 insertions(+), 4 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
index 2e6186680..c19c6efb1 100644
--- a/src/client/views/collections/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/CollectionSchemaCells.tsx
@@ -102,6 +102,7 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
         this.props.changeFocusedCellByIndex(this.props.row, this.props.col);
         this.props.setPreviewDoc(this.props.rowProps.original);
 
+        console.log("click cell");
         let url: string;
         if (url = StrCast(this.props.rowProps.row.href)) {
             try {
diff --git a/src/client/views/linking/LinkPopup.tsx b/src/client/views/linking/LinkPopup.tsx
index 5c4640fdf..89d5b7272 100644
--- a/src/client/views/linking/LinkPopup.tsx
+++ b/src/client/views/linking/LinkPopup.tsx
@@ -23,6 +23,8 @@ import { DefaultStyleProvider } from '../StyleProvider';
 import { Transform } from '../../util/Transform';
 import { DocUtils } from '../../documents/Documents';
 import { SearchBox } from '../search/SearchBox';
+import { EditorView } from 'prosemirror-view';
+import { FormattedTextBox } from '../nodes/formattedText/FormattedTextBox';
 
 interface LinkPopupProps {
     showPopup: boolean;
@@ -38,6 +40,24 @@ interface LinkPopupProps {
 
 @observer
 export class LinkPopup extends React.Component<LinkPopupProps> {
+    @observable private linkURL: string = "";
+    @observable public view?: EditorView;
+    private Instance: LinkPopup = this;
+
+
+
+    // TODO: should check for valid URL
+    @undoBatch
+    makeLinkToURL = (target: string, lcoation: string) => {
+        ((this as any)?.TextView as FormattedTextBox).makeLinkAnchor(undefined, "onRadd:rightight", target, target);
+    }
+
+    @action
+    onLinkChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+        this.linkURL = e.target.value;
+        console.log(this.linkURL)
+    }
+
 
     getPWidth = () => 500;
     getPHeight = () => 500;
@@ -47,9 +67,9 @@ export class LinkPopup extends React.Component<LinkPopupProps> {
         return (
             <div className="linkPopup-container" style={{ display: popupVisibility }}>
                 <div className="linkPopup-url-container">
-                    <input defaultValue={""} autoComplete="off" type="text" placeholder="Enter URL..." id="url-input"
-                        className="linkPopup-searchBox searchBox-input" />
-                    <button style={{ display: "block", margin: "10px auto", }}>Apply hyperlink</button>
+                    <input autoComplete="off" type="text" value={this.linkURL} placeholder="Enter URL..." onChange={this.onLinkChange} />
+                    <button onPointerDown={e => this.makeLinkToURL(this.linkURL, "add:right")}
+                        style={{ display: "block", margin: "10px auto", }}>Apply hyperlink</button>
                 </div>
                 <div className="divider">
                     <div className="line"></div>
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 5180732b9..182a40dcb 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -213,6 +213,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
         AnchorMenu.Instance.Status = "marquee";
         AnchorMenu.Instance.Highlight = action((color: string, isLinkButton: boolean) => {
             this._editorView?.state && RichTextMenu.Instance.insertHighlight(color, this._editorView.state, this._editorView?.dispatch);
+            console.log("highlight")
             return undefined;
         });
         /**
@@ -1398,7 +1399,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
                 SelectionManager.DeselectAll();
                 RichTextMenu.Instance.updateMenu(undefined, undefined, undefined);
                 return;
-            case "Enter": this.insertTime(); 
+            case "Enter": this.insertTime();
             case "Tab": e.preventDefault(); break;
             default: if (this._lastTimedMark?.attrs.userid === Doc.CurrentUserEmail) break;
             case " ":
diff --git a/src/client/views/nodes/formattedText/RichTextMenu.tsx b/src/client/views/nodes/formattedText/RichTextMenu.tsx
index 071491463..01de0fbe7 100644
--- a/src/client/views/nodes/formattedText/RichTextMenu.tsx
+++ b/src/client/views/nodes/formattedText/RichTextMenu.tsx
@@ -852,6 +852,7 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
     @undoBatch
     makeLinkToURL = (target: string, lcoation: string) => {
         ((this.view as any)?.TextView as FormattedTextBox).makeLinkAnchor(undefined, "onRadd:rightight", target, target);
+        console.log((this.view as any)?.TextView);
     }
 
     @undoBatch
-- 
cgit v1.2.3-70-g09d2


From 50f4eaf02d32560ad324acd72b9021b480c11a9c Mon Sep 17 00:00:00 2001
From: dinhanhtruong <70963346+dinhanhtruong@users.noreply.github.com>
Date: Sat, 24 Jul 2021 17:00:31 -0400
Subject: refreshed linking status bar css, linkmenu css

---
 package-lock.json                                  | 23032 +------------------
 .../views/collections/CollectionLinearView.scss    |    12 +-
 .../views/collections/CollectionLinearView.tsx     |     3 +-
 src/client/views/linking/LinkMenu.scss             |    17 +-
 src/client/views/linking/LinkMenuGroup.tsx         |     2 +-
 src/client/views/linking/LinkMenuItem.scss         |     2 +-
 src/client/views/linking/LinkPopup.scss            |     2 -
 src/client/views/nodes/DocumentLinksButton.tsx     |     4 +-
 8 files changed, 76 insertions(+), 22998 deletions(-)

(limited to 'src')

diff --git a/package-lock.json b/package-lock.json
index 05e46ee09..58cdf8805 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,22928 +1,8 @@
 {
     "name": "dash",
     "version": "1.0.0",
-    "lockfileVersion": 2,
+    "lockfileVersion": 1,
     "requires": true,
-    "packages": {
-        "": {
-            "name": "dash",
-            "version": "1.0.0",
-            "dependencies": {
-                "@fortawesome/fontawesome-svg-core": "^1.2.29",
-                "@fortawesome/free-brands-svg-icons": "^5.14.0",
-                "@fortawesome/free-regular-svg-icons": "^5.13.1",
-                "@fortawesome/free-solid-svg-icons": "^5.13.1",
-                "@fortawesome/react-fontawesome": "^0.1.11",
-                "@hig/flyout": "^1.2.1",
-                "@hig/theme-context": "^2.1.3",
-                "@hig/theme-data": "^2.16.1",
-                "@material-ui/core": "^4.11.0",
-                "@react-three/fiber": "^6.0.16",
-                "@types/cors": "^2.8.8",
-                "@types/d3-axis": "^2.0.0",
-                "@types/d3-color": "^2.0.1",
-                "@types/d3-scale": "^3.2.2",
-                "@types/d3-selection": "^2.0.0",
-                "@types/google-maps": "^3.2.2",
-                "@types/react-reconciler": "^0.26.1",
-                "@types/reveal": "^3.3.33",
-                "@types/three": "^0.126.2",
-                "@types/webscopeio__react-textarea-autocomplete": "^4.6.1",
-                "@webscopeio/react-textarea-autocomplete": "^4.7.0",
-                "adm-zip": "^0.4.16",
-                "archiver": "^3.1.1",
-                "array-batcher": "^1.2.3",
-                "async": "^2.6.2",
-                "axios": "^0.19.2",
-                "babel-runtime": "^6.26.0",
-                "bcrypt-nodejs": "0.0.3",
-                "bezier-curve": "^1.0.0",
-                "bluebird": "^3.7.2",
-                "body-parser": "^1.18.3",
-                "bootstrap": "^4.5.0",
-                "canvas": "^2.5.0",
-                "child_process": "^1.0.2",
-                "chrome": "^0.1.0",
-                "class-transformer": "^0.2.0",
-                "color": "^3.1.2",
-                "colors": "^1.4.0",
-                "connect-flash": "^0.1.1",
-                "connect-mongo": "^2.0.3",
-                "cookie-parser": "^1.4.4",
-                "cookie-session": "^2.0.0-rc.1",
-                "cors": "^2.8.5",
-                "depcheck": "^0.9.2",
-                "equation-editor-react": "github:bobzel/equation-editor-react#useLocally",
-                "exif": "^0.6.0",
-                "express": "^4.16.4",
-                "express-flash": "0.0.2",
-                "express-session": "^1.17.0",
-                "express-validator": "^5.3.1",
-                "expressjs": "^1.0.1",
-                "file-saver": "^2.0.2",
-                "find-in-files": "^0.5.0",
-                "fit-curve": "^0.1.7",
-                "flexlayout-react": "^0.3.11",
-                "fluent-ffmpeg": "^2.1.2",
-                "formidable": "^1.2.1",
-                "function-plot": "^1.22.7",
-                "golden-layout": "^1.5.9",
-                "google-auth-library": "^4.2.4",
-                "google-maps-react": "^2.0.6",
-                "googleapis": "^40.0.0",
-                "googlephotos": "^0.2.5",
-                "howler": "^2.2.0",
-                "html-to-image": "^0.1.0",
-                "html-to-text": "^5.1.1",
-                "i": "^0.3.6",
-                "image-data-uri": "^2.0.1",
-                "image-size": "^0.7.5",
-                "image-size-stream": "^1.1.0",
-                "js-datepicker": "^4.6.6",
-                "jsonschema": "^1.2.5",
-                "jszip": "^3.5.0",
-                "libxmljs": "^0.19.7",
-                "lodash": "^4.17.15",
-                "material-ui": "^0.20.2",
-                "mobile-detect": "^1.4.4",
-                "mobx": "^5.15.7",
-                "mobx-react": "^5.4.4",
-                "mobx-react-devtools": "^6.1.1",
-                "mobx-utils": "^5.6.1",
-                "mongodb": "^3.5.9",
-                "mongoose": "^5.9.20",
-                "node-sass": "^4.14.1",
-                "node-stream-zip": "^1.11.2",
-                "nodemailer": "^5.1.1",
-                "nodemon": "^1.19.4",
-                "normalize.css": "^8.0.1",
-                "npm": "^6.14.5",
-                "p-limit": "^2.2.0",
-                "passport": "^0.4.0",
-                "passport-google-oauth20": "^2.0.0",
-                "passport-local": "^1.0.0",
-                "pdf-parse": "^1.1.1",
-                "pdfjs": "^2.3.9",
-                "pdfjs-dist": "^2.4.456",
-                "probe-image-size": "^4.0.0",
-                "prosemirror-commands": "^1.1.3",
-                "prosemirror-dev-tools": "^3.0.1",
-                "prosemirror-find-replace": "^0.9.0",
-                "prosemirror-history": "^1.1.3",
-                "prosemirror-inputrules": "^1.1.2",
-                "prosemirror-keymap": "^1.1.4",
-                "prosemirror-model": "^1.10.0",
-                "prosemirror-schema-list": "^1.1.2",
-                "prosemirror-state": "^1.3.2",
-                "prosemirror-transform": "^1.2.6",
-                "prosemirror-view": "^1.15.0",
-                "pug": "^2.0.4",
-                "puppeteer": "^3.3.0",
-                "query-string": "^6.13.1",
-                "raw-loader": "^1.0.0",
-                "rc-switch": "^1.9.0",
-                "react": "^16.12.0",
-                "react-audio-waveform": "0.0.5",
-                "react-autosuggest": "^9.4.3",
-                "react-beautiful-dnd": "^13.0.0",
-                "react-color": "^2.18.1",
-                "react-compound-slider": "^2.5.0",
-                "react-datepicker": "^3.0.0",
-                "react-dom": "^16.12.0",
-                "react-grid-layout": "^0.18.3",
-                "react-image-lightbox-with-rotate": "^5.1.1",
-                "react-jsx-parser": "^1.25.1",
-                "react-loading": "^2.0.3",
-                "react-measure": "^2.2.4",
-                "react-resizable": "^1.10.1",
-                "react-resizable-rotatable-draggable": "^0.2.0",
-                "react-reveal": "^1.2.2",
-                "react-select": "^3.1.0",
-                "react-table": "^6.11.5",
-                "readline": "^1.3.0",
-                "request": "^2.88.0",
-                "request-promise": "^4.2.5",
-                "reveal.js": "^4.0.2",
-                "rimraf": "^3.0.0",
-                "serializr": "^1.5.4",
-                "sharp": "^0.23.4",
-                "shelljs": "^0.8.3",
-                "socket.io": "^2.3.0",
-                "socket.io-client": "^2.3.0",
-                "solr-node": "^1.2.1",
-                "standard-http-error": "^2.0.1",
-                "styled-components": "^4.4.1",
-                "textarea-caret": "^3.1.0",
-                "three": "^0.127.0",
-                "translate-google-api": "^1.0.4",
-                "typescript-collections": "^1.3.3",
-                "typescript-language-server": "^0.4.0",
-                "url-loader": "^1.1.2",
-                "uuid": "^3.4.0",
-                "valid-url": "^1.0.9",
-                "web-request": "^1.0.7",
-                "webrtc-adapter": "^7.6.3",
-                "wikijs": "^6.0.1",
-                "words-to-numbers": "^1.5.1",
-                "xoauth2": "^1.2.0",
-                "xregexp": "^4.3.0"
-            },
-            "devDependencies": {
-                "@types/adm-zip": "^0.4.32",
-                "@types/animejs": "^2.0.2",
-                "@types/archiver": "^3.0.0",
-                "@types/async": "^2.4.1",
-                "@types/bcrypt-nodejs": "0.0.30",
-                "@types/bluebird": "^3.5.32",
-                "@types/body-parser": "^1.17.1",
-                "@types/chai": "^4.2.7",
-                "@types/color": "^3.0.1",
-                "@types/connect-flash": "0.0.34",
-                "@types/cookie-parser": "^1.4.2",
-                "@types/cookie-session": "^2.0.41",
-                "@types/dotenv": "^6.1.1",
-                "@types/exif": "^0.6.1",
-                "@types/express": "^4.17.2",
-                "@types/express-flash": "0.0.0",
-                "@types/express-session": "^1.15.16",
-                "@types/express-validator": "^3.0.0",
-                "@types/file-saver": "^2.0.1",
-                "@types/formidable": "^1.0.31",
-                "@types/google-maps-react": "^2.0.5",
-                "@types/jquery": "^3.5.0",
-                "@types/libxmljs": "^0.18.5",
-                "@types/lodash": "^4.14.157",
-                "@types/mobile-detect": "^1.3.4",
-                "@types/mocha": "^5.2.6",
-                "@types/mongodb": "^3.5.25",
-                "@types/mongoose": "^5.7.28",
-                "@types/node": "^10.17.26",
-                "@types/nodemailer": "^4.6.6",
-                "@types/passport": "^1.0.2",
-                "@types/passport-google-oauth20": "^2.0.3",
-                "@types/passport-local": "^1.0.33",
-                "@types/pdfjs-dist": "^2.1.4",
-                "@types/prosemirror-commands": "^1.0.1",
-                "@types/prosemirror-dev-tools": "^2.1.0",
-                "@types/prosemirror-history": "^1.0.1",
-                "@types/prosemirror-inputrules": "^1.0.2",
-                "@types/prosemirror-keymap": "^1.0.2",
-                "@types/prosemirror-menu": "^1.0.2",
-                "@types/prosemirror-model": "^1.7.0",
-                "@types/prosemirror-schema-list": "^1.0.1",
-                "@types/prosemirror-state": "^1.2.4",
-                "@types/prosemirror-transform": "^1.1.1",
-                "@types/prosemirror-view": "^1.11.2",
-                "@types/rc-switch": "^1.9.0",
-                "@types/react": "^16.9.41",
-                "@types/react-autosuggest": "^9.3.14",
-                "@types/react-color": "^2.17.4",
-                "@types/react-datepicker": "^3.0.2",
-                "@types/react-dom": "^16.9.8",
-                "@types/react-grid-layout": "^0.17.1",
-                "@types/react-measure": "^2.0.6",
-                "@types/react-select": "^3.0.13",
-                "@types/react-table": "^6.8.6",
-                "@types/request": "^2.48.5",
-                "@types/request-promise": "^4.1.45",
-                "@types/rimraf": "^2.0.3",
-                "@types/sharp": "^0.23.1",
-                "@types/shelljs": "^0.8.8",
-                "@types/socket.io": "^2.1.8",
-                "@types/socket.io-client": "^1.4.33",
-                "@types/typescript": "^2.0.0",
-                "@types/uuid": "^3.4.6",
-                "@types/valid-url": "^1.0.3",
-                "@types/webpack": "^4.41.27",
-                "@types/webpack-dev-middleware": "^2.0.7",
-                "@types/webpack-hot-middleware": "^2.25.4",
-                "@types/xregexp": "^4.3.0",
-                "@types/youtube": "0.0.39",
-                "awesome-typescript-loader": "^5.2.1",
-                "chai": "^4.2.0",
-                "copy-webpack-plugin": "^4.6.0",
-                "cross-env": "^5.2.1",
-                "css-loader": "^2.1.1",
-                "dotenv": "^8.2.0",
-                "file-loader": "^3.0.1",
-                "fork-ts-checker-webpack-plugin": "^1.6.0",
-                "jsdom": "^15.2.1",
-                "mocha": "^5.2.0",
-                "sass-loader": "^7.3.1",
-                "scss-loader": "0.0.1",
-                "style-loader": "^0.23.1",
-                "ts-loader": "^5.3.3",
-                "ts-node": "^7.0.1",
-                "ts-node-dev": "^1.0.0-pre.49",
-                "tslint": "^5.20.1",
-                "tslint-loader": "^3.6.0",
-                "typescript": "^3.9.9",
-                "webpack": "^4.46.0",
-                "webpack-cli": "^3.3.12",
-                "webpack-dev-middleware": "^3.7.3",
-                "webpack-dev-server": "^3.11.0",
-                "webpack-hot-middleware": "^2.24.3"
-            }
-        },
-        "node_modules/@babel/code-frame": {
-            "version": "7.8.3",
-            "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.8.3.tgz",
-            "integrity": "sha512-a9gxpmdXtZEInkCSHUJDLHZVBgb1QS0jhss4cPP93EW7s+uC5bikET2twEF3KV+7rDblJcmNvTR7VJejqd2C2g==",
-            "dependencies": {
-                "@babel/highlight": "^7.8.3"
-            }
-        },
-        "node_modules/@babel/generator": {
-            "version": "7.9.6",
-            "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.9.6.tgz",
-            "integrity": "sha512-+htwWKJbH2bL72HRluF8zumBxzuX0ZZUFl3JLNyoUjM/Ho8wnVpPXM6aUz8cfKDqQ/h7zHqKt4xzJteUosckqQ==",
-            "dependencies": {
-                "@babel/types": "^7.9.6",
-                "jsesc": "^2.5.1",
-                "lodash": "^4.17.13",
-                "source-map": "^0.5.0"
-            }
-        },
-        "node_modules/@babel/generator/node_modules/@babel/types": {
-            "version": "7.9.6",
-            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.9.6.tgz",
-            "integrity": "sha512-qxXzvBO//jO9ZnoasKF1uJzHd2+M6Q2ZPIVfnFps8JJvXy0ZBbwbNOmE6SGIY5XOY6d1Bo5lb9d9RJ8nv3WSeA==",
-            "dependencies": {
-                "@babel/helper-validator-identifier": "^7.9.5",
-                "lodash": "^4.17.13",
-                "to-fast-properties": "^2.0.0"
-            }
-        },
-        "node_modules/@babel/helper-annotate-as-pure": {
-            "version": "7.10.4",
-            "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.10.4.tgz",
-            "integrity": "sha512-XQlqKQP4vXFB7BN8fEEerrmYvHp3fK/rBkRFz9jaJbzK0B1DSfej9Kc7ZzE8Z/OnId1jpJdNAZ3BFQjWG68rcA==",
-            "dependencies": {
-                "@babel/types": "^7.10.4"
-            }
-        },
-        "node_modules/@babel/helper-annotate-as-pure/node_modules/@babel/helper-validator-identifier": {
-            "version": "7.10.4",
-            "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.10.4.tgz",
-            "integrity": "sha512-3U9y+43hz7ZM+rzG24Qe2mufW5KhvFg/NhnNph+i9mgCtdTCtMJuI1TMkrIUiK7Ix4PYlRF9I5dhqaLYA/ADXw=="
-        },
-        "node_modules/@babel/helper-annotate-as-pure/node_modules/@babel/types": {
-            "version": "7.10.5",
-            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.10.5.tgz",
-            "integrity": "sha512-ixV66KWfCI6GKoA/2H9v6bQdbfXEwwpOdQ8cRvb4F+eyvhlaHxWFMQB4+3d9QFJXZsiiiqVrewNV0DFEQpyT4Q==",
-            "dependencies": {
-                "@babel/helper-validator-identifier": "^7.10.4",
-                "lodash": "^4.17.19",
-                "to-fast-properties": "^2.0.0"
-            }
-        },
-        "node_modules/@babel/helper-annotate-as-pure/node_modules/lodash": {
-            "version": "4.17.19",
-            "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.19.tgz",
-            "integrity": "sha512-JNvd8XER9GQX0v2qJgsaN/mzFCNA5BRe/j8JN9d+tWyGLSodKQHKFicdwNYzWwI3wjRnaKPsGj1XkBjx/F96DQ=="
-        },
-        "node_modules/@babel/helper-function-name": {
-            "version": "7.9.5",
-            "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.9.5.tgz",
-            "integrity": "sha512-JVcQZeXM59Cd1qanDUxv9fgJpt3NeKUaqBqUEvfmQ+BCOKq2xUgaWZW2hr0dkbyJgezYuplEoh5knmrnS68efw==",
-            "dependencies": {
-                "@babel/helper-get-function-arity": "^7.8.3",
-                "@babel/template": "^7.8.3",
-                "@babel/types": "^7.9.5"
-            }
-        },
-        "node_modules/@babel/helper-get-function-arity": {
-            "version": "7.8.3",
-            "resolved": "https://registry.npmjs.org/@babel/helper-get-function-arity/-/helper-get-function-arity-7.8.3.tgz",
-            "integrity": "sha512-FVDR+Gd9iLjUMY1fzE2SR0IuaJToR4RkCDARVfsBBPSP53GEqSFjD8gNyxg246VUyc/ALRxFaAK8rVG7UT7xRA==",
-            "dependencies": {
-                "@babel/types": "^7.8.3"
-            }
-        },
-        "node_modules/@babel/helper-module-imports": {
-            "version": "7.10.3",
-            "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.10.3.tgz",
-            "integrity": "sha512-Jtqw5M9pahLSUWA+76nhK9OG8nwYXzhQzVIGFoNaHnXF/r4l7kz4Fl0UAW7B6mqC5myoJiBP5/YQlXQTMfHI9w==",
-            "dependencies": {
-                "@babel/types": "^7.10.3"
-            }
-        },
-        "node_modules/@babel/helper-module-imports/node_modules/@babel/helper-validator-identifier": {
-            "version": "7.10.3",
-            "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.10.3.tgz",
-            "integrity": "sha512-bU8JvtlYpJSBPuj1VUmKpFGaDZuLxASky3LhaKj3bmpSTY6VWooSM8msk+Z0CZoErFye2tlABF6yDkT3FOPAXw=="
-        },
-        "node_modules/@babel/helper-module-imports/node_modules/@babel/types": {
-            "version": "7.10.3",
-            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.10.3.tgz",
-            "integrity": "sha512-nZxaJhBXBQ8HVoIcGsf9qWep3Oh3jCENK54V4mRF7qaJabVsAYdbTtmSD8WmAp1R6ytPiu5apMwSXyxB1WlaBA==",
-            "dependencies": {
-                "@babel/helper-validator-identifier": "^7.10.3",
-                "lodash": "^4.17.13",
-                "to-fast-properties": "^2.0.0"
-            }
-        },
-        "node_modules/@babel/helper-split-export-declaration": {
-            "version": "7.8.3",
-            "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.8.3.tgz",
-            "integrity": "sha512-3x3yOeyBhW851hroze7ElzdkeRXQYQbFIb7gLK1WQYsw2GWDay5gAJNw1sWJ0VFP6z5J1whqeXH/WCdCjZv6dA==",
-            "dependencies": {
-                "@babel/types": "^7.8.3"
-            }
-        },
-        "node_modules/@babel/helper-validator-identifier": {
-            "version": "7.9.5",
-            "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.9.5.tgz",
-            "integrity": "sha512-/8arLKUFq882w4tWGj9JYzRpAlZgiWUJ+dtteNTDqrRBz9Iguck9Rn3ykuBDoUwh2TO4tSAJlrxDUOXWklJe4g=="
-        },
-        "node_modules/@babel/highlight": {
-            "version": "7.9.0",
-            "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.9.0.tgz",
-            "integrity": "sha512-lJZPilxX7Op3Nv/2cvFdnlepPXDxi29wxteT57Q965oc5R9v86ztx0jfxVrTcBk8C2kcPkkDa2Z4T3ZsPPVWsQ==",
-            "dependencies": {
-                "@babel/helper-validator-identifier": "^7.9.0",
-                "chalk": "^2.0.0",
-                "js-tokens": "^4.0.0"
-            }
-        },
-        "node_modules/@babel/parser": {
-            "version": "7.9.6",
-            "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.9.6.tgz",
-            "integrity": "sha512-AoeIEJn8vt+d/6+PXDRPaksYhnlbMIiejioBZvvMQsOjW/JYK6k/0dKnvvP3EhK5GfMBWDPtrxRtegWdAcdq9Q==",
-            "bin": {
-                "parser": "bin/babel-parser.js"
-            },
-            "engines": {
-                "node": ">=6.0.0"
-            }
-        },
-        "node_modules/@babel/runtime": {
-            "version": "7.9.2",
-            "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.9.2.tgz",
-            "integrity": "sha512-NE2DtOdufG7R5vnfQUTehdTfNycfUANEtCa9PssN9O/xmTzP4E08UI797ixaei6hBEVL9BI/PsdJS5x7mWoB9Q==",
-            "dependencies": {
-                "regenerator-runtime": "^0.13.4"
-            }
-        },
-        "node_modules/@babel/runtime-corejs3": {
-            "version": "7.9.2",
-            "resolved": "https://registry.npmjs.org/@babel/runtime-corejs3/-/runtime-corejs3-7.9.2.tgz",
-            "integrity": "sha512-HHxmgxbIzOfFlZ+tdeRKtaxWOMUoCG5Mu3wKeUmOxjYrwb3AAHgnmtCUbPPK11/raIWLIBK250t8E2BPO0p7jA==",
-            "dependencies": {
-                "core-js-pure": "^3.0.0",
-                "regenerator-runtime": "^0.13.4"
-            }
-        },
-        "node_modules/@babel/template": {
-            "version": "7.8.6",
-            "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.8.6.tgz",
-            "integrity": "sha512-zbMsPMy/v0PWFZEhQJ66bqjhH+z0JgMoBWuikXybgG3Gkd/3t5oQ1Rw2WQhnSrsOmsKXnZOx15tkC4qON/+JPg==",
-            "dependencies": {
-                "@babel/code-frame": "^7.8.3",
-                "@babel/parser": "^7.8.6",
-                "@babel/types": "^7.8.6"
-            }
-        },
-        "node_modules/@babel/traverse": {
-            "version": "7.9.6",
-            "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.9.6.tgz",
-            "integrity": "sha512-b3rAHSjbxy6VEAvlxM8OV/0X4XrG72zoxme6q1MOoe2vd0bEc+TwayhuC1+Dfgqh1QEG+pj7atQqvUprHIccsg==",
-            "dependencies": {
-                "@babel/code-frame": "^7.8.3",
-                "@babel/generator": "^7.9.6",
-                "@babel/helper-function-name": "^7.9.5",
-                "@babel/helper-split-export-declaration": "^7.8.3",
-                "@babel/parser": "^7.9.6",
-                "@babel/types": "^7.9.6",
-                "debug": "^4.1.0",
-                "globals": "^11.1.0",
-                "lodash": "^4.17.13"
-            }
-        },
-        "node_modules/@babel/traverse/node_modules/@babel/types": {
-            "version": "7.9.6",
-            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.9.6.tgz",
-            "integrity": "sha512-qxXzvBO//jO9ZnoasKF1uJzHd2+M6Q2ZPIVfnFps8JJvXy0ZBbwbNOmE6SGIY5XOY6d1Bo5lb9d9RJ8nv3WSeA==",
-            "dependencies": {
-                "@babel/helper-validator-identifier": "^7.9.5",
-                "lodash": "^4.17.13",
-                "to-fast-properties": "^2.0.0"
-            }
-        },
-        "node_modules/@babel/traverse/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/@babel/types": {
-            "version": "7.9.5",
-            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.9.5.tgz",
-            "integrity": "sha512-XjnvNqenk818r5zMaba+sLQjnbda31UfUURv3ei0qPQw4u+j2jMyJ5b11y8ZHYTRSI3NnInQkkkRT4fLqqPdHg==",
-            "dependencies": {
-                "@babel/helper-validator-identifier": "^7.9.5",
-                "lodash": "^4.17.13",
-                "to-fast-properties": "^2.0.0"
-            }
-        },
-        "node_modules/@emotion/cache": {
-            "version": "10.0.29",
-            "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-10.0.29.tgz",
-            "integrity": "sha512-fU2VtSVlHiF27empSbxi1O2JFdNWZO+2NFHfwO0pxgTep6Xa3uGb+3pVKfLww2l/IBGLNEZl5Xf/++A4wAYDYQ==",
-            "dependencies": {
-                "@emotion/sheet": "0.9.4",
-                "@emotion/stylis": "0.8.5",
-                "@emotion/utils": "0.11.3",
-                "@emotion/weak-memoize": "0.2.5"
-            }
-        },
-        "node_modules/@emotion/core": {
-            "version": "10.0.28",
-            "resolved": "https://registry.npmjs.org/@emotion/core/-/core-10.0.28.tgz",
-            "integrity": "sha512-pH8UueKYO5jgg0Iq+AmCLxBsvuGtvlmiDCOuv8fGNYn3cowFpLN98L8zO56U0H1PjDIyAlXymgL3Wu7u7v6hbA==",
-            "dependencies": {
-                "@babel/runtime": "^7.5.5",
-                "@emotion/cache": "^10.0.27",
-                "@emotion/css": "^10.0.27",
-                "@emotion/serialize": "^0.11.15",
-                "@emotion/sheet": "0.9.4",
-                "@emotion/utils": "0.11.3"
-            }
-        },
-        "node_modules/@emotion/css": {
-            "version": "10.0.27",
-            "resolved": "https://registry.npmjs.org/@emotion/css/-/css-10.0.27.tgz",
-            "integrity": "sha512-6wZjsvYeBhyZQYNrGoR5yPMYbMBNEnanDrqmsqS1mzDm1cOTu12shvl2j4QHNS36UaTE0USIJawCH9C8oW34Zw==",
-            "dependencies": {
-                "@emotion/serialize": "^0.11.15",
-                "@emotion/utils": "0.11.3",
-                "babel-plugin-emotion": "^10.0.27"
-            }
-        },
-        "node_modules/@emotion/hash": {
-            "version": "0.8.0",
-            "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz",
-            "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow=="
-        },
-        "node_modules/@emotion/is-prop-valid": {
-            "version": "0.8.8",
-            "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz",
-            "integrity": "sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==",
-            "dependencies": {
-                "@emotion/memoize": "0.7.4"
-            }
-        },
-        "node_modules/@emotion/memoize": {
-            "version": "0.7.4",
-            "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz",
-            "integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw=="
-        },
-        "node_modules/@emotion/serialize": {
-            "version": "0.11.16",
-            "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-0.11.16.tgz",
-            "integrity": "sha512-G3J4o8by0VRrO+PFeSc3js2myYNOXVJ3Ya+RGVxnshRYgsvErfAOglKAiy1Eo1vhzxqtUvjCyS5gtewzkmvSSg==",
-            "dependencies": {
-                "@emotion/hash": "0.8.0",
-                "@emotion/memoize": "0.7.4",
-                "@emotion/unitless": "0.7.5",
-                "@emotion/utils": "0.11.3",
-                "csstype": "^2.5.7"
-            }
-        },
-        "node_modules/@emotion/sheet": {
-            "version": "0.9.4",
-            "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-0.9.4.tgz",
-            "integrity": "sha512-zM9PFmgVSqBw4zL101Q0HrBVTGmpAxFZH/pYx/cjJT5advXguvcgjHFTCaIO3enL/xr89vK2bh0Mfyj9aa0ANA=="
-        },
-        "node_modules/@emotion/styled": {
-            "version": "10.0.27",
-            "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-10.0.27.tgz",
-            "integrity": "sha512-iK/8Sh7+NLJzyp9a5+vIQIXTYxfT4yB/OJbjzQanB2RZpvmzBQOHZWhpAMZWYEKRNNbsD6WfBw5sVWkb6WzS/Q==",
-            "dependencies": {
-                "@emotion/styled-base": "^10.0.27",
-                "babel-plugin-emotion": "^10.0.27"
-            }
-        },
-        "node_modules/@emotion/styled-base": {
-            "version": "10.0.31",
-            "resolved": "https://registry.npmjs.org/@emotion/styled-base/-/styled-base-10.0.31.tgz",
-            "integrity": "sha512-wTOE1NcXmqMWlyrtwdkqg87Mu6Rj1MaukEoEmEkHirO5IoHDJ8LgCQL4MjJODgxWxXibGR3opGp1p7YvkNEdXQ==",
-            "dependencies": {
-                "@babel/runtime": "^7.5.5",
-                "@emotion/is-prop-valid": "0.8.8",
-                "@emotion/serialize": "^0.11.15",
-                "@emotion/utils": "0.11.3"
-            }
-        },
-        "node_modules/@emotion/stylis": {
-            "version": "0.8.5",
-            "resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.8.5.tgz",
-            "integrity": "sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ=="
-        },
-        "node_modules/@emotion/unitless": {
-            "version": "0.7.5",
-            "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz",
-            "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg=="
-        },
-        "node_modules/@emotion/utils": {
-            "version": "0.11.3",
-            "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-0.11.3.tgz",
-            "integrity": "sha512-0o4l6pZC+hI88+bzuaX/6BgOvQVhbt2PfmxauVaYOGgbsAw14wdKyvMCZXnsnsHys94iadcF+RG/wZyx6+ZZBw=="
-        },
-        "node_modules/@emotion/weak-memoize": {
-            "version": "0.2.5",
-            "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz",
-            "integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA=="
-        },
-        "node_modules/@fortawesome/fontawesome-common-types": {
-            "version": "0.2.29",
-            "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.29.tgz",
-            "integrity": "sha512-cY+QfDTbZ7XVxzx7jxbC98Oxr/zc7R2QpTLqTxqlfyXDrAJjzi/xUIqAUsygELB62JIrbsWxtSRhayKFkGI7MA==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/@fortawesome/fontawesome-svg-core": {
-            "version": "1.2.29",
-            "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.29.tgz",
-            "integrity": "sha512-xmPmP2t8qrdo8RyKihTkGb09RnZoc+7HFBCnr0/6ZhStdGDSLeEd7ajV181+2W29NWIFfylO13rU+s3fpy3cnA==",
-            "dependencies": {
-                "@fortawesome/fontawesome-common-types": "^0.2.29"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/@fortawesome/free-brands-svg-icons": {
-            "version": "5.14.0",
-            "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-5.14.0.tgz",
-            "integrity": "sha512-WsqPFTvJFI7MYkcy0jeFE2zY+blC4OrnB9MJOcn1NxRXT/sSfEEhrI7CwzIkiYajLiVDBKWeErYOvpsMeodmCQ==",
-            "dependencies": {
-                "@fortawesome/fontawesome-common-types": "^0.2.30"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/@fortawesome/free-brands-svg-icons/node_modules/@fortawesome/fontawesome-common-types": {
-            "version": "0.2.30",
-            "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.30.tgz",
-            "integrity": "sha512-TsRwpTuKwFNiPhk1UfKgw7zNPeV5RhNp2Uw3pws+9gDAkPGKrtjR1y2lI3SYn7+YzyfuNknflpBA1LRKjt7hMg==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/@fortawesome/free-regular-svg-icons": {
-            "version": "5.13.1",
-            "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-5.13.1.tgz",
-            "integrity": "sha512-sSeaqqmv2ovA5LKcrbh3VnEDZHVhaxijWKm4R0AdT0eG21pgxNsJbStD8lW9z6bgSuWXRNHhbhOmARuRCLS8tw==",
-            "dependencies": {
-                "@fortawesome/fontawesome-common-types": "^0.2.29"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/@fortawesome/free-solid-svg-icons": {
-            "version": "5.13.1",
-            "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.13.1.tgz",
-            "integrity": "sha512-LQH/0L1p4+rqtoSHa9qFYR84hpuRZKqaQ41cfBQx8b68p21zoWSekTAeA54I/2x9VlCHDLFlG74Nmdg4iTPQOg==",
-            "dependencies": {
-                "@fortawesome/fontawesome-common-types": "^0.2.29"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/@fortawesome/react-fontawesome": {
-            "version": "0.1.11",
-            "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.1.11.tgz",
-            "integrity": "sha512-sClfojasRifQKI0OPqTy8Ln8iIhnxR/Pv/hukBhWnBz9kQRmqi6JSH3nghlhAY7SUeIIM7B5/D2G8WjX0iepVg==",
-            "dependencies": {
-                "prop-types": "^15.7.2"
-            }
-        },
-        "node_modules/@hig/flyout": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/@hig/flyout/-/flyout-1.2.1.tgz",
-            "integrity": "sha512-oNybmhStyMmEC07DPsjMZg4Dgm65X7Jcp2nDFR9zZghVof/1C3WJtJvdouVgqx7BJw2IedVj8CUGoPuoll/0IQ==",
-            "dependencies": {
-                "@hig/utils": "^0.4.0",
-                "emotion": "^10.0.0",
-                "prop-types": "^15.7.1",
-                "react-transition-group": "^2.3.1"
-            }
-        },
-        "node_modules/@hig/theme-context": {
-            "version": "2.1.3",
-            "resolved": "https://registry.npmjs.org/@hig/theme-context/-/theme-context-2.1.3.tgz",
-            "integrity": "sha512-c0Ju+Z8C532ZZtjwOLzN+XeO+pL3kqUawu6ZG3J084MH5RM9W8JCKyMf4D9Qr38jFWoiX6u8yiSxxjV/mz9Sqw==",
-            "dependencies": {
-                "create-react-context": "^0.2.3",
-                "prop-types": "^15.6.1"
-            }
-        },
-        "node_modules/@hig/theme-data": {
-            "version": "2.16.1",
-            "resolved": "https://registry.npmjs.org/@hig/theme-data/-/theme-data-2.16.1.tgz",
-            "integrity": "sha512-3nBnzRqYyc6ejoCgA+zBjQGqe6LAXlcemTs0257E5bWu/JyZe8YyOLN+psq2zyjF+FUk35p38wWNPyaOcPnhvw==",
-            "dependencies": {
-                "tinycolor2": "^1.4.1"
-            }
-        },
-        "node_modules/@hig/utils": {
-            "version": "0.4.0",
-            "resolved": "https://registry.npmjs.org/@hig/utils/-/utils-0.4.0.tgz",
-            "integrity": "sha512-EQnMGZKdPh9UJaBUKLKXp92sSoCo+PTpgrGNd8q+71uRFdD0udMu/+yeVekTEtNOJcCk1gnKfyg1rRvIbTcpRw==",
-            "dependencies": {
-                "emotion": "^10.0.0",
-                "lodash.memoize": "^4.1.2"
-            }
-        },
-        "node_modules/@icons/material": {
-            "version": "0.2.4",
-            "resolved": "https://registry.npmjs.org/@icons/material/-/material-0.2.4.tgz",
-            "integrity": "sha512-QPcGmICAPbGLGb6F/yNf/KzKqvFx8z5qx3D1yFqVAjoFmXK35EgyW+cJ57Te3CNsmzblwtzakLGFqHPqrfb4Tw=="
-        },
-        "node_modules/@log4js-node/log4js-api": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/@log4js-node/log4js-api/-/log4js-api-1.0.2.tgz",
-            "integrity": "sha512-6SJfx949YEWooh/CUPpJ+F491y4BYJmknz4hUN1+RHvKoUEynKbRmhnwbk/VLmh4OthLLDNCyWXfbh4DG1cTXA=="
-        },
-        "node_modules/@material-ui/core": {
-            "version": "4.11.0",
-            "resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.11.0.tgz",
-            "integrity": "sha512-bYo9uIub8wGhZySHqLQ833zi4ZML+XCBE1XwJ8EuUVSpTWWG57Pm+YugQToJNFsEyiKFhPh8DPD0bgupz8n01g==",
-            "dependencies": {
-                "@babel/runtime": "^7.4.4",
-                "@material-ui/styles": "^4.10.0",
-                "@material-ui/system": "^4.9.14",
-                "@material-ui/types": "^5.1.0",
-                "@material-ui/utils": "^4.10.2",
-                "@types/react-transition-group": "^4.2.0",
-                "clsx": "^1.0.4",
-                "hoist-non-react-statics": "^3.3.2",
-                "popper.js": "1.16.1-lts",
-                "prop-types": "^15.7.2",
-                "react-is": "^16.8.0",
-                "react-transition-group": "^4.4.0"
-            },
-            "engines": {
-                "node": ">=8.0.0"
-            }
-        },
-        "node_modules/@material-ui/core/node_modules/dom-helpers": {
-            "version": "5.1.4",
-            "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.1.4.tgz",
-            "integrity": "sha512-TjMyeVUvNEnOnhzs6uAn9Ya47GmMo3qq7m+Lr/3ON0Rs5kHvb8I+SQYjLUSYn7qhEm0QjW0yrBkvz9yOrwwz1A==",
-            "dependencies": {
-                "@babel/runtime": "^7.8.7",
-                "csstype": "^2.6.7"
-            }
-        },
-        "node_modules/@material-ui/core/node_modules/popper.js": {
-            "version": "1.16.1-lts",
-            "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz",
-            "integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA=="
-        },
-        "node_modules/@material-ui/core/node_modules/react-transition-group": {
-            "version": "4.4.1",
-            "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.1.tgz",
-            "integrity": "sha512-Djqr7OQ2aPUiYurhPalTrVy9ddmFCCzwhqQmtN+J3+3DzLO209Fdr70QrN8Z3DsglWql6iY1lDWAfpFiBtuKGw==",
-            "dependencies": {
-                "@babel/runtime": "^7.5.5",
-                "dom-helpers": "^5.0.1",
-                "loose-envify": "^1.4.0",
-                "prop-types": "^15.6.2"
-            }
-        },
-        "node_modules/@material-ui/styles": {
-            "version": "4.10.0",
-            "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.10.0.tgz",
-            "integrity": "sha512-XPwiVTpd3rlnbfrgtEJ1eJJdFCXZkHxy8TrdieaTvwxNYj42VnnCyFzxYeNW9Lhj4V1oD8YtQ6S5Gie7bZDf7Q==",
-            "dependencies": {
-                "@babel/runtime": "^7.4.4",
-                "@emotion/hash": "^0.8.0",
-                "@material-ui/types": "^5.1.0",
-                "@material-ui/utils": "^4.9.6",
-                "clsx": "^1.0.4",
-                "csstype": "^2.5.2",
-                "hoist-non-react-statics": "^3.3.2",
-                "jss": "^10.0.3",
-                "jss-plugin-camel-case": "^10.0.3",
-                "jss-plugin-default-unit": "^10.0.3",
-                "jss-plugin-global": "^10.0.3",
-                "jss-plugin-nested": "^10.0.3",
-                "jss-plugin-props-sort": "^10.0.3",
-                "jss-plugin-rule-value-function": "^10.0.3",
-                "jss-plugin-vendor-prefixer": "^10.0.3",
-                "prop-types": "^15.7.2"
-            },
-            "engines": {
-                "node": ">=8.0.0"
-            }
-        },
-        "node_modules/@material-ui/system": {
-            "version": "4.9.14",
-            "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.9.14.tgz",
-            "integrity": "sha512-oQbaqfSnNlEkXEziDcJDDIy8pbvwUmZXWNqlmIwDqr/ZdCK8FuV3f4nxikUh7hvClKV2gnQ9djh5CZFTHkZj3w==",
-            "dependencies": {
-                "@babel/runtime": "^7.4.4",
-                "@material-ui/utils": "^4.9.6",
-                "csstype": "^2.5.2",
-                "prop-types": "^15.7.2"
-            },
-            "engines": {
-                "node": ">=8.0.0"
-            }
-        },
-        "node_modules/@material-ui/types": {
-            "version": "5.1.0",
-            "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz",
-            "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A=="
-        },
-        "node_modules/@material-ui/utils": {
-            "version": "4.10.2",
-            "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.10.2.tgz",
-            "integrity": "sha512-eg29v74P7W5r6a4tWWDAAfZldXIzfyO1am2fIsC39hdUUHm/33k6pGOKPbgDjg/U/4ifmgAePy/1OjkKN6rFRw==",
-            "dependencies": {
-                "@babel/runtime": "^7.4.4",
-                "prop-types": "^15.7.2",
-                "react-is": "^16.8.0"
-            },
-            "engines": {
-                "node": ">=8.0.0"
-            }
-        },
-        "node_modules/@react-three/fiber": {
-            "version": "6.0.16",
-            "resolved": "https://registry.npmjs.org/@react-three/fiber/-/fiber-6.0.16.tgz",
-            "integrity": "sha512-oKMYNJOd5t+V4o18aRMhaRhcDQ1NeeCDy52yJvXpu7zrsR04YZtXD4RacW0FDH0KnwkOLDst95LCCphm3Thk/A==",
-            "dependencies": {
-                "@babel/runtime": "^7.13.10",
-                "react-merge-refs": "^1.1.0",
-                "react-reconciler": "^0.26.2",
-                "react-three-fiber": "0.0.0-deprecated",
-                "react-use-measure": "^2.0.4",
-                "resize-observer-polyfill": "^1.5.1",
-                "scheduler": "^0.20.2",
-                "use-asset": "^1.0.4",
-                "utility-types": "^3.10.0",
-                "zustand": "^3.3.3"
-            }
-        },
-        "node_modules/@react-three/fiber/node_modules/@babel/runtime": {
-            "version": "7.13.17",
-            "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.13.17.tgz",
-            "integrity": "sha512-NCdgJEelPTSh+FEFylhnP1ylq848l1z9t9N0j1Lfbcw0+KXGjsTvUmkxy+voLLXB5SOKMbLLx4jxYliGrYQseA==",
-            "dependencies": {
-                "regenerator-runtime": "^0.13.4"
-            }
-        },
-        "node_modules/@react-three/fiber/node_modules/scheduler": {
-            "version": "0.20.2",
-            "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
-            "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
-            "dependencies": {
-                "loose-envify": "^1.1.0",
-                "object-assign": "^4.1.1"
-            }
-        },
-        "node_modules/@rkusa/linebreak": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/@rkusa/linebreak/-/linebreak-1.0.0.tgz",
-            "integrity": "sha512-yCSm87XA1aYMgfcABSxcIkk3JtCw3AihNceHY+DnZGLvVP/g2z3UWZbi0xIoYpZWAJEVPr5Zt3QE37Q80wF1pA==",
-            "dependencies": {
-                "unicode-trie": "^0.3.0"
-            }
-        },
-        "node_modules/@types/adm-zip": {
-            "version": "0.4.33",
-            "resolved": "https://registry.npmjs.org/@types/adm-zip/-/adm-zip-0.4.33.tgz",
-            "integrity": "sha512-WM0DCWFLjXtddl0fu0+iN2ZF+qz8RF9RddG5OSy/S90AQz01Fu8lHn/3oTIZDxvG8gVcnBLAHMHOdBLbV6m6Mw==",
-            "dev": true,
-            "dependencies": {
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/animejs": {
-            "version": "2.0.2",
-            "resolved": "https://registry.npmjs.org/@types/animejs/-/animejs-2.0.2.tgz",
-            "integrity": "sha512-ACymFQ5qgSrZNR1Fqjk7Wv9gH6dFgejn2gpLkkceWxTKzivRJsshX4xhBVALgvF79gUdXiMCRIdusN728XpeGA==",
-            "dev": true
-        },
-        "node_modules/@types/anymatch": {
-            "version": "1.3.1",
-            "resolved": "https://registry.npmjs.org/@types/anymatch/-/anymatch-1.3.1.tgz",
-            "integrity": "sha512-/+CRPXpBDpo2RK9C68N3b2cOvO0Cf5B9aPijHsoDQTHivnGSObdOF2BRQOYjojWTDy6nQvMjmqRXIxH55VjxxA==",
-            "dev": true
-        },
-        "node_modules/@types/archiver": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/@types/archiver/-/archiver-3.1.0.tgz",
-            "integrity": "sha512-nTvHwgWONL+iXG+9CX+gnQ/tTOV+qucAjwpXqeUn4OCRMxP42T29FFP/7XaOo0EqqO3TlENhObeZEe7RUJAriw==",
-            "dev": true,
-            "dependencies": {
-                "@types/glob": "*"
-            }
-        },
-        "node_modules/@types/assert": {
-            "version": "1.5.4",
-            "resolved": "https://registry.npmjs.org/@types/assert/-/assert-1.5.4.tgz",
-            "integrity": "sha512-CaFVW21Ulu0J9sUaEWJjwmhkDkeoxa4fniVSERzZC13sU9v8NNM2lMlkfZZv60j47D+qDt0Lyo8skVP3CTXUdA=="
-        },
-        "node_modules/@types/async": {
-            "version": "2.4.2",
-            "resolved": "https://registry.npmjs.org/@types/async/-/async-2.4.2.tgz",
-            "integrity": "sha512-bWBbC7VG2jdjbgZMX0qpds8U/3h3anfIqE81L8jmVrgFZw/urEDnBA78ymGGKTTK6ciBXmmJ/xlok+Re41S8ww==",
-            "dev": true
-        },
-        "node_modules/@types/babel-types": {
-            "version": "7.0.7",
-            "resolved": "https://registry.npmjs.org/@types/babel-types/-/babel-types-7.0.7.tgz",
-            "integrity": "sha512-dBtBbrc+qTHy1WdfHYjBwRln4+LWqASWakLHsWHR2NWHIFkv4W3O070IGoGLEBrJBvct3r0L1BUPuvURi7kYUQ=="
-        },
-        "node_modules/@types/babylon": {
-            "version": "6.16.5",
-            "resolved": "https://registry.npmjs.org/@types/babylon/-/babylon-6.16.5.tgz",
-            "integrity": "sha512-xH2e58elpj1X4ynnKp9qSnWlsRTIs6n3tgLGNfwAGHwePw0mulHQllV34n0T25uYSu1k0hRKkWXF890B1yS47w==",
-            "dependencies": {
-                "@types/babel-types": "*"
-            }
-        },
-        "node_modules/@types/bcrypt-nodejs": {
-            "version": "0.0.30",
-            "resolved": "https://registry.npmjs.org/@types/bcrypt-nodejs/-/bcrypt-nodejs-0.0.30.tgz",
-            "integrity": "sha1-TN2WtJKTs5MhIuS34pVD415rrlg=",
-            "dev": true
-        },
-        "node_modules/@types/bluebird": {
-            "version": "3.5.32",
-            "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.32.tgz",
-            "integrity": "sha512-dIOxFfI0C+jz89g6lQ+TqhGgPQ0MxSnh/E4xuC0blhFtyW269+mPG5QeLgbdwst/LvdP8o1y0o/Gz5EHXLec/g==",
-            "dev": true
-        },
-        "node_modules/@types/body-parser": {
-            "version": "1.19.0",
-            "resolved": "https://registry.npmjs.org/@types/body-parser/-/body-parser-1.19.0.tgz",
-            "integrity": "sha512-W98JrE0j2K78swW4ukqMleo8R7h/pFETjM2DQ90MF6XK2i4LO4W3gQ71Lt4w3bfm2EvVSyWHplECvB5sK22yFQ==",
-            "dependencies": {
-                "@types/connect": "*",
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/bson": {
-            "version": "4.0.2",
-            "resolved": "https://registry.npmjs.org/@types/bson/-/bson-4.0.2.tgz",
-            "integrity": "sha512-+uWmsejEHfmSjyyM/LkrP0orfE2m5Mx9Xel4tXNeqi1ldK5XMQcDsFkBmLDtuyKUbxj2jGDo0H240fbCRJZo7Q==",
-            "dev": true,
-            "dependencies": {
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/caseless": {
-            "version": "0.12.2",
-            "resolved": "https://registry.npmjs.org/@types/caseless/-/caseless-0.12.2.tgz",
-            "integrity": "sha512-6ckxMjBBD8URvjB6J3NcnuAn5Pkl7t3TizAg+xdlzzQGSPSmBcXf8KoIH0ua/i+tio+ZRUHEXp0HEmvaR4kt0w==",
-            "dev": true
-        },
-        "node_modules/@types/chai": {
-            "version": "4.2.11",
-            "resolved": "https://registry.npmjs.org/@types/chai/-/chai-4.2.11.tgz",
-            "integrity": "sha512-t7uW6eFafjO+qJ3BIV2gGUyZs27egcNRkUdalkud+Qa3+kg//f129iuOFivHDXQ+vnU3fDXuwgv0cqMCbcE8sw==",
-            "dev": true
-        },
-        "node_modules/@types/color": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/@types/color/-/color-3.0.1.tgz",
-            "integrity": "sha512-oeUWVaAwI+xINDUx+3F2vJkl/vVB03VChFF/Gl3iQCdbcakjuoJyMOba+3BXRtnBhxZ7uBYqQBi9EpLnvSoztA==",
-            "dev": true,
-            "dependencies": {
-                "@types/color-convert": "*"
-            }
-        },
-        "node_modules/@types/color-convert": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@types/color-convert/-/color-convert-1.9.0.tgz",
-            "integrity": "sha512-OKGEfULrvSL2VRbkl/gnjjgbbF7ycIlpSsX7Nkab4MOWi5XxmgBYvuiQ7lcCFY5cPDz7MUNaKgxte2VRmtr4Fg==",
-            "dev": true,
-            "dependencies": {
-                "@types/color-name": "*"
-            }
-        },
-        "node_modules/@types/color-name": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/@types/color-name/-/color-name-1.1.1.tgz",
-            "integrity": "sha512-rr+OQyAjxze7GgWrSaJwydHStIhHq2lvY3BOC2Mj7KnzI7XK0Uw1TOOdI9lDoajEbSWLiYgoo4f1R51erQfhPQ=="
-        },
-        "node_modules/@types/connect": {
-            "version": "3.4.33",
-            "resolved": "https://registry.npmjs.org/@types/connect/-/connect-3.4.33.tgz",
-            "integrity": "sha512-2+FrkXY4zllzTNfJth7jOqEHC+enpLeGslEhpnTAkg21GkRrWV4SsAtqchtT4YS9/nODBU2/ZfsBY2X4J/dX7A==",
-            "dependencies": {
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/connect-flash": {
-            "version": "0.0.34",
-            "resolved": "https://registry.npmjs.org/@types/connect-flash/-/connect-flash-0.0.34.tgz",
-            "integrity": "sha512-QC93TwnTZ0sk//bfT81o7U4GOedbOZAcgvqi0v1vJqCESC8tqIVnhzB1CHiAUBUWFjoxG5JQF0TYaNa6DMb6Ig==",
-            "dev": true,
-            "dependencies": {
-                "@types/express": "*"
-            }
-        },
-        "node_modules/@types/cookie-parser": {
-            "version": "1.4.2",
-            "resolved": "https://registry.npmjs.org/@types/cookie-parser/-/cookie-parser-1.4.2.tgz",
-            "integrity": "sha512-uwcY8m6SDQqciHsqcKDGbo10GdasYsPCYkH3hVegj9qAah6pX5HivOnOuI3WYmyQMnOATV39zv/Ybs0bC/6iVg==",
-            "dev": true,
-            "dependencies": {
-                "@types/express": "*"
-            }
-        },
-        "node_modules/@types/cookie-session": {
-            "version": "2.0.41",
-            "resolved": "https://registry.npmjs.org/@types/cookie-session/-/cookie-session-2.0.41.tgz",
-            "integrity": "sha512-Ytd7zWY3WvC7TP9rKVjlnYHus8Hq+lJuioHOtKJ7dXg2Nt+O+9UpelygYy5Eb67QQN92HPO5qEG0vnmAlqRLLw==",
-            "dev": true,
-            "dependencies": {
-                "@types/express": "*",
-                "@types/keygrip": "*"
-            }
-        },
-        "node_modules/@types/cors": {
-            "version": "2.8.8",
-            "resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.8.tgz",
-            "integrity": "sha512-fO3gf3DxU2Trcbr75O7obVndW/X5k8rJNZkLXlQWStTHhP71PkRqjwPIEI0yMnJdg9R9OasjU+Bsr+Hr1xy/0w==",
-            "dependencies": {
-                "@types/express": "*"
-            }
-        },
-        "node_modules/@types/d3-axis": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/@types/d3-axis/-/d3-axis-2.0.0.tgz",
-            "integrity": "sha512-gUdlEwGBLl3tXGiBnBNmNzph9W3bCfa4tBgWZD60Z1eDQKTY4zyCAcZ3LksignGfKawYatmDYcBdjJ5h/54sqA==",
-            "dependencies": {
-                "@types/d3-selection": "*"
-            }
-        },
-        "node_modules/@types/d3-color": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/@types/d3-color/-/d3-color-2.0.1.tgz",
-            "integrity": "sha512-u7LTCL7RnaavFSmob2rIAJLNwu50i6gFwY9cHFr80BrQURYQBRkJ+Yv47nA3Fm7FeRhdWTiVTeqvSeOuMAOzBQ=="
-        },
-        "node_modules/@types/d3-scale": {
-            "version": "3.2.2",
-            "resolved": "https://registry.npmjs.org/@types/d3-scale/-/d3-scale-3.2.2.tgz",
-            "integrity": "sha512-qpQe8G02tzUwt9sdWX1h8A/W0Q1+N48wMnYXVOkrzeLUkCfvzJYV9Ee3aORCS4dN4ONRLFmMvaXdziQ29XGLjQ==",
-            "dependencies": {
-                "@types/d3-time": "*"
-            }
-        },
-        "node_modules/@types/d3-selection": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/@types/d3-selection/-/d3-selection-2.0.0.tgz",
-            "integrity": "sha512-EF0lWZ4tg7oDFg4YQFlbOU3936e3a9UmoQ2IXlBy1+cv2c2Pv7knhKUzGlH5Hq2sF/KeDTH1amiRPey2rrLMQA=="
-        },
-        "node_modules/@types/d3-time": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/@types/d3-time/-/d3-time-2.0.0.tgz",
-            "integrity": "sha512-Abz8bTzy8UWDeYs9pCa3D37i29EWDjNTjemdk0ei1ApYVNqulYlGUKip/jLOpogkPSsPz/GvZCYiC7MFlEk0iQ=="
-        },
-        "node_modules/@types/dotenv": {
-            "version": "6.1.1",
-            "resolved": "https://registry.npmjs.org/@types/dotenv/-/dotenv-6.1.1.tgz",
-            "integrity": "sha512-ftQl3DtBvqHl9L16tpqqzA4YzCSXZfi7g8cQceTz5rOlYtk/IZbFjAv3mLOQlNIgOaylCQWQoBdDQHPgEBJPHg==",
-            "dev": true,
-            "dependencies": {
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/engine.io": {
-            "version": "3.1.4",
-            "resolved": "https://registry.npmjs.org/@types/engine.io/-/engine.io-3.1.4.tgz",
-            "integrity": "sha512-98rXVukLD6/ozrQ2O80NAlWDGA4INg+tqsEReWJldqyi2fulC9V7Use/n28SWgROXKm6003ycWV4gZHoF8GA6w==",
-            "dev": true,
-            "dependencies": {
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/events": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/@types/events/-/events-3.0.0.tgz",
-            "integrity": "sha512-EaObqwIvayI5a8dCzhFrjKzVwKLxjoG9T6Ppd5CEo07LRKfQ8Yokw54r5+Wq7FaBQ+yXRvQAYPrHwya1/UFt9g==",
-            "dev": true
-        },
-        "node_modules/@types/exif": {
-            "version": "0.6.1",
-            "resolved": "https://registry.npmjs.org/@types/exif/-/exif-0.6.1.tgz",
-            "integrity": "sha512-hw4RQiuu+L//CpZ1vL3EopGY3L6mGvPFK2CpWCmvlwUAquvosWfCU3ZFq9jsZ2rmIun71XJm2I2KPx7tT1VuxA==",
-            "dev": true,
-            "dependencies": {
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/express": {
-            "version": "4.17.6",
-            "resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.6.tgz",
-            "integrity": "sha512-n/mr9tZI83kd4azlPG5y997C/M4DNABK9yErhFM6hKdym4kkmd9j0vtsJyjFIwfRBxtrxZtAfGZCNRIBMFLK5w==",
-            "dependencies": {
-                "@types/body-parser": "*",
-                "@types/express-serve-static-core": "*",
-                "@types/qs": "*",
-                "@types/serve-static": "*"
-            }
-        },
-        "node_modules/@types/express-flash": {
-            "version": "0.0.0",
-            "resolved": "https://registry.npmjs.org/@types/express-flash/-/express-flash-0.0.0.tgz",
-            "integrity": "sha512-zs1xXRIZOjghUBriJPSnhPmfDpqf/EQxT21ggi/9XZ9/RHYrUi+5vK2jnQrP2pD1abbuZvm7owLICiNCLBQzEQ==",
-            "dev": true,
-            "dependencies": {
-                "@types/connect-flash": "*",
-                "@types/express": "*"
-            }
-        },
-        "node_modules/@types/express-serve-static-core": {
-            "version": "4.17.5",
-            "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.17.5.tgz",
-            "integrity": "sha512-578YH5Lt88AKoADy0b2jQGwJtrBxezXtVe/MBqWXKZpqx91SnC0pVkVCcxcytz3lWW+cHBYDi3Ysh0WXc+rAYw==",
-            "dependencies": {
-                "@types/node": "*",
-                "@types/range-parser": "*"
-            }
-        },
-        "node_modules/@types/express-session": {
-            "version": "1.17.0",
-            "resolved": "https://registry.npmjs.org/@types/express-session/-/express-session-1.17.0.tgz",
-            "integrity": "sha512-OQEHeBFE1UhChVIBhRh9qElHUvTp4BzKKHxMDkGHT7WuYk5eL93hPG7D8YAIkoBSbhNEY0RjreF15zn+U0eLjA==",
-            "dev": true,
-            "dependencies": {
-                "@types/express": "*",
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/express-validator": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/@types/express-validator/-/express-validator-3.0.0.tgz",
-            "integrity": "sha512-LusnB0YhTXpBT25PXyGPQlK7leE1e41Vezq1hHEUwjfkopM1Pkv2X2Ppxqh9c+w/HZ6Udzki8AJotKNjDTGdkQ==",
-            "dev": true,
-            "dependencies": {
-                "express-validator": "*"
-            }
-        },
-        "node_modules/@types/file-saver": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/@types/file-saver/-/file-saver-2.0.1.tgz",
-            "integrity": "sha512-g1QUuhYVVAamfCifK7oB7G3aIl4BbOyzDOqVyUfEr4tfBKrXfeH+M+Tg7HKCXSrbzxYdhyCP7z9WbKo0R2hBCw==",
-            "dev": true
-        },
-        "node_modules/@types/formidable": {
-            "version": "1.0.31",
-            "resolved": "https://registry.npmjs.org/@types/formidable/-/formidable-1.0.31.tgz",
-            "integrity": "sha512-dIhM5t8lRP0oWe2HF8MuPvdd1TpPTjhDMAqemcq6oIZQCBQTovhBAdTQ5L5veJB4pdQChadmHuxtB0YzqvfU3Q==",
-            "dev": true,
-            "dependencies": {
-                "@types/events": "*",
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/glob": {
-            "version": "7.1.1",
-            "resolved": "https://registry.npmjs.org/@types/glob/-/glob-7.1.1.tgz",
-            "integrity": "sha512-1Bh06cbWJUHMC97acuD6UMG29nMt0Aqz1vF3guLfG+kHHJhy3AyohZFFxYk2f7Q1SQIrNwvncxAE0N/9s70F2w==",
-            "dev": true,
-            "dependencies": {
-                "@types/events": "*",
-                "@types/minimatch": "*",
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/google-maps": {
-            "version": "3.2.2",
-            "resolved": "https://registry.npmjs.org/@types/google-maps/-/google-maps-3.2.2.tgz",
-            "integrity": "sha512-/XPVfS28VzUdE/HlmBRoe5ii1nNMyWujyRfRY08bD/JgmPlWSiY8enB2dqTe9mlc3kULq7LfFa1wcupM+lQfqA==",
-            "dependencies": {
-                "@types/googlemaps": "*"
-            }
-        },
-        "node_modules/@types/google-maps-react": {
-            "version": "2.0.5",
-            "resolved": "https://registry.npmjs.org/@types/google-maps-react/-/google-maps-react-2.0.5.tgz",
-            "integrity": "sha512-qcsYlHiNH169Vf7jmkEwbzBDqBfqqzYkTgK1vL7qkWVZI04wFESADYVITuQunrZ9swY/SG+tTWUIXMlY4W8byw==",
-            "dev": true,
-            "dependencies": {
-                "google-maps-react": "*"
-            }
-        },
-        "node_modules/@types/googlemaps": {
-            "version": "3.39.8",
-            "resolved": "https://registry.npmjs.org/@types/googlemaps/-/googlemaps-3.39.8.tgz",
-            "integrity": "sha512-z03u79t1v8QIktoUXypWD06Fzl499/hA162hurA+eCDlWXxFynuU+hMZIaferILF5Gzr4PMX1ShHszT666sUHQ=="
-        },
-        "node_modules/@types/jquery": {
-            "version": "3.5.0",
-            "resolved": "https://registry.npmjs.org/@types/jquery/-/jquery-3.5.0.tgz",
-            "integrity": "sha512-C7qQUjpMWDUNYQRTXsP5nbYYwCwwgy84yPgoTT7fPN69NH92wLeCtFaMsWeolJD1AF/6uQw3pYt62rzv83sMmw==",
-            "dev": true,
-            "dependencies": {
-                "@types/sizzle": "*"
-            }
-        },
-        "node_modules/@types/keygrip": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/@types/keygrip/-/keygrip-1.0.2.tgz",
-            "integrity": "sha512-GJhpTepz2udxGexqos8wgaBx4I/zWIDPh/KOGEwAqtuGDkOUJu5eFvwmdBX4AmB8Odsr+9pHCQqiAqDL/yKMKw==",
-            "dev": true
-        },
-        "node_modules/@types/libxmljs": {
-            "version": "0.18.6",
-            "resolved": "https://registry.npmjs.org/@types/libxmljs/-/libxmljs-0.18.6.tgz",
-            "integrity": "sha512-xVUs71CwL5wYYfx5oH344DYWdoE2hVWlnRxlXFYyA8BcueN+Ey/h4FyhzEikbIJSXBKyPpJKhGu5c3NOx15nww==",
-            "dev": true,
-            "dependencies": {
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/lodash": {
-            "version": "4.14.157",
-            "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.157.tgz",
-            "integrity": "sha512-Ft5BNFmv2pHDgxV5JDsndOWTRJ+56zte0ZpYLowp03tW+K+t8u8YMOzAnpuqPgzX6WO1XpDIUm7u04M8vdDiVQ==",
-            "dev": true
-        },
-        "node_modules/@types/memory-fs": {
-            "version": "0.3.3",
-            "resolved": "https://registry.npmjs.org/@types/memory-fs/-/memory-fs-0.3.3.tgz",
-            "integrity": "sha512-rLEYzl1xODshz+Lm+YX8NYws8Xw7/qcYbQInMkotl96VpLZmUvoCfYYGxfajMSiugANV02QO5Fc+R98KKeE4gQ==",
-            "dev": true,
-            "dependencies": {
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/mime": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/@types/mime/-/mime-2.0.1.tgz",
-            "integrity": "sha512-FwI9gX75FgVBJ7ywgnq/P7tw+/o1GUbtP0KzbtusLigAOgIgNISRK0ZPl4qertvXSIE8YbsVJueQ90cDt9YYyw=="
-        },
-        "node_modules/@types/minimatch": {
-            "version": "3.0.3",
-            "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz",
-            "integrity": "sha512-tHq6qdbT9U1IRSGf14CL0pUlULksvY9OZ+5eEgl1N7t+OA3tGvNpxJCzuKQlsNgCVwbAs670L1vcVQi8j9HjnA==",
-            "dev": true
-        },
-        "node_modules/@types/mobile-detect": {
-            "version": "1.3.4",
-            "resolved": "https://registry.npmjs.org/@types/mobile-detect/-/mobile-detect-1.3.4.tgz",
-            "integrity": "sha512-MGBTvT5c7aH8eX6szFYP3dWPryNLt5iGlo31XNaJtt8o6jsg6tjn99eEMq9l8T6cPZymsr+J4Jth8+/G/04ZDw==",
-            "dev": true,
-            "dependencies": {
-                "mobile-detect": "*"
-            }
-        },
-        "node_modules/@types/mocha": {
-            "version": "5.2.7",
-            "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-5.2.7.tgz",
-            "integrity": "sha512-NYrtPht0wGzhwe9+/idPaBB+TqkY9AhTvOLMkThm0IoEfLaiVQZwBwyJ5puCkO3AUCWrmcoePjp2mbFocKy4SQ==",
-            "dev": true
-        },
-        "node_modules/@types/mongodb": {
-            "version": "3.5.25",
-            "resolved": "https://registry.npmjs.org/@types/mongodb/-/mongodb-3.5.25.tgz",
-            "integrity": "sha512-2H/Owt+pHCl9YmBOYnXc3VdnxejJEjVdH+QCWL5ZAfPehEn3evygKBX3/vKRv7aTwfNbUd0E5vjJdQklH/9a6w==",
-            "dev": true,
-            "dependencies": {
-                "@types/bson": "*",
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/mongoose": {
-            "version": "5.7.28",
-            "resolved": "https://registry.npmjs.org/@types/mongoose/-/mongoose-5.7.28.tgz",
-            "integrity": "sha512-ll74S2QhC34MSSSk30NHlU8ILESIA2l4mDfAfDse/VM20tT9MRV9WGKWK3HglKRmdL77iMUYMcgHdKJebabtzA==",
-            "dev": true,
-            "dependencies": {
-                "@types/mongodb": "*",
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/node": {
-            "version": "10.17.26",
-            "resolved": "https://registry.npmjs.org/@types/node/-/node-10.17.26.tgz",
-            "integrity": "sha512-myMwkO2Cr82kirHY8uknNRHEVtn0wV3DTQfkrjx17jmkstDRZ24gNUdl8AHXVyVclTYI/bNjgTPTAWvWLqXqkw=="
-        },
-        "node_modules/@types/nodemailer": {
-            "version": "4.6.8",
-            "resolved": "https://registry.npmjs.org/@types/nodemailer/-/nodemailer-4.6.8.tgz",
-            "integrity": "sha512-IX1P3bxDP1VIdZf6/kIWYNmSejkYm9MOyMEtoDFi4DVzKjJ3kY4GhOcOAKs6lZRjqVVmF9UjPOZXuQczlpZThw==",
-            "dev": true,
-            "dependencies": {
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/oauth": {
-            "version": "0.9.1",
-            "resolved": "https://registry.npmjs.org/@types/oauth/-/oauth-0.9.1.tgz",
-            "integrity": "sha512-a1iY62/a3yhZ7qH7cNUsxoI3U/0Fe9+RnuFrpTKr+0WVOzbKlSLojShCKe20aOD1Sppv+i8Zlq0pLDuTJnwS4A==",
-            "dev": true,
-            "dependencies": {
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/orderedmap": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/@types/orderedmap/-/orderedmap-1.0.0.tgz",
-            "integrity": "sha512-dxKo80TqYx3YtBipHwA/SdFmMMyLCnP+5mkEqN0eMjcTBzHkiiX0ES118DsjDBjvD+zeSsSU9jULTZ+frog+Gw==",
-            "dev": true
-        },
-        "node_modules/@types/parse-json": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.0.tgz",
-            "integrity": "sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA=="
-        },
-        "node_modules/@types/passport": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/@types/passport/-/passport-1.0.3.tgz",
-            "integrity": "sha512-nyztuxtDPQv9utCzU0qW7Gl8BY2Dn8BKlYAFFyxKipFxjaVd96celbkLCV/tRqqBUZ+JB8If3UfgV8347DTo3Q==",
-            "dev": true,
-            "dependencies": {
-                "@types/express": "*"
-            }
-        },
-        "node_modules/@types/passport-google-oauth20": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/@types/passport-google-oauth20/-/passport-google-oauth20-2.0.3.tgz",
-            "integrity": "sha512-6EUEGzEg4acwowvgR/yVZIj8S2Kkwc6JmlY2/wnM1wJHNz20o7s1TIGrxnah8ymLgJasYDpy95P3TMMqlmetPw==",
-            "dev": true,
-            "dependencies": {
-                "@types/express": "*",
-                "@types/passport": "*",
-                "@types/passport-oauth2": "*"
-            }
-        },
-        "node_modules/@types/passport-local": {
-            "version": "1.0.33",
-            "resolved": "https://registry.npmjs.org/@types/passport-local/-/passport-local-1.0.33.tgz",
-            "integrity": "sha512-+rn6ZIxje0jZ2+DAiWFI8vGG7ZFKB0hXx2cUdMmudSWsigSq6ES7Emso46r4HJk0qCgrZVfI8sJiM7HIYf4SbA==",
-            "dev": true,
-            "dependencies": {
-                "@types/express": "*",
-                "@types/passport": "*",
-                "@types/passport-strategy": "*"
-            }
-        },
-        "node_modules/@types/passport-oauth2": {
-            "version": "1.4.9",
-            "resolved": "https://registry.npmjs.org/@types/passport-oauth2/-/passport-oauth2-1.4.9.tgz",
-            "integrity": "sha512-QP0q+NVQOaIu2r0e10QWkiUA0Ya5mOBHRJN0UrI+LolMLOP1/VN4EVIpJ3xVwFo+xqNFRoFvFwJhBvKnk7kpUA==",
-            "dev": true,
-            "dependencies": {
-                "@types/express": "*",
-                "@types/oauth": "*",
-                "@types/passport": "*"
-            }
-        },
-        "node_modules/@types/passport-strategy": {
-            "version": "0.2.35",
-            "resolved": "https://registry.npmjs.org/@types/passport-strategy/-/passport-strategy-0.2.35.tgz",
-            "integrity": "sha512-o5D19Jy2XPFoX2rKApykY15et3Apgax00RRLf0RUotPDUsYrQa7x4howLYr9El2mlUApHmCMv5CZ1IXqKFQ2+g==",
-            "dev": true,
-            "dependencies": {
-                "@types/express": "*",
-                "@types/passport": "*"
-            }
-        },
-        "node_modules/@types/pdfjs-dist": {
-            "version": "2.1.4",
-            "resolved": "https://registry.npmjs.org/@types/pdfjs-dist/-/pdfjs-dist-2.1.4.tgz",
-            "integrity": "sha512-KnEc8W2IcntVL/SKfRWy2lcJax07xEaO7ghcT0/hc2Lp5UOcmaXAi887RKOLhP8BLKsVGJ7uYH0mYo1uSvbu2A==",
-            "dev": true
-        },
-        "node_modules/@types/prop-types": {
-            "version": "15.7.3",
-            "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz",
-            "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw=="
-        },
-        "node_modules/@types/prosemirror-commands": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/@types/prosemirror-commands/-/prosemirror-commands-1.0.1.tgz",
-            "integrity": "sha512-GeE12m8VT9N1JrzoY//946IX8ZyQOLNmvryJ+BNQs/HvhmXW9EWOcWUE6OBRtxK7Y8SrzSOwx4XmqSgVmK3tGQ==",
-            "dev": true,
-            "dependencies": {
-                "@types/prosemirror-model": "*",
-                "@types/prosemirror-state": "*",
-                "@types/prosemirror-view": "*"
-            }
-        },
-        "node_modules/@types/prosemirror-dev-tools": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/@types/prosemirror-dev-tools/-/prosemirror-dev-tools-2.1.0.tgz",
-            "integrity": "sha512-OhnSaC4yrrEMLPRUkEWcHAIPVqgKlLkE4kISqL3cHeAYxASouSPvPMLqhBIbWkGwaozy43DjjVC1OXkxTo+y5Q==",
-            "dev": true,
-            "dependencies": {
-                "@types/prosemirror-state": "*",
-                "@types/prosemirror-view": "*"
-            }
-        },
-        "node_modules/@types/prosemirror-history": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/@types/prosemirror-history/-/prosemirror-history-1.0.1.tgz",
-            "integrity": "sha512-BYyPJlWDo3VEnWS5X2DCHXrrAKEjdbCe1DUjGL6R/8hmwMFe3iMJGYdBkOXU1FfkTpw7Z+PlwY/pMyeelVydmg==",
-            "dev": true,
-            "dependencies": {
-                "@types/prosemirror-model": "*",
-                "@types/prosemirror-state": "*"
-            }
-        },
-        "node_modules/@types/prosemirror-inputrules": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/@types/prosemirror-inputrules/-/prosemirror-inputrules-1.0.2.tgz",
-            "integrity": "sha512-bKFneQUPnkZmzCJ1uoitpKH6PFW0hc4q55NsC7mFUCvX0eZl0GRKxyfV47jkJbsbyUQoO/QFv0WwLDz2bo15sA==",
-            "dev": true,
-            "dependencies": {
-                "@types/prosemirror-model": "*",
-                "@types/prosemirror-state": "*"
-            }
-        },
-        "node_modules/@types/prosemirror-keymap": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/@types/prosemirror-keymap/-/prosemirror-keymap-1.0.2.tgz",
-            "integrity": "sha512-94aDnpdrdI5S2UM7MQIjauFeo0MI5S7uU+SMT01m5NXT5CZ/NLHhzN0d1V5zKxe7Nh7fVxuZ7l9DTu5nSMN9sw==",
-            "dev": true,
-            "dependencies": {
-                "@types/prosemirror-model": "*",
-                "@types/prosemirror-state": "*",
-                "@types/prosemirror-view": "*"
-            }
-        },
-        "node_modules/@types/prosemirror-menu": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/@types/prosemirror-menu/-/prosemirror-menu-1.0.2.tgz",
-            "integrity": "sha512-u79CwEQR271k/kjdvRXyPGG7Rn+vPKbJfgSO7vOR/zEYcvSz7lLhBg1OZiSKqfSuhnIAbQh53qLylmB8PTw+WA==",
-            "dev": true,
-            "dependencies": {
-                "@types/prosemirror-model": "*",
-                "@types/prosemirror-state": "*",
-                "@types/prosemirror-view": "*"
-            }
-        },
-        "node_modules/@types/prosemirror-model": {
-            "version": "1.7.2",
-            "resolved": "https://registry.npmjs.org/@types/prosemirror-model/-/prosemirror-model-1.7.2.tgz",
-            "integrity": "sha512-2l+yXvidg3AUHN07mO4Jd8Q84fo6ksFsy7LHUurLYrZ74uTahBp2fzcO49AKZMzww2EulXJ40Kl/OFaQ/7A1fw==",
-            "dev": true,
-            "dependencies": {
-                "@types/orderedmap": "*"
-            }
-        },
-        "node_modules/@types/prosemirror-schema-list": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/@types/prosemirror-schema-list/-/prosemirror-schema-list-1.0.1.tgz",
-            "integrity": "sha512-+iUYq+pj2wVHSThj0MjNDzkkGwq8aDQ6j0UJK8a0cNCL8v44Ftcx1noGPtBIEUJgitH960VnfBNoTWfQoQZfRA==",
-            "dev": true,
-            "dependencies": {
-                "@types/orderedmap": "*",
-                "@types/prosemirror-model": "*",
-                "@types/prosemirror-state": "*"
-            }
-        },
-        "node_modules/@types/prosemirror-state": {
-            "version": "1.2.4",
-            "resolved": "https://registry.npmjs.org/@types/prosemirror-state/-/prosemirror-state-1.2.4.tgz",
-            "integrity": "sha512-Gch4THfZ9QNsRQ7myibU8cG99F3b8/3Gto083ZuutNG72E0VmS8yfQzA5ahbndr5GUIbmKyOD5LqKTBvx/M0qw==",
-            "dev": true,
-            "dependencies": {
-                "@types/prosemirror-model": "*",
-                "@types/prosemirror-transform": "*",
-                "@types/prosemirror-view": "*"
-            }
-        },
-        "node_modules/@types/prosemirror-transform": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/@types/prosemirror-transform/-/prosemirror-transform-1.1.1.tgz",
-            "integrity": "sha512-yYCYSoiRH+Wcbl8GJc0PFCzeyMzNQ1vL2xrHHSXZuNcIlH75VoiKrZFeZ6BS9cl8mYXjZrlmdBe8YOxYvyKM6A==",
-            "dev": true,
-            "dependencies": {
-                "@types/prosemirror-model": "*"
-            }
-        },
-        "node_modules/@types/prosemirror-view": {
-            "version": "1.11.4",
-            "resolved": "https://registry.npmjs.org/@types/prosemirror-view/-/prosemirror-view-1.11.4.tgz",
-            "integrity": "sha512-Hh8v2tpCEMaIesQuw7Y7Pz6imoC1T/bR5OlNGVtp944PZvctXiBvFRkQIb0YvZpt7vVkFzeq2kmR+7mnUfvWiw==",
-            "dev": true,
-            "dependencies": {
-                "@types/prosemirror-model": "*",
-                "@types/prosemirror-state": "*",
-                "@types/prosemirror-transform": "*"
-            }
-        },
-        "node_modules/@types/qs": {
-            "version": "6.9.1",
-            "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.1.tgz",
-            "integrity": "sha512-lhbQXx9HKZAPgBkISrBcmAcMpZsmpe/Cd/hY7LGZS5OfkySUBItnPZHgQPssWYUET8elF+yCFBbP1Q0RZPTdaw=="
-        },
-        "node_modules/@types/range-parser": {
-            "version": "1.2.3",
-            "resolved": "https://registry.npmjs.org/@types/range-parser/-/range-parser-1.2.3.tgz",
-            "integrity": "sha512-ewFXqrQHlFsgc09MK5jP5iR7vumV/BYayNC6PgJO2LPe8vrnNFyjQjSppfEngITi0qvfKtzFvgKymGheFM9UOA=="
-        },
-        "node_modules/@types/rc-switch": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@types/rc-switch/-/rc-switch-1.9.0.tgz",
-            "integrity": "sha512-L3ZQ2/1GAaiKuQTMO/2sRdhnNNVtnnvdE0ZOL3/+v54j5LguOvYqTSOHPk9nLPi5va3pdRN1MTce3JkJvGZ65A==",
-            "dev": true,
-            "dependencies": {
-                "@types/react": "*"
-            }
-        },
-        "node_modules/@types/react": {
-            "version": "16.9.41",
-            "resolved": "https://registry.npmjs.org/@types/react/-/react-16.9.41.tgz",
-            "integrity": "sha512-6cFei7F7L4wwuM+IND/Q2cV1koQUvJ8iSV+Gwn0c3kvABZ691g7sp3hfEQHOUBJtccl1gPi+EyNjMIl9nGA0ug==",
-            "dependencies": {
-                "@types/prop-types": "*",
-                "csstype": "^2.2.0"
-            }
-        },
-        "node_modules/@types/react-autosuggest": {
-            "version": "9.3.14",
-            "resolved": "https://registry.npmjs.org/@types/react-autosuggest/-/react-autosuggest-9.3.14.tgz",
-            "integrity": "sha512-cvGpKaQaNsFbDxTwP56VKVj2FO6SpJ9PsrQtlVzN7aVa/SsMZoQrBLEUx5HQKfIS4Zupb6K4tHmIyTjF7AEcow==",
-            "dev": true,
-            "dependencies": {
-                "@types/react": "*"
-            }
-        },
-        "node_modules/@types/react-color": {
-            "version": "2.17.4",
-            "resolved": "https://registry.npmjs.org/@types/react-color/-/react-color-2.17.4.tgz",
-            "integrity": "sha512-pAO3+7uHoESg5QMqjnGjw9F7sALjEZsaU41yGiUZbmHiJMoSXH1UklFJ1bZkwhYskaJgiY+AS6wirl17yBh5GA==",
-            "dev": true,
-            "dependencies": {
-                "@types/react": "*",
-                "@types/reactcss": "*"
-            }
-        },
-        "node_modules/@types/react-datepicker": {
-            "version": "3.0.2",
-            "resolved": "https://registry.npmjs.org/@types/react-datepicker/-/react-datepicker-3.0.2.tgz",
-            "integrity": "sha512-xW04NZRF+9ZnzOD3XrlIzBEKgUsN6LVgZJJsXH8NIUlVjyPh+sdtLPfVoDp+GQzGq1M0TuMLNZsv0sJ3N9XwDA==",
-            "dev": true,
-            "dependencies": {
-                "@types/react": "*",
-                "date-fns": "^2.0.1",
-                "popper.js": "^1.14.1"
-            }
-        },
-        "node_modules/@types/react-dom": {
-            "version": "16.9.8",
-            "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-16.9.8.tgz",
-            "integrity": "sha512-ykkPQ+5nFknnlU6lDd947WbQ6TE3NNzbQAkInC2EKY1qeYdTKp7onFusmYZb+ityzx2YviqT6BXSu+LyWWJwcA==",
-            "dev": true,
-            "dependencies": {
-                "@types/react": "*"
-            }
-        },
-        "node_modules/@types/react-grid-layout": {
-            "version": "0.17.1",
-            "resolved": "https://registry.npmjs.org/@types/react-grid-layout/-/react-grid-layout-0.17.1.tgz",
-            "integrity": "sha512-1ssQjX3X2A89jx94jECJ0Ze2EHFRYlBHjRh2pnlwjJj1WaEijXUNvwKnUzKwgNFnyZ91Pzqu9Z3V7Atzi9ge7A==",
-            "dev": true,
-            "dependencies": {
-                "@types/react": "*"
-            }
-        },
-        "node_modules/@types/react-measure": {
-            "version": "2.0.6",
-            "resolved": "https://registry.npmjs.org/@types/react-measure/-/react-measure-2.0.6.tgz",
-            "integrity": "sha512-FxAwgDVKvxm4SPXu24x9cwzsty8x33UueazHcpxM1UWZlGJI57yIHM2djE3xUJhYVxuzNzi4E8UL3kmCkdh+4A==",
-            "dev": true,
-            "dependencies": {
-                "@types/react": "*"
-            }
-        },
-        "node_modules/@types/react-reconciler": {
-            "version": "0.26.1",
-            "resolved": "https://registry.npmjs.org/@types/react-reconciler/-/react-reconciler-0.26.1.tgz",
-            "integrity": "sha512-jeizEH5o/k6tv42RYNbaulR9KvoSM4RAUq1Q2SXd2HZ7dqgTxN9OIf+GU/sErT7CohB/mUxy9hSjaRLiCPGF5w==",
-            "dependencies": {
-                "@types/react": "*"
-            }
-        },
-        "node_modules/@types/react-select": {
-            "version": "3.0.13",
-            "resolved": "https://registry.npmjs.org/@types/react-select/-/react-select-3.0.13.tgz",
-            "integrity": "sha512-JxmSArGgzAOtb37+Jz2+3av8rVmp/3s3DGwlcP+g59/a3owkiuuU4/Jajd+qA32beDPHy4gJR2kkxagPY3j9kg==",
-            "dev": true,
-            "dependencies": {
-                "@types/react": "*",
-                "@types/react-dom": "*",
-                "@types/react-transition-group": "*"
-            }
-        },
-        "node_modules/@types/react-table": {
-            "version": "6.8.7",
-            "resolved": "https://registry.npmjs.org/@types/react-table/-/react-table-6.8.7.tgz",
-            "integrity": "sha512-1U0xl47jk0BzE+HNHgxZYSLvtybSvnlLhOpW9Mfqf9iuRm/fGqgRab3TKivPCY6Tl7WPFM2hWEJ1GnsuSFc9AQ==",
-            "dependencies": {
-                "@types/react": "*"
-            }
-        },
-        "node_modules/@types/react-transition-group": {
-            "version": "4.4.0",
-            "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.0.tgz",
-            "integrity": "sha512-/QfLHGpu+2fQOqQaXh8MG9q03bFENooTb/it4jr5kKaZlDQfWvjqWZg48AwzPVMBHlRuTRAY7hRHCEOXz5kV6w==",
-            "dependencies": {
-                "@types/react": "*"
-            }
-        },
-        "node_modules/@types/reactcss": {
-            "version": "1.2.3",
-            "resolved": "https://registry.npmjs.org/@types/reactcss/-/reactcss-1.2.3.tgz",
-            "integrity": "sha512-d2gQQ0IL6hXLnoRfVYZukQNWHuVsE75DzFTLPUuyyEhJS8G2VvlE+qfQQ91SJjaMqlURRCNIsX7Jcsw6cEuJlA==",
-            "dev": true,
-            "dependencies": {
-                "@types/react": "*"
-            }
-        },
-        "node_modules/@types/request": {
-            "version": "2.48.5",
-            "resolved": "https://registry.npmjs.org/@types/request/-/request-2.48.5.tgz",
-            "integrity": "sha512-/LO7xRVnL3DxJ1WkPGDQrp4VTV1reX9RkC85mJ+Qzykj2Bdw+mG15aAfDahc76HtknjzE16SX/Yddn6MxVbmGQ==",
-            "dev": true,
-            "dependencies": {
-                "@types/caseless": "*",
-                "@types/node": "*",
-                "@types/tough-cookie": "*",
-                "form-data": "^2.5.0"
-            }
-        },
-        "node_modules/@types/request-promise": {
-            "version": "4.1.46",
-            "resolved": "https://registry.npmjs.org/@types/request-promise/-/request-promise-4.1.46.tgz",
-            "integrity": "sha512-3Thpj2Va5m0ji3spaCk8YKrjkZyZc6RqUVOphA0n/Xet66AW/AiOAs5vfXhQIL5NmkaO7Jnun7Nl9NEjJ2zBaw==",
-            "dev": true,
-            "dependencies": {
-                "@types/bluebird": "*",
-                "@types/request": "*"
-            }
-        },
-        "node_modules/@types/reveal": {
-            "version": "3.3.33",
-            "resolved": "https://registry.npmjs.org/@types/reveal/-/reveal-3.3.33.tgz",
-            "integrity": "sha512-lKbezA9Oa5LfdSRwFDc/FHEGH4+FjiXh/a/PCSZAmN+KCeQJL/3ClOdAQwOxt3zdHc8XyioT+cNvIOletwRI7A=="
-        },
-        "node_modules/@types/rimraf": {
-            "version": "2.0.4",
-            "resolved": "https://registry.npmjs.org/@types/rimraf/-/rimraf-2.0.4.tgz",
-            "integrity": "sha512-8gBudvllD2A/c0CcEX/BivIDorHFt5UI5m46TsNj8DjWCCTTZT74kEe4g+QsY7P/B9WdO98d82zZgXO/RQzu2Q==",
-            "dev": true,
-            "dependencies": {
-                "@types/glob": "*",
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/serve-static": {
-            "version": "1.13.3",
-            "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.13.3.tgz",
-            "integrity": "sha512-oprSwp094zOglVrXdlo/4bAHtKTAxX6VT8FOZlBKrmyLbNvE1zxZyJ6yikMVtHIvwP45+ZQGJn+FdXGKTozq0g==",
-            "dependencies": {
-                "@types/express-serve-static-core": "*",
-                "@types/mime": "*"
-            }
-        },
-        "node_modules/@types/sharp": {
-            "version": "0.23.1",
-            "resolved": "https://registry.npmjs.org/@types/sharp/-/sharp-0.23.1.tgz",
-            "integrity": "sha512-iBRM9RjRF9pkIkukk6imlxfaKMRuiRND8L0yYKl5PJu5uLvxuNzp5f0x8aoTG5VX85M8O//BwbttzFVZL1j/FQ==",
-            "dev": true,
-            "dependencies": {
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/shelljs": {
-            "version": "0.8.8",
-            "resolved": "https://registry.npmjs.org/@types/shelljs/-/shelljs-0.8.8.tgz",
-            "integrity": "sha512-lD3LWdg6j8r0VRBFahJVaxoW0SIcswxKaFUrmKl33RJVeeoNYQAz4uqCJ5Z6v4oIBOsC5GozX+I5SorIKiTcQA==",
-            "dev": true,
-            "dependencies": {
-                "@types/glob": "*",
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/sizzle": {
-            "version": "2.3.2",
-            "resolved": "https://registry.npmjs.org/@types/sizzle/-/sizzle-2.3.2.tgz",
-            "integrity": "sha512-7EJYyKTL7tFR8+gDbB6Wwz/arpGa0Mywk1TJbNzKzHtzbwVmY4HR9WqS5VV7dsBUKQmPNr192jHr/VpBluj/hg==",
-            "dev": true
-        },
-        "node_modules/@types/socket.io": {
-            "version": "2.1.8",
-            "resolved": "https://registry.npmjs.org/@types/socket.io/-/socket.io-2.1.8.tgz",
-            "integrity": "sha512-NIQfh9WwJuJKlgmby4NgwMpoBOmNPCDgaRNPiLYZBtkbHkszK/9R52B5yGkd5a34rbVdAADuo8FhOS/5AZDemw==",
-            "dev": true,
-            "dependencies": {
-                "@types/engine.io": "*",
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/socket.io-client": {
-            "version": "1.4.33",
-            "resolved": "https://registry.npmjs.org/@types/socket.io-client/-/socket.io-client-1.4.33.tgz",
-            "integrity": "sha512-m4LnxkljsI9fMsjwpW5QhRpMixo2BeeLpFmg0AE+sS4H1pzAd/cs/ftTiL60FLZgfFa8PFRPx5KsHu8O0bADKQ==",
-            "dev": true
-        },
-        "node_modules/@types/source-list-map": {
-            "version": "0.1.2",
-            "resolved": "https://registry.npmjs.org/@types/source-list-map/-/source-list-map-0.1.2.tgz",
-            "integrity": "sha512-K5K+yml8LTo9bWJI/rECfIPrGgxdpeNbj+d53lwN4QjW1MCwlkhUms+gtdzigTeUyBr09+u8BwOIY3MXvHdcsA==",
-            "dev": true
-        },
-        "node_modules/@types/strip-bom": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/@types/strip-bom/-/strip-bom-3.0.0.tgz",
-            "integrity": "sha1-FKjsOVbC6B7bdSB5CuzyHCkK69I=",
-            "dev": true
-        },
-        "node_modules/@types/strip-json-comments": {
-            "version": "0.0.30",
-            "resolved": "https://registry.npmjs.org/@types/strip-json-comments/-/strip-json-comments-0.0.30.tgz",
-            "integrity": "sha512-7NQmHra/JILCd1QqpSzl8+mJRc8ZHz3uDm8YV1Ks9IhK0epEiTw8aIErbvH9PI+6XbqhyIQy3462nEsn7UVzjQ==",
-            "dev": true
-        },
-        "node_modules/@types/tapable": {
-            "version": "1.0.7",
-            "resolved": "https://registry.npmjs.org/@types/tapable/-/tapable-1.0.7.tgz",
-            "integrity": "sha512-0VBprVqfgFD7Ehb2vd8Lh9TG3jP98gvr8rgehQqzztZNI7o8zS8Ad4jyZneKELphpuE212D8J70LnSNQSyO6bQ==",
-            "dev": true
-        },
-        "node_modules/@types/three": {
-            "version": "0.126.2",
-            "resolved": "https://registry.npmjs.org/@types/three/-/three-0.126.2.tgz",
-            "integrity": "sha512-6JqTgijtfXcTJik8NtiNxr2L90ex6ElM00qilOGeUcrEsJLOdzLJSIkXHUYS+KPAYQYtRJQKD6XaXds3HjS+gg=="
-        },
-        "node_modules/@types/tough-cookie": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/@types/tough-cookie/-/tough-cookie-4.0.0.tgz",
-            "integrity": "sha512-I99sngh224D0M7XgW1s120zxCt3VYQ3IQsuw3P3jbq5GG4yc79+ZjyKznyOGIQrflfylLgcfekeZW/vk0yng6A==",
-            "dev": true
-        },
-        "node_modules/@types/typescript": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/@types/typescript/-/typescript-2.0.0.tgz",
-            "integrity": "sha1-xDNTnJi64oaCswfqp6D9IRW4PCg=",
-            "dev": true,
-            "dependencies": {
-                "typescript": "*"
-            }
-        },
-        "node_modules/@types/uglify-js": {
-            "version": "3.13.0",
-            "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-3.13.0.tgz",
-            "integrity": "sha512-EGkrJD5Uy+Pg0NUR8uA4bJ5WMfljyad0G+784vLCNUkD+QwOJXUbBYExXfVGf7YtyzdQp3L/XMYcliB987kL5Q==",
-            "dev": true,
-            "dependencies": {
-                "source-map": "^0.6.1"
-            }
-        },
-        "node_modules/@types/uglify-js/node_modules/source-map": {
-            "version": "0.6.1",
-            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/@types/uuid": {
-            "version": "3.4.9",
-            "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-3.4.9.tgz",
-            "integrity": "sha512-XDwyIlt/47l2kWLTzw/mtrpLdB+GPSskR2n/PIcPn+VYhVO77rGhRncIR5GPU0KRzXuqkDO+J5qqrG0Y8P6jzQ==",
-            "dev": true
-        },
-        "node_modules/@types/valid-url": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/@types/valid-url/-/valid-url-1.0.3.tgz",
-            "integrity": "sha512-+33x29mg+ecU88ODdWpqaie2upIuRkhujVLA7TuJjM823cNMbeggfI6NhxewaRaRF8dy+g33e4uIg/m5Mb3xDQ==",
-            "dev": true
-        },
-        "node_modules/@types/webpack": {
-            "version": "4.41.27",
-            "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-4.41.27.tgz",
-            "integrity": "sha512-wK/oi5gcHi72VMTbOaQ70VcDxSQ1uX8S2tukBK9ARuGXrYM/+u4ou73roc7trXDNmCxCoerE8zruQqX/wuHszA==",
-            "dev": true,
-            "dependencies": {
-                "@types/anymatch": "*",
-                "@types/node": "*",
-                "@types/tapable": "^1",
-                "@types/uglify-js": "*",
-                "@types/webpack-sources": "*",
-                "source-map": "^0.6.0"
-            }
-        },
-        "node_modules/@types/webpack-dev-middleware": {
-            "version": "2.0.7",
-            "resolved": "https://registry.npmjs.org/@types/webpack-dev-middleware/-/webpack-dev-middleware-2.0.7.tgz",
-            "integrity": "sha512-pArv7YnqpbSCOBWiRlR1KgqVorlzkIiwto66hI8Gdgp5ATQAC+Ug4QVz69ZI1dP+D5Rs8QWnbT81tE4tcMuTag==",
-            "dev": true,
-            "dependencies": {
-                "@types/connect": "*",
-                "@types/memory-fs": "*",
-                "@types/webpack": "^4",
-                "loglevel": "^1.6.2"
-            }
-        },
-        "node_modules/@types/webpack-hot-middleware": {
-            "version": "2.25.4",
-            "resolved": "https://registry.npmjs.org/@types/webpack-hot-middleware/-/webpack-hot-middleware-2.25.4.tgz",
-            "integrity": "sha512-6tQb9EBKIANZYUVLQYWiWfDFVe7FhXSj4bB2EF5QB7VtYWL3HDR+y/zqjZPAnCorv0spLqVMRqjRK8AmhfocMw==",
-            "dev": true,
-            "dependencies": {
-                "@types/connect": "*",
-                "@types/webpack": "^4"
-            }
-        },
-        "node_modules/@types/webpack-sources": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/@types/webpack-sources/-/webpack-sources-2.1.0.tgz",
-            "integrity": "sha512-LXn/oYIpBeucgP1EIJbKQ2/4ZmpvRl+dlrFdX7+94SKRUV3Evy3FsfMZY318vGhkWUS5MPhtOM3w1/hCOAOXcg==",
-            "dev": true,
-            "dependencies": {
-                "@types/node": "*",
-                "@types/source-list-map": "*",
-                "source-map": "^0.7.3"
-            }
-        },
-        "node_modules/@types/webpack-sources/node_modules/source-map": {
-            "version": "0.7.3",
-            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.3.tgz",
-            "integrity": "sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==",
-            "dev": true,
-            "engines": {
-                "node": ">= 8"
-            }
-        },
-        "node_modules/@types/webpack/node_modules/source-map": {
-            "version": "0.6.1",
-            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/@types/webscopeio__react-textarea-autocomplete": {
-            "version": "4.6.1",
-            "resolved": "https://registry.npmjs.org/@types/webscopeio__react-textarea-autocomplete/-/webscopeio__react-textarea-autocomplete-4.6.1.tgz",
-            "integrity": "sha512-rdiDMsTbyFJRbC2BYKIgiAFG/SFkaDGYQYfzo3U2T+EjMCE0JZ8IHZ9nZrJ2Tm83Blrj66cnaEc0H3iwwRqQMA==",
-            "dependencies": {
-                "@types/react": "*"
-            }
-        },
-        "node_modules/@types/xregexp": {
-            "version": "4.3.0",
-            "resolved": "https://registry.npmjs.org/@types/xregexp/-/xregexp-4.3.0.tgz",
-            "integrity": "sha512-3gJTS9gt27pS7U9q5IVqo4YvKSlkf2ck8ish6etuDj6LIRxkL/2Y8RMUtK/QzvE1Yv2zwWV5yemI2BS0GGGFnA==",
-            "dev": true
-        },
-        "node_modules/@types/yauzl": {
-            "version": "2.9.1",
-            "resolved": "https://registry.npmjs.org/@types/yauzl/-/yauzl-2.9.1.tgz",
-            "integrity": "sha512-A1b8SU4D10uoPjwb0lnHmmu8wZhR9d+9o2PKBQT2jU5YPTKsxac6M2qGAdY7VcL+dHHhARVUDmeg0rOrcd9EjA==",
-            "optional": true,
-            "dependencies": {
-                "@types/node": "*"
-            }
-        },
-        "node_modules/@types/youtube": {
-            "version": "0.0.39",
-            "resolved": "https://registry.npmjs.org/@types/youtube/-/youtube-0.0.39.tgz",
-            "integrity": "sha512-naVjyTZT/CoNwEQW3+mf9E/x6sgB7QIPbRDtVlPUpHlmuQTk+j6gQBy0T5CRkV8oC0GYQjMgfr3VdueTSVLTjw==",
-            "dev": true
-        },
-        "node_modules/@webassemblyjs/ast": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.9.0.tgz",
-            "integrity": "sha512-C6wW5L+b7ogSDVqymbkkvuW9kruN//YisMED04xzeBBqjHa2FYnmvOlS6Xj68xWQRgWvI9cIglsjFowH/RJyEA==",
-            "dev": true,
-            "dependencies": {
-                "@webassemblyjs/helper-module-context": "1.9.0",
-                "@webassemblyjs/helper-wasm-bytecode": "1.9.0",
-                "@webassemblyjs/wast-parser": "1.9.0"
-            }
-        },
-        "node_modules/@webassemblyjs/floating-point-hex-parser": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.9.0.tgz",
-            "integrity": "sha512-TG5qcFsS8QB4g4MhrxK5TqfdNe7Ey/7YL/xN+36rRjl/BlGE/NcBvJcqsRgCP6Z92mRE+7N50pRIi8SmKUbcQA==",
-            "dev": true
-        },
-        "node_modules/@webassemblyjs/helper-api-error": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-api-error/-/helper-api-error-1.9.0.tgz",
-            "integrity": "sha512-NcMLjoFMXpsASZFxJ5h2HZRcEhDkvnNFOAKneP5RbKRzaWJN36NC4jqQHKwStIhGXu5mUWlUUk7ygdtrO8lbmw==",
-            "dev": true
-        },
-        "node_modules/@webassemblyjs/helper-buffer": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-buffer/-/helper-buffer-1.9.0.tgz",
-            "integrity": "sha512-qZol43oqhq6yBPx7YM3m9Bv7WMV9Eevj6kMi6InKOuZxhw+q9hOkvq5e/PpKSiLfyetpaBnogSbNCfBwyB00CA==",
-            "dev": true
-        },
-        "node_modules/@webassemblyjs/helper-code-frame": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-code-frame/-/helper-code-frame-1.9.0.tgz",
-            "integrity": "sha512-ERCYdJBkD9Vu4vtjUYe8LZruWuNIToYq/ME22igL+2vj2dQ2OOujIZr3MEFvfEaqKoVqpsFKAGsRdBSBjrIvZA==",
-            "dev": true,
-            "dependencies": {
-                "@webassemblyjs/wast-printer": "1.9.0"
-            }
-        },
-        "node_modules/@webassemblyjs/helper-fsm": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-fsm/-/helper-fsm-1.9.0.tgz",
-            "integrity": "sha512-OPRowhGbshCb5PxJ8LocpdX9Kl0uB4XsAjl6jH/dWKlk/mzsANvhwbiULsaiqT5GZGT9qinTICdj6PLuM5gslw==",
-            "dev": true
-        },
-        "node_modules/@webassemblyjs/helper-module-context": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-module-context/-/helper-module-context-1.9.0.tgz",
-            "integrity": "sha512-MJCW8iGC08tMk2enck1aPW+BE5Cw8/7ph/VGZxwyvGbJwjktKkDK7vy7gAmMDx88D7mhDTCNKAW5tED+gZ0W8g==",
-            "dev": true,
-            "dependencies": {
-                "@webassemblyjs/ast": "1.9.0"
-            }
-        },
-        "node_modules/@webassemblyjs/helper-wasm-bytecode": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.9.0.tgz",
-            "integrity": "sha512-R7FStIzyNcd7xKxCZH5lE0Bqy+hGTwS3LJjuv1ZVxd9O7eHCedSdrId/hMOd20I+v8wDXEn+bjfKDLzTepoaUw==",
-            "dev": true
-        },
-        "node_modules/@webassemblyjs/helper-wasm-section": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.9.0.tgz",
-            "integrity": "sha512-XnMB8l3ek4tvrKUUku+IVaXNHz2YsJyOOmz+MMkZvh8h1uSJpSen6vYnw3IoQ7WwEuAhL8Efjms1ZWjqh2agvw==",
-            "dev": true,
-            "dependencies": {
-                "@webassemblyjs/ast": "1.9.0",
-                "@webassemblyjs/helper-buffer": "1.9.0",
-                "@webassemblyjs/helper-wasm-bytecode": "1.9.0",
-                "@webassemblyjs/wasm-gen": "1.9.0"
-            }
-        },
-        "node_modules/@webassemblyjs/ieee754": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/ieee754/-/ieee754-1.9.0.tgz",
-            "integrity": "sha512-dcX8JuYU/gvymzIHc9DgxTzUUTLexWwt8uCTWP3otys596io0L5aW02Gb1RjYpx2+0Jus1h4ZFqjla7umFniTg==",
-            "dev": true,
-            "dependencies": {
-                "@xtuc/ieee754": "^1.2.0"
-            }
-        },
-        "node_modules/@webassemblyjs/leb128": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/leb128/-/leb128-1.9.0.tgz",
-            "integrity": "sha512-ENVzM5VwV1ojs9jam6vPys97B/S65YQtv/aanqnU7D8aSoHFX8GyhGg0CMfyKNIHBuAVjy3tlzd5QMMINa7wpw==",
-            "dev": true,
-            "dependencies": {
-                "@xtuc/long": "4.2.2"
-            }
-        },
-        "node_modules/@webassemblyjs/utf8": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/utf8/-/utf8-1.9.0.tgz",
-            "integrity": "sha512-GZbQlWtopBTP0u7cHrEx+73yZKrQoBMpwkGEIqlacljhXCkVM1kMQge/Mf+csMJAjEdSwhOyLAS0AoR3AG5P8w==",
-            "dev": true
-        },
-        "node_modules/@webassemblyjs/wasm-edit": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-edit/-/wasm-edit-1.9.0.tgz",
-            "integrity": "sha512-FgHzBm80uwz5M8WKnMTn6j/sVbqilPdQXTWraSjBwFXSYGirpkSWE2R9Qvz9tNiTKQvoKILpCuTjBKzOIm0nxw==",
-            "dev": true,
-            "dependencies": {
-                "@webassemblyjs/ast": "1.9.0",
-                "@webassemblyjs/helper-buffer": "1.9.0",
-                "@webassemblyjs/helper-wasm-bytecode": "1.9.0",
-                "@webassemblyjs/helper-wasm-section": "1.9.0",
-                "@webassemblyjs/wasm-gen": "1.9.0",
-                "@webassemblyjs/wasm-opt": "1.9.0",
-                "@webassemblyjs/wasm-parser": "1.9.0",
-                "@webassemblyjs/wast-printer": "1.9.0"
-            }
-        },
-        "node_modules/@webassemblyjs/wasm-gen": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-gen/-/wasm-gen-1.9.0.tgz",
-            "integrity": "sha512-cPE3o44YzOOHvlsb4+E9qSqjc9Qf9Na1OO/BHFy4OI91XDE14MjFN4lTMezzaIWdPqHnsTodGGNP+iRSYfGkjA==",
-            "dev": true,
-            "dependencies": {
-                "@webassemblyjs/ast": "1.9.0",
-                "@webassemblyjs/helper-wasm-bytecode": "1.9.0",
-                "@webassemblyjs/ieee754": "1.9.0",
-                "@webassemblyjs/leb128": "1.9.0",
-                "@webassemblyjs/utf8": "1.9.0"
-            }
-        },
-        "node_modules/@webassemblyjs/wasm-opt": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-opt/-/wasm-opt-1.9.0.tgz",
-            "integrity": "sha512-Qkjgm6Anhm+OMbIL0iokO7meajkzQD71ioelnfPEj6r4eOFuqm4YC3VBPqXjFyyNwowzbMD+hizmprP/Fwkl2A==",
-            "dev": true,
-            "dependencies": {
-                "@webassemblyjs/ast": "1.9.0",
-                "@webassemblyjs/helper-buffer": "1.9.0",
-                "@webassemblyjs/wasm-gen": "1.9.0",
-                "@webassemblyjs/wasm-parser": "1.9.0"
-            }
-        },
-        "node_modules/@webassemblyjs/wasm-parser": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-parser/-/wasm-parser-1.9.0.tgz",
-            "integrity": "sha512-9+wkMowR2AmdSWQzsPEjFU7njh8HTO5MqO8vjwEHuM+AMHioNqSBONRdr0NQQ3dVQrzp0s8lTcYqzUdb7YgELA==",
-            "dev": true,
-            "dependencies": {
-                "@webassemblyjs/ast": "1.9.0",
-                "@webassemblyjs/helper-api-error": "1.9.0",
-                "@webassemblyjs/helper-wasm-bytecode": "1.9.0",
-                "@webassemblyjs/ieee754": "1.9.0",
-                "@webassemblyjs/leb128": "1.9.0",
-                "@webassemblyjs/utf8": "1.9.0"
-            }
-        },
-        "node_modules/@webassemblyjs/wast-parser": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/wast-parser/-/wast-parser-1.9.0.tgz",
-            "integrity": "sha512-qsqSAP3QQ3LyZjNC/0jBJ/ToSxfYJ8kYyuiGvtn/8MK89VrNEfwj7BPQzJVHi0jGTRK2dGdJ5PRqhtjzoww+bw==",
-            "dev": true,
-            "dependencies": {
-                "@webassemblyjs/ast": "1.9.0",
-                "@webassemblyjs/floating-point-hex-parser": "1.9.0",
-                "@webassemblyjs/helper-api-error": "1.9.0",
-                "@webassemblyjs/helper-code-frame": "1.9.0",
-                "@webassemblyjs/helper-fsm": "1.9.0",
-                "@xtuc/long": "4.2.2"
-            }
-        },
-        "node_modules/@webassemblyjs/wast-printer": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/@webassemblyjs/wast-printer/-/wast-printer-1.9.0.tgz",
-            "integrity": "sha512-2J0nE95rHXHyQ24cWjMKJ1tqB/ds8z/cyeOZxJhcb+rW+SQASVjuznUSmdz5GpVJTzU8JkhYut0D3siFDD6wsA==",
-            "dev": true,
-            "dependencies": {
-                "@webassemblyjs/ast": "1.9.0",
-                "@webassemblyjs/wast-parser": "1.9.0",
-                "@xtuc/long": "4.2.2"
-            }
-        },
-        "node_modules/@webscopeio/react-textarea-autocomplete": {
-            "version": "4.7.0",
-            "resolved": "https://registry.npmjs.org/@webscopeio/react-textarea-autocomplete/-/react-textarea-autocomplete-4.7.0.tgz",
-            "integrity": "sha512-uzH7PUlXQk6jCTh1eGZdXjvjxveZpznhQywX5I5ojsXgre+XSzlK66chdDdfi+lQABC3N3TzfSq6Hlxa8hlrLA==",
-            "dependencies": {
-                "custom-event": "^1.0.1",
-                "textarea-caret": "3.0.2"
-            }
-        },
-        "node_modules/@webscopeio/react-textarea-autocomplete/node_modules/textarea-caret": {
-            "version": "3.0.2",
-            "resolved": "https://registry.npmjs.org/textarea-caret/-/textarea-caret-3.0.2.tgz",
-            "integrity": "sha1-82DEhpmqGr9xhoCkOjGoUGZcLK8="
-        },
-        "node_modules/@xtuc/ieee754": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
-            "integrity": "sha512-DX8nKgqcGwsc0eJSqYt5lwP4DH5FlHnmuWWBRy7X0NcaGR0ZtuyeESgMwTYVEtxmsNGY+qit4QYT/MIYTOTPeA==",
-            "dev": true
-        },
-        "node_modules/@xtuc/long": {
-            "version": "4.2.2",
-            "resolved": "https://registry.npmjs.org/@xtuc/long/-/long-4.2.2.tgz",
-            "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==",
-            "dev": true
-        },
-        "node_modules/abab": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.3.tgz",
-            "integrity": "sha512-tsFzPpcttalNjFBCFMqsKYQcWxxen1pgJR56by//QwvJc4/OUS3kPOOttx2tSIfjsylB0pYu7f5D3K1RCxUnUg==",
-            "dev": true
-        },
-        "node_modules/abbrev": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
-            "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q=="
-        },
-        "node_modules/abort-controller": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/abort-controller/-/abort-controller-3.0.0.tgz",
-            "integrity": "sha512-h8lQ8tacZYnR3vNQTgibj+tODHI5/+l06Au2Pcriv/Gmet0eaj4TwWH41sO9wnHDiQsEj19q0drzdWdeAHtweg==",
-            "dependencies": {
-                "event-target-shim": "^5.0.0"
-            },
-            "engines": {
-                "node": ">=6.5"
-            }
-        },
-        "node_modules/accepts": {
-            "version": "1.3.7",
-            "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.7.tgz",
-            "integrity": "sha512-Il80Qs2WjYlJIBNzNkK6KYqlVMTbZLXgHx2oT0pU/fjRHyEp+PEfEPY0R3WCwAGVOtauxh1hOxNgIf5bv7dQpA==",
-            "dependencies": {
-                "mime-types": "~2.1.24",
-                "negotiator": "0.6.2"
-            },
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/acorn": {
-            "version": "3.3.0",
-            "resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz",
-            "integrity": "sha1-ReN/s56No/JbruP/U2niu18iAXo=",
-            "bin": {
-                "acorn": "bin/acorn"
-            },
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/acorn-globals": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-3.1.0.tgz",
-            "integrity": "sha1-/YJw9x+7SZawBPqIDuXUZXOnMb8=",
-            "dependencies": {
-                "acorn": "^4.0.4"
-            }
-        },
-        "node_modules/acorn-globals/node_modules/acorn": {
-            "version": "4.0.13",
-            "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
-            "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c=",
-            "bin": {
-                "acorn": "bin/acorn"
-            },
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/acorn-jsx": {
-            "version": "5.2.0",
-            "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.2.0.tgz",
-            "integrity": "sha512-HiUX/+K2YpkpJ+SzBffkM/AQ2YE03S0U1kjTLVpoJdhZMOWy8qvXVN9JdLqv2QsaQ6MPYQIuNmwD8zOiYUofLQ=="
-        },
-        "node_modules/acorn-walk": {
-            "version": "6.2.0",
-            "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-6.2.0.tgz",
-            "integrity": "sha512-7evsyfH1cLOCdAzZAd43Cic04yKydNx0cF+7tiA19p1XnLLPU4dpCQOqpjqwokFe//vS0QqfqqjCS2JkiIs0cA==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/adm-zip": {
-            "version": "0.4.16",
-            "resolved": "https://registry.npmjs.org/adm-zip/-/adm-zip-0.4.16.tgz",
-            "integrity": "sha512-TFi4HBKSGfIKsK5YCkKaaFG2m4PEDyViZmEwof3MTIgzimHLto6muaHVpbrljdIvIrFZzEq/p4nafOeLcYegrg==",
-            "engines": {
-                "node": ">=0.3.0"
-            }
-        },
-        "node_modules/after": {
-            "version": "0.8.2",
-            "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz",
-            "integrity": "sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8="
-        },
-        "node_modules/agent-base": {
-            "version": "6.0.0",
-            "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.0.tgz",
-            "integrity": "sha512-j1Q7cSCqN+AwrmDd+pzgqc0/NpC655x2bUf5ZjRIO77DcNBFmh+OgRNzF6OKdCC9RSCb19fGd99+bhXFdkRNqw==",
-            "dependencies": {
-                "debug": "4"
-            },
-            "engines": {
-                "node": ">= 6.0.0"
-            }
-        },
-        "node_modules/agent-base/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/ajv": {
-            "version": "6.12.2",
-            "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.2.tgz",
-            "integrity": "sha512-k+V+hzjm5q/Mr8ef/1Y9goCmlsK4I6Sm74teeyGvFk1XrOsbsKLjEdrvny42CZ+a8sXbk8KWpY/bDwS+FLL2UQ==",
-            "dependencies": {
-                "fast-deep-equal": "^3.1.1",
-                "fast-json-stable-stringify": "^2.0.0",
-                "json-schema-traverse": "^0.4.1",
-                "uri-js": "^4.2.2"
-            }
-        },
-        "node_modules/ajv-errors": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/ajv-errors/-/ajv-errors-1.0.1.tgz",
-            "integrity": "sha512-DCRfO/4nQ+89p/RK43i8Ezd41EqdGIU4ld7nGF8OQ14oc/we5rEntLCUa7+jrn3nn83BosfwZA0wb4pon2o8iQ=="
-        },
-        "node_modules/ajv-keywords": {
-            "version": "3.4.1",
-            "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.4.1.tgz",
-            "integrity": "sha512-RO1ibKvd27e6FEShVFfPALuHI3WjSVNeK5FIsmme/LYRNxjKuNj+Dt7bucLa6NdSv3JcVTyMlm9kGR84z1XpaQ=="
-        },
-        "node_modules/align-text": {
-            "version": "0.1.4",
-            "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz",
-            "integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc=",
-            "dependencies": {
-                "kind-of": "^3.0.2",
-                "longest": "^1.0.1",
-                "repeat-string": "^1.5.2"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/align-text/node_modules/is-buffer": {
-            "version": "1.1.6",
-            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
-            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
-        },
-        "node_modules/align-text/node_modules/kind-of": {
-            "version": "3.2.2",
-            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-            "dependencies": {
-                "is-buffer": "^1.1.5"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/amdefine": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
-            "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU=",
-            "engines": {
-                "node": ">=0.4.2"
-            }
-        },
-        "node_modules/ansi-align": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz",
-            "integrity": "sha1-w2rsy6VjuJzrVW82kPCx2eNUf38=",
-            "dependencies": {
-                "string-width": "^2.0.0"
-            }
-        },
-        "node_modules/ansi-colors": {
-            "version": "3.2.3",
-            "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-3.2.3.tgz",
-            "integrity": "sha512-LEHHyuhlPY3TmuUYMh2oz89lTShfvgbmzaBcxve9t/9Wuy7Dwf4yoAKcND7KFT1HAQfqZ12qtc+DUrBMeKF9nw==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/ansi-escape-sequences": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/ansi-escape-sequences/-/ansi-escape-sequences-4.1.0.tgz",
-            "integrity": "sha512-dzW9kHxH011uBsidTXd14JXgzye/YLb2LzeKZ4bsgl/Knwx8AtbSFkkGxagdNOoh0DlqHCmfiEjWKBaqjOanVw==",
-            "dependencies": {
-                "array-back": "^3.0.1"
-            },
-            "engines": {
-                "node": ">=8.0.0"
-            }
-        },
-        "node_modules/ansi-escape-sequences/node_modules/array-back": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/array-back/-/array-back-3.1.0.tgz",
-            "integrity": "sha512-TkuxA4UCOvxuDK6NZYXCalszEzj+TLszyASooky+i742l9TqsOdYCMJJupxRic61hwquNtppB3hgcuq9SVSH1Q==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/ansi-html": {
-            "version": "0.0.7",
-            "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
-            "integrity": "sha1-gTWEAhliqenm/QOflA0S9WynhZ4=",
-            "dev": true,
-            "engines": [
-                "node >= 0.8.0"
-            ],
-            "bin": {
-                "ansi-html": "bin/ansi-html"
-            }
-        },
-        "node_modules/ansi-regex": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
-            "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/ansi-styles": {
-            "version": "3.2.1",
-            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
-            "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
-            "dependencies": {
-                "color-convert": "^1.9.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/any-promise": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz",
-            "integrity": "sha1-q8av7tzqUugJzcA3au0845Y10X8="
-        },
-        "node_modules/anymatch": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-2.0.0.tgz",
-            "integrity": "sha512-5teOsQWABXHHBFP9y3skS5P3d/WfWXpv3FUpy+LorMrNYaT9pI4oLMQX7jzQ2KklNpGpWHzdCXTDT2Y3XGlZBw==",
-            "dependencies": {
-                "micromatch": "^3.1.4",
-                "normalize-path": "^2.1.1"
-            }
-        },
-        "node_modules/anymatch/node_modules/normalize-path": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
-            "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk=",
-            "dependencies": {
-                "remove-trailing-separator": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/aproba": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz",
-            "integrity": "sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw=="
-        },
-        "node_modules/archiver": {
-            "version": "3.1.1",
-            "resolved": "https://registry.npmjs.org/archiver/-/archiver-3.1.1.tgz",
-            "integrity": "sha512-5Hxxcig7gw5Jod/8Gq0OneVgLYET+oNHcxgWItq4TbhOzRLKNAFUb9edAftiMKXvXfCB0vbGrJdZDNq0dWMsxg==",
-            "dependencies": {
-                "archiver-utils": "^2.1.0",
-                "async": "^2.6.3",
-                "buffer-crc32": "^0.2.1",
-                "glob": "^7.1.4",
-                "readable-stream": "^3.4.0",
-                "tar-stream": "^2.1.0",
-                "zip-stream": "^2.1.2"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/archiver-utils": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/archiver-utils/-/archiver-utils-2.1.0.tgz",
-            "integrity": "sha512-bEL/yUb/fNNiNTuUz979Z0Yg5L+LzLxGJz8x79lYmR54fmTIb6ob/hNQgkQnIUDWIFjZVQwl9Xs356I6BAMHfw==",
-            "dependencies": {
-                "glob": "^7.1.4",
-                "graceful-fs": "^4.2.0",
-                "lazystream": "^1.0.0",
-                "lodash.defaults": "^4.2.0",
-                "lodash.difference": "^4.5.0",
-                "lodash.flatten": "^4.4.0",
-                "lodash.isplainobject": "^4.0.6",
-                "lodash.union": "^4.6.0",
-                "normalize-path": "^3.0.0",
-                "readable-stream": "^2.0.0"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/archiver-utils/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/are-we-there-yet": {
-            "version": "1.1.5",
-            "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.5.tgz",
-            "integrity": "sha512-5hYdAkZlcG8tOLujVDTgCT+uPX0VnpAH28gWsLfzpXYm7wP6mp5Q/gYyR7YQ0cKVJcXJnl3j2kpBan13PtQf6w==",
-            "dependencies": {
-                "delegates": "^1.0.0",
-                "readable-stream": "^2.0.6"
-            }
-        },
-        "node_modules/are-we-there-yet/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/arg": {
-            "version": "4.1.3",
-            "resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz",
-            "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==",
-            "dev": true
-        },
-        "node_modules/argparse": {
-            "version": "1.0.10",
-            "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
-            "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
-            "dependencies": {
-                "sprintf-js": "~1.0.2"
-            }
-        },
-        "node_modules/arr-diff": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-4.0.0.tgz",
-            "integrity": "sha1-1kYQdP6/7HHn4VI1dhoyml3HxSA=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/arr-flatten": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.1.0.tgz",
-            "integrity": "sha512-L3hKV5R/p5o81R7O02IGnwpDmkp6E982XhtbuwSe3O4qOtMMMtodicASA1Cny2U+aCXcNpml+m4dPsvsJ3jatg==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/arr-union": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/arr-union/-/arr-union-3.1.0.tgz",
-            "integrity": "sha1-45sJrqne+Gao8gbiiK9jkZuuOcQ=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/array-back": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/array-back/-/array-back-2.0.0.tgz",
-            "integrity": "sha512-eJv4pLLufP3g5kcZry0j6WXpIbzYw9GUB4mVJZno9wfwiBxbizTnHCw3VJb07cBihbFX48Y7oSrW9y+gt4glyw==",
-            "dependencies": {
-                "typical": "^2.6.1"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/array-batcher": {
-            "version": "1.2.3",
-            "resolved": "https://registry.npmjs.org/array-batcher/-/array-batcher-1.2.3.tgz",
-            "integrity": "sha512-/IOrwn4ZJi7YqTZrs3k+wQN5nKhjtTqL5ZKkzB+sKJlPeJzpMnRc3o8T9yt8/ZJiSldd+PwTHjM+//UsaszOOw==",
-            "dependencies": {
-                "@types/node": "^12.7.5",
-                "chai": "^4.2.0",
-                "mocha": "^6.2.0",
-                "request": "^2.88.0",
-                "request-promise": "^4.2.4"
-            }
-        },
-        "node_modules/array-batcher/node_modules/@types/node": {
-            "version": "12.12.37",
-            "resolved": "https://registry.npmjs.org/@types/node/-/node-12.12.37.tgz",
-            "integrity": "sha512-4mXKoDptrXAwZErQHrLzpe0FN/0Wmf5JRniSVIdwUrtDf9wnmEV1teCNLBo/TwuXhkK/bVegoEn/wmb+x0AuPg=="
-        },
-        "node_modules/array-batcher/node_modules/glob": {
-            "version": "7.1.3",
-            "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.3.tgz",
-            "integrity": "sha512-vcfuiIxogLV4DlGBHIUOwI0IbrJ8HWPc4MU7HzviGeNho/UJDfi6B5p3sHeWIQ0KGIU0Jpxi5ZHxemQfLkkAwQ==",
-            "dependencies": {
-                "fs.realpath": "^1.0.0",
-                "inflight": "^1.0.4",
-                "inherits": "2",
-                "minimatch": "^3.0.4",
-                "once": "^1.3.0",
-                "path-is-absolute": "^1.0.0"
-            },
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/array-batcher/node_modules/mocha": {
-            "version": "6.2.3",
-            "resolved": "https://registry.npmjs.org/mocha/-/mocha-6.2.3.tgz",
-            "integrity": "sha512-0R/3FvjIGH3eEuG17ccFPk117XL2rWxatr81a57D+r/x2uTYZRbdZ4oVidEUMh2W2TJDa7MdAb12Lm2/qrKajg==",
-            "dependencies": {
-                "ansi-colors": "3.2.3",
-                "browser-stdout": "1.3.1",
-                "debug": "3.2.6",
-                "diff": "3.5.0",
-                "escape-string-regexp": "1.0.5",
-                "find-up": "3.0.0",
-                "glob": "7.1.3",
-                "growl": "1.10.5",
-                "he": "1.2.0",
-                "js-yaml": "3.13.1",
-                "log-symbols": "2.2.0",
-                "minimatch": "3.0.4",
-                "mkdirp": "0.5.4",
-                "ms": "2.1.1",
-                "node-environment-flags": "1.0.5",
-                "object.assign": "4.1.0",
-                "strip-json-comments": "2.0.1",
-                "supports-color": "6.0.0",
-                "which": "1.3.1",
-                "wide-align": "1.1.3",
-                "yargs": "13.3.2",
-                "yargs-parser": "13.1.2",
-                "yargs-unparser": "1.6.0"
-            },
-            "bin": {
-                "_mocha": "bin/_mocha",
-                "mocha": "bin/mocha"
-            },
-            "engines": {
-                "node": ">= 6.0.0"
-            }
-        },
-        "node_modules/array-batcher/node_modules/supports-color": {
-            "version": "6.0.0",
-            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.0.0.tgz",
-            "integrity": "sha512-on9Kwidc1IUQo+bQdhi8+Tijpo0e1SS6RoGo2guUwn5vdaxw8RXOF9Vb2ws+ihWOmh4JnCJOvaziZWP1VABaLg==",
-            "dependencies": {
-                "has-flag": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/array-equal": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
-            "integrity": "sha1-jCpe8kcv2ep0KwTHenUJO6J1fJM=",
-            "dev": true
-        },
-        "node_modules/array-find-index": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz",
-            "integrity": "sha1-3wEKoSh+Fku9pvlyOwqWoexBh6E=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/array-flatten": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
-            "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
-        },
-        "node_modules/array-union": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
-            "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk=",
-            "dev": true,
-            "dependencies": {
-                "array-uniq": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/array-uniq": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
-            "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/array-unique": {
-            "version": "0.3.2",
-            "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
-            "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/arraybuffer.slice": {
-            "version": "0.0.7",
-            "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.7.tgz",
-            "integrity": "sha512-wGUIVQXuehL5TCqQun8OW81jGzAWycqzFF8lFp+GOM5BXLYj3bKNsYC4daB7n6XjCqxQA/qgTJ+8ANR3acjrog=="
-        },
-        "node_modules/arrify": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/arrify/-/arrify-2.0.1.tgz",
-            "integrity": "sha512-3duEwti880xqi4eAMN8AyR4a0ByT90zoYdLlevfrvU43vb0YZwZVfxOgxWrLXXXpyugL0hNZc9G6BiB5B3nUug==",
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/asap": {
-            "version": "2.0.6",
-            "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
-            "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
-        },
-        "node_modules/asn1": {
-            "version": "0.2.4",
-            "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.4.tgz",
-            "integrity": "sha512-jxwzQpLQjSmWXgwaCZE9Nz+glAG01yF1QnWgbhGwHI5A6FRIEY6IVqtHhIepHqI7/kyEyQEagBC5mBEFlIYvdg==",
-            "dependencies": {
-                "safer-buffer": "~2.1.0"
-            }
-        },
-        "node_modules/asn1.js": {
-            "version": "5.4.1",
-            "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-5.4.1.tgz",
-            "integrity": "sha512-+I//4cYPccV8LdmBLiX8CYvf9Sp3vQsrqu2QNXRcrbiWvcx/UdlFiqUJJzxRQxgsZmvhXhn4cSKeSmoFjVdupA==",
-            "dev": true,
-            "dependencies": {
-                "bn.js": "^4.0.0",
-                "inherits": "^2.0.1",
-                "minimalistic-assert": "^1.0.0",
-                "safer-buffer": "^2.1.0"
-            }
-        },
-        "node_modules/asn1.js/node_modules/bn.js": {
-            "version": "4.12.0",
-            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
-            "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==",
-            "dev": true
-        },
-        "node_modules/assert": {
-            "version": "1.5.0",
-            "resolved": "https://registry.npmjs.org/assert/-/assert-1.5.0.tgz",
-            "integrity": "sha512-EDsgawzwoun2CZkCgtxJbv392v4nbk9XDD06zI+kQYoBM/3RBWLlEyJARDOmhAAosBjWACEkKL6S+lIZtcAubA==",
-            "dev": true,
-            "dependencies": {
-                "object-assign": "^4.1.1",
-                "util": "0.10.3"
-            }
-        },
-        "node_modules/assert-plus": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-            "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-            "engines": {
-                "node": ">=0.8"
-            }
-        },
-        "node_modules/assert/node_modules/inherits": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.1.tgz",
-            "integrity": "sha1-sX0I0ya0Qj5Wjv9xn5GwscvfafE=",
-            "dev": true
-        },
-        "node_modules/assert/node_modules/util": {
-            "version": "0.10.3",
-            "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
-            "integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=",
-            "dev": true,
-            "dependencies": {
-                "inherits": "2.0.1"
-            }
-        },
-        "node_modules/assertion-error": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.1.0.tgz",
-            "integrity": "sha512-jgsaNduz+ndvGyFt3uSuWqvy4lCnIJiovtouQN5JZHOKCS2QuhEdbcQHFhVksz2N2U9hXJo8odG7ETyWlEeuDw==",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/assign-symbols": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/assign-symbols/-/assign-symbols-1.0.0.tgz",
-            "integrity": "sha1-WWZ/QfrdTyDMvCu5a41Pf3jsA2c=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/async": {
-            "version": "2.6.3",
-            "resolved": "https://registry.npmjs.org/async/-/async-2.6.3.tgz",
-            "integrity": "sha512-zflvls11DCy+dQWzTW2dzuilv8Z5X/pjfmZOWba6TNIVDm+2UDaJmXSOXlasHKfNBs8oo3M0aT50fDEWfKZjXg==",
-            "dependencies": {
-                "lodash": "^4.17.14"
-            }
-        },
-        "node_modules/async-each": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.3.tgz",
-            "integrity": "sha512-z/WhQ5FPySLdvREByI2vZiTWwCnF0moMJ1hK9YQwDTHKh6I7/uSckMetoRGb5UBZPC1z0jlw+n/XCgjeH7y1AQ=="
-        },
-        "node_modules/async-foreach": {
-            "version": "0.1.3",
-            "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz",
-            "integrity": "sha1-NhIfhFwFeBct5Bmpfb6x0W7DRUI=",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/async-limiter": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/async-limiter/-/async-limiter-1.0.1.tgz",
-            "integrity": "sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ=="
-        },
-        "node_modules/asynckit": {
-            "version": "0.4.0",
-            "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
-            "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
-        },
-        "node_modules/atob": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz",
-            "integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==",
-            "bin": {
-                "atob": "bin/atob.js"
-            },
-            "engines": {
-                "node": ">= 4.5.0"
-            }
-        },
-        "node_modules/awesome-typescript-loader": {
-            "version": "5.2.1",
-            "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-5.2.1.tgz",
-            "integrity": "sha512-slv66OAJB8orL+UUaTI3pKlLorwIvS4ARZzYR9iJJyGsEgOqueMfOMdKySWzZ73vIkEe3fcwFgsKMg4d8zyb1g==",
-            "dev": true,
-            "dependencies": {
-                "chalk": "^2.4.1",
-                "enhanced-resolve": "^4.0.0",
-                "loader-utils": "^1.1.0",
-                "lodash": "^4.17.5",
-                "micromatch": "^3.1.9",
-                "mkdirp": "^0.5.1",
-                "source-map-support": "^0.5.3",
-                "webpack-log": "^1.2.0"
-            }
-        },
-        "node_modules/aws-sign2": {
-            "version": "0.7.0",
-            "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.7.0.tgz",
-            "integrity": "sha1-tG6JCTSpWR8tL2+G1+ap8bP+dqg=",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/aws4": {
-            "version": "1.9.1",
-            "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.9.1.tgz",
-            "integrity": "sha512-wMHVg2EOHaMRxbzgFJ9gtjOOCrI80OHLG14rxi28XwOW8ux6IiEbRCGGGqCtdAIg4FQCbW20k9RsT4y3gJlFug=="
-        },
-        "node_modules/axios": {
-            "version": "0.19.2",
-            "resolved": "https://registry.npmjs.org/axios/-/axios-0.19.2.tgz",
-            "integrity": "sha512-fjgm5MvRHLhx+osE2xoekY70AhARk3a6hkN+3Io1jc00jtquGvxYlKlsFUhmUET0V5te6CcZI7lcv2Ym61mjHA==",
-            "dependencies": {
-                "follow-redirects": "1.5.10"
-            }
-        },
-        "node_modules/axios/node_modules/debug": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
-            "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/axios/node_modules/follow-redirects": {
-            "version": "1.5.10",
-            "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
-            "integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
-            "dependencies": {
-                "debug": "=3.1.0"
-            },
-            "engines": {
-                "node": ">=4.0"
-            }
-        },
-        "node_modules/axios/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-        },
-        "node_modules/babel-code-frame": {
-            "version": "6.26.0",
-            "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
-            "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=",
-            "dev": true,
-            "dependencies": {
-                "chalk": "^1.1.3",
-                "esutils": "^2.0.2",
-                "js-tokens": "^3.0.2"
-            }
-        },
-        "node_modules/babel-code-frame/node_modules/ansi-regex": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-            "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/babel-code-frame/node_modules/ansi-styles": {
-            "version": "2.2.1",
-            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-            "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/babel-code-frame/node_modules/chalk": {
-            "version": "1.1.3",
-            "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-            "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-            "dev": true,
-            "dependencies": {
-                "ansi-styles": "^2.2.1",
-                "escape-string-regexp": "^1.0.2",
-                "has-ansi": "^2.0.0",
-                "strip-ansi": "^3.0.0",
-                "supports-color": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/babel-code-frame/node_modules/js-tokens": {
-            "version": "3.0.2",
-            "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz",
-            "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=",
-            "dev": true
-        },
-        "node_modules/babel-code-frame/node_modules/strip-ansi": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-            "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
-            "dev": true,
-            "dependencies": {
-                "ansi-regex": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/babel-code-frame/node_modules/supports-color": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-            "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.8.0"
-            }
-        },
-        "node_modules/babel-plugin-emotion": {
-            "version": "10.0.33",
-            "resolved": "https://registry.npmjs.org/babel-plugin-emotion/-/babel-plugin-emotion-10.0.33.tgz",
-            "integrity": "sha512-bxZbTTGz0AJQDHm8k6Rf3RQJ8tX2scsfsRyKVgAbiUPUNIRtlK+7JxP+TAd1kRLABFxe0CFm2VdK4ePkoA9FxQ==",
-            "dependencies": {
-                "@babel/helper-module-imports": "^7.0.0",
-                "@emotion/hash": "0.8.0",
-                "@emotion/memoize": "0.7.4",
-                "@emotion/serialize": "^0.11.16",
-                "babel-plugin-macros": "^2.0.0",
-                "babel-plugin-syntax-jsx": "^6.18.0",
-                "convert-source-map": "^1.5.0",
-                "escape-string-regexp": "^1.0.5",
-                "find-root": "^1.1.0",
-                "source-map": "^0.5.7"
-            }
-        },
-        "node_modules/babel-plugin-macros": {
-            "version": "2.8.0",
-            "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz",
-            "integrity": "sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg==",
-            "dependencies": {
-                "@babel/runtime": "^7.7.2",
-                "cosmiconfig": "^6.0.0",
-                "resolve": "^1.12.0"
-            }
-        },
-        "node_modules/babel-plugin-styled-components": {
-            "version": "1.10.7",
-            "resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-1.10.7.tgz",
-            "integrity": "sha512-MBMHGcIA22996n9hZRf/UJLVVgkEOITuR2SvjHLb5dSTUyR4ZRGn+ngITapes36FI3WLxZHfRhkA1ffHxihOrg==",
-            "dependencies": {
-                "@babel/helper-annotate-as-pure": "^7.0.0",
-                "@babel/helper-module-imports": "^7.0.0",
-                "babel-plugin-syntax-jsx": "^6.18.0",
-                "lodash": "^4.17.11"
-            }
-        },
-        "node_modules/babel-plugin-syntax-jsx": {
-            "version": "6.18.0",
-            "resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
-            "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY="
-        },
-        "node_modules/babel-runtime": {
-            "version": "6.26.0",
-            "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
-            "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
-            "dependencies": {
-                "core-js": "^2.4.0",
-                "regenerator-runtime": "^0.11.0"
-            }
-        },
-        "node_modules/babel-runtime/node_modules/core-js": {
-            "version": "2.6.11",
-            "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.11.tgz",
-            "integrity": "sha512-5wjnpaT/3dV+XB4borEsnAYQchn00XSgTAWKDkEqv+K8KevjbzmofK6hfJ9TZIlpj2N0xQpazy7PiRQiWHqzWg==",
-            "hasInstallScript": true
-        },
-        "node_modules/babel-runtime/node_modules/regenerator-runtime": {
-            "version": "0.11.1",
-            "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
-            "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg=="
-        },
-        "node_modules/babel-types": {
-            "version": "6.26.0",
-            "resolved": "https://registry.npmjs.org/babel-types/-/babel-types-6.26.0.tgz",
-            "integrity": "sha1-o7Bz+Uq0nrb6Vc1lInozQ4BjJJc=",
-            "dependencies": {
-                "babel-runtime": "^6.26.0",
-                "esutils": "^2.0.2",
-                "lodash": "^4.17.4",
-                "to-fast-properties": "^1.0.3"
-            }
-        },
-        "node_modules/babel-types/node_modules/to-fast-properties": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-1.0.3.tgz",
-            "integrity": "sha1-uDVx+k2MJbguIxsG46MFXeTKGkc=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/babylon": {
-            "version": "6.18.0",
-            "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.18.0.tgz",
-            "integrity": "sha512-q/UEjfGJ2Cm3oKV71DJz9d25TPnq5rhBVL2Q4fA5wcC3jcrdn7+SssEybFIxwAvvP+YCsCYNKughoF33GxgycQ==",
-            "bin": {
-                "babylon": "bin/babylon.js"
-            }
-        },
-        "node_modules/backo2": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
-            "integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc="
-        },
-        "node_modules/balanced-match": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
-            "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c="
-        },
-        "node_modules/base": {
-            "version": "0.11.2",
-            "resolved": "https://registry.npmjs.org/base/-/base-0.11.2.tgz",
-            "integrity": "sha512-5T6P4xPgpp0YDFvSWwEZ4NoE3aM4QBQXDzmVbraCkFj8zHM+mba8SyqB5DbZWyR7mYHo6Y7BdQo3MoA4m0TeQg==",
-            "dependencies": {
-                "cache-base": "^1.0.1",
-                "class-utils": "^0.3.5",
-                "component-emitter": "^1.2.1",
-                "define-property": "^1.0.0",
-                "isobject": "^3.0.1",
-                "mixin-deep": "^1.2.0",
-                "pascalcase": "^0.1.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/base/node_modules/define-property": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
-            "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
-            "dependencies": {
-                "is-descriptor": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/base/node_modules/is-accessor-descriptor": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-1.0.0.tgz",
-            "integrity": "sha512-m5hnHTkcVsPfqx3AKlyttIPb7J+XykHvJP2B9bZDjlhLIoEq4XoK64Vg7boZlVWYK6LUY94dYPEE7Lh0ZkZKcQ==",
-            "dependencies": {
-                "kind-of": "^6.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/base/node_modules/is-data-descriptor": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-1.0.0.tgz",
-            "integrity": "sha512-jbRXy1FmtAoCjQkVmIVYwuuqDFUbaOeDjmed1tOGPrsMhtJA4rD9tkgA0F1qJ3gRFRXcHYVkdeaP50Q5rE/jLQ==",
-            "dependencies": {
-                "kind-of": "^6.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/base/node_modules/is-descriptor": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.2.tgz",
-            "integrity": "sha512-2eis5WqQGV7peooDyLmNEPUrps9+SXX5c9pL3xEB+4e9HnGuDa7mB7kHxHw4CbqS9k1T2hOH3miL8n8WtiYVtg==",
-            "dependencies": {
-                "is-accessor-descriptor": "^1.0.0",
-                "is-data-descriptor": "^1.0.0",
-                "kind-of": "^6.0.2"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/base16": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/base16/-/base16-1.0.0.tgz",
-            "integrity": "sha1-4pf2DX7BAUp6lxo568ipjAtoHnA="
-        },
-        "node_modules/base64-arraybuffer": {
-            "version": "0.1.5",
-            "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz",
-            "integrity": "sha1-c5JncZI7Whl0etZmqlzUv5xunOg=",
-            "engines": {
-                "node": ">= 0.6.0"
-            }
-        },
-        "node_modules/base64-js": {
-            "version": "1.3.1",
-            "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.3.1.tgz",
-            "integrity": "sha512-mLQ4i2QO1ytvGWFWmcngKO//JXAQueZvwEKtjgQFM4jIK0kU+ytMfplL8j+n5mspOfjHwoAg+9yhb7BwAHm36g=="
-        },
-        "node_modules/base64id": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/base64id/-/base64id-2.0.0.tgz",
-            "integrity": "sha512-lGe34o6EHj9y3Kts9R4ZYs/Gr+6N7MCaMlIFA3F1R2O5/m7K06AxfSeO5530PEERE6/WyEg3lsuyw4GHlPZHog==",
-            "engines": {
-                "node": "^4.5.0 || >= 5.9"
-            }
-        },
-        "node_modules/base64url": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/base64url/-/base64url-3.0.1.tgz",
-            "integrity": "sha512-ir1UPr3dkwexU7FdV8qBBbNDRUhMmIekYMFZfi+C/sLNnRESKPl23nB9b2pltqfOQNnGzsDdId90AEtG5tCx4A==",
-            "engines": {
-                "node": ">=6.0.0"
-            }
-        },
-        "node_modules/batch": {
-            "version": "0.6.1",
-            "resolved": "https://registry.npmjs.org/batch/-/batch-0.6.1.tgz",
-            "integrity": "sha1-3DQxT05nkxgJP8dgJyUl+UvyXBY=",
-            "dev": true
-        },
-        "node_modules/bcrypt-nodejs": {
-            "version": "0.0.3",
-            "resolved": "https://registry.npmjs.org/bcrypt-nodejs/-/bcrypt-nodejs-0.0.3.tgz",
-            "integrity": "sha1-xgkX8m3CNWYVZsaBBhwwPCsohCs="
-        },
-        "node_modules/bcrypt-pbkdf": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.2.tgz",
-            "integrity": "sha1-pDAdOJtqQ/m2f/PKEaP2Y342Dp4=",
-            "dependencies": {
-                "tweetnacl": "^0.14.3"
-            }
-        },
-        "node_modules/better-assert": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz",
-            "integrity": "sha1-QIZrnhueC1W0gYlDEeaPr/rrxSI=",
-            "dependencies": {
-                "callsite": "1.0.0"
-            },
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/bezier-curve": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/bezier-curve/-/bezier-curve-1.0.0.tgz",
-            "integrity": "sha1-o9+v6rEqlMRicw1QeYxSqEBdc3k="
-        },
-        "node_modules/big.js": {
-            "version": "5.2.2",
-            "resolved": "https://registry.npmjs.org/big.js/-/big.js-5.2.2.tgz",
-            "integrity": "sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/bignumber.js": {
-            "version": "7.2.1",
-            "resolved": "https://registry.npmjs.org/bignumber.js/-/bignumber.js-7.2.1.tgz",
-            "integrity": "sha512-S4XzBk5sMB+Rcb/LNcpzXr57VRTxgAvaAEDAl1AwRx27j00hT84O6OkteE7u8UB3NuaaygCRrEpqox4uDOrbdQ==",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/binary-extensions": {
-            "version": "1.13.1",
-            "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.13.1.tgz",
-            "integrity": "sha512-Un7MIEDdUC5gNpcGDV97op1Ywk748MpHcFTHoYs6qnj1Z3j7I53VG3nwZhKzoBZmbdRNnb6WRdFlwl7tSDuZGw==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/bindings": {
-            "version": "1.3.1",
-            "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.3.1.tgz",
-            "integrity": "sha512-i47mqjF9UbjxJhxGf+pZ6kSxrnI3wBLlnGI2ArWJ4r0VrvDS7ZYXkprq/pLaBWYq4GM0r4zdHY+NNRqEMU7uew=="
-        },
-        "node_modules/bl": {
-            "version": "4.0.2",
-            "resolved": "https://registry.npmjs.org/bl/-/bl-4.0.2.tgz",
-            "integrity": "sha512-j4OH8f6Qg2bGuWfRiltT2HYGx0e1QcBTrK9KAHNMwMZdQnDZFk0ZSYIpADjYCB3U12nicC5tVJwSIhwOWjb4RQ==",
-            "dependencies": {
-                "buffer": "^5.5.0",
-                "inherits": "^2.0.4",
-                "readable-stream": "^3.4.0"
-            }
-        },
-        "node_modules/blob": {
-            "version": "0.0.5",
-            "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.5.tgz",
-            "integrity": "sha512-gaqbzQPqOoamawKg0LGVd7SzLgXS+JH61oWprSLH+P+abTczqJbhTR8CmJ2u9/bUYNmHTGJx/UEmn6doAvvuig=="
-        },
-        "node_modules/block-stream": {
-            "version": "0.0.9",
-            "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz",
-            "integrity": "sha1-E+v+d4oDIFz+A3UUgeu0szAMEmo=",
-            "dependencies": {
-                "inherits": "~2.0.0"
-            },
-            "engines": {
-                "node": "0.4 || >=0.5.8"
-            }
-        },
-        "node_modules/bluebird": {
-            "version": "3.7.2",
-            "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz",
-            "integrity": "sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg=="
-        },
-        "node_modules/blueimp-load-image": {
-            "version": "2.31.0",
-            "resolved": "https://registry.npmjs.org/blueimp-load-image/-/blueimp-load-image-2.31.0.tgz",
-            "integrity": "sha512-6sTGh1OiUmuH8ftAYvUzALivoOmcnahinGmjZFI4puZVowXoKTn/bXtth7N1skW5AlezEOfjgFH4lNXHeNRQog=="
-        },
-        "node_modules/bn.js": {
-            "version": "5.2.0",
-            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-5.2.0.tgz",
-            "integrity": "sha512-D7iWRBvnZE8ecXiLj/9wbxH7Tk79fAh8IHaTNq1RWRixsS02W+5qS+iE9yq6RYl0asXx5tw0bLhmT5pIfbSquw==",
-            "dev": true
-        },
-        "node_modules/body-parser": {
-            "version": "1.19.0",
-            "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.19.0.tgz",
-            "integrity": "sha512-dhEPs72UPbDnAQJ9ZKMNTP6ptJaionhP5cBb541nXPlW60Jepo9RV/a4fX4XWW9CuFNK22krhrj1+rgzifNCsw==",
-            "dependencies": {
-                "bytes": "3.1.0",
-                "content-type": "~1.0.4",
-                "debug": "2.6.9",
-                "depd": "~1.1.2",
-                "http-errors": "1.7.2",
-                "iconv-lite": "0.4.24",
-                "on-finished": "~2.3.0",
-                "qs": "6.7.0",
-                "raw-body": "2.4.0",
-                "type-is": "~1.6.17"
-            },
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/body-parser/node_modules/debug": {
-            "version": "2.6.9",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/body-parser/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-        },
-        "node_modules/body-parser/node_modules/qs": {
-            "version": "6.7.0",
-            "resolved": "https://registry.npmjs.org/qs/-/qs-6.7.0.tgz",
-            "integrity": "sha512-VCdBRNFTX1fyE7Nb6FYoURo/SPe62QCaAyzJvUjwRaIsc+NePBEniHlvxFmmX56+HZphIGtV0XeCirBtpDrTyQ==",
-            "engines": {
-                "node": ">=0.6"
-            }
-        },
-        "node_modules/bonjour": {
-            "version": "3.5.0",
-            "resolved": "https://registry.npmjs.org/bonjour/-/bonjour-3.5.0.tgz",
-            "integrity": "sha1-jokKGD2O6aI5OzhExpGkK897yfU=",
-            "dev": true,
-            "dependencies": {
-                "array-flatten": "^2.1.0",
-                "deep-equal": "^1.0.1",
-                "dns-equal": "^1.0.0",
-                "dns-txt": "^2.0.2",
-                "multicast-dns": "^6.0.1",
-                "multicast-dns-service-types": "^1.1.0"
-            }
-        },
-        "node_modules/bonjour/node_modules/array-flatten": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-2.1.2.tgz",
-            "integrity": "sha512-hNfzcOV8W4NdualtqBFPyVO+54DSJuZGY9qT4pRroB6S9e3iiido2ISIC5h9R2sPJ8H3FHCIiEnsv1lPXO3KtQ==",
-            "dev": true
-        },
-        "node_modules/boolbase": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
-            "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
-        },
-        "node_modules/bootstrap": {
-            "version": "4.5.0",
-            "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.5.0.tgz",
-            "integrity": "sha512-Z93QoXvodoVslA+PWNdk23Hze4RBYIkpb5h8I2HY2Tu2h7A0LpAgLcyrhrSUyo2/Oxm2l1fRZPs1e5hnxnliXA=="
-        },
-        "node_modules/bowser": {
-            "version": "1.9.4",
-            "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.9.4.tgz",
-            "integrity": "sha512-9IdMmj2KjigRq6oWhmwv1W36pDuA4STQZ8q6YO9um+x07xgYNCD3Oou+WP/3L1HNz7iqythGet3/p4wvc8AAwQ=="
-        },
-        "node_modules/boxen": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.3.0.tgz",
-            "integrity": "sha512-TNPjfTr432qx7yOjQyaXm3dSR0MH9vXp7eT1BFSl/C51g+EFnOR9hTg1IreahGBmDNCehscshe45f+C1TBZbLw==",
-            "dependencies": {
-                "ansi-align": "^2.0.0",
-                "camelcase": "^4.0.0",
-                "chalk": "^2.0.1",
-                "cli-boxes": "^1.0.0",
-                "string-width": "^2.0.0",
-                "term-size": "^1.2.0",
-                "widest-line": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/boxen/node_modules/camelcase": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
-            "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/brace-expansion": {
-            "version": "1.1.11",
-            "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
-            "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
-            "dependencies": {
-                "balanced-match": "^1.0.0",
-                "concat-map": "0.0.1"
-            }
-        },
-        "node_modules/braces": {
-            "version": "2.3.2",
-            "resolved": "https://registry.npmjs.org/braces/-/braces-2.3.2.tgz",
-            "integrity": "sha512-aNdbnj9P8PjdXU4ybaWLK2IF3jc/EoDYbC7AazW6to3TRsfXxscC9UXOB5iDiEQrkyIbWp2SLQda4+QAa7nc3w==",
-            "dependencies": {
-                "arr-flatten": "^1.1.0",
-                "array-unique": "^0.3.2",
-                "extend-shallow": "^2.0.1",
-                "fill-range": "^4.0.0",
-                "isobject": "^3.0.1",
-                "repeat-element": "^1.1.2",
-                "snapdragon": "^0.8.1",
-                "snapdragon-node": "^2.0.1",
-                "split-string": "^3.0.2",
-                "to-regex": "^3.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/braces/node_modules/extend-shallow": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
-            "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
-            "dependencies": {
-                "is-extendable": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/braces/node_modules/is-extendable": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
-            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/brorand": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz",
-            "integrity": "sha1-EsJe/kCkXjwyPrhnWgoM5XsiNx8=",
-            "dev": true
-        },
-        "node_modules/browser-process-hrtime": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/browser-process-hrtime/-/browser-process-hrtime-1.0.0.tgz",
-            "integrity": "sha512-9o5UecI3GhkpM6DrXr69PblIuWxPKk9Y0jHBRhdocZ2y7YECBFCsHm79Pr3OyR2AvjhDkabFJaDJMYRazHgsow==",
-            "dev": true
-        },
-        "node_modules/browser-stdout": {
-            "version": "1.3.1",
-            "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.1.tgz",
-            "integrity": "sha512-qhAVI1+Av2X7qelOfAIYwXONood6XlZE/fXaBSmW/T5SzLAmCgzi+eiWE7fUvbHaeNBQH13UftjpXxsfLkMpgw=="
-        },
-        "node_modules/browserify-aes": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz",
-            "integrity": "sha512-+7CHXqGuspUn/Sl5aO7Ea0xWGAtETPXNSAjHo48JfLdPWcMng33Xe4znFvQweqc/uzk5zSOI3H52CYnjCfb5hA==",
-            "dev": true,
-            "dependencies": {
-                "buffer-xor": "^1.0.3",
-                "cipher-base": "^1.0.0",
-                "create-hash": "^1.1.0",
-                "evp_bytestokey": "^1.0.3",
-                "inherits": "^2.0.1",
-                "safe-buffer": "^5.0.1"
-            }
-        },
-        "node_modules/browserify-cipher": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/browserify-cipher/-/browserify-cipher-1.0.1.tgz",
-            "integrity": "sha512-sPhkz0ARKbf4rRQt2hTpAHqn47X3llLkUGn+xEJzLjwY8LRs2p0v7ljvI5EyoRO/mexrNunNECisZs+gw2zz1w==",
-            "dev": true,
-            "dependencies": {
-                "browserify-aes": "^1.0.4",
-                "browserify-des": "^1.0.0",
-                "evp_bytestokey": "^1.0.0"
-            }
-        },
-        "node_modules/browserify-des": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.2.tgz",
-            "integrity": "sha512-BioO1xf3hFwz4kc6iBhI3ieDFompMhrMlnDFC4/0/vd5MokpuAc3R+LYbwTA9A5Yc9pq9UYPqffKpW2ObuwX5A==",
-            "dev": true,
-            "dependencies": {
-                "cipher-base": "^1.0.1",
-                "des.js": "^1.0.0",
-                "inherits": "^2.0.1",
-                "safe-buffer": "^5.1.2"
-            }
-        },
-        "node_modules/browserify-rsa": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.1.0.tgz",
-            "integrity": "sha512-AdEER0Hkspgno2aR97SAf6vi0y0k8NuOpGnVH3O99rcA5Q6sh8QxcngtHuJ6uXwnfAXNM4Gn1Gb7/MV1+Ymbog==",
-            "dev": true,
-            "dependencies": {
-                "bn.js": "^5.0.0",
-                "randombytes": "^2.0.1"
-            }
-        },
-        "node_modules/browserify-sign": {
-            "version": "4.2.1",
-            "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.2.1.tgz",
-            "integrity": "sha512-/vrA5fguVAKKAVTNJjgSm1tRQDHUU6DbwO9IROu/0WAzC8PKhucDSh18J0RMvVeHAn5puMd+QHC2erPRNf8lmg==",
-            "dev": true,
-            "dependencies": {
-                "bn.js": "^5.1.1",
-                "browserify-rsa": "^4.0.1",
-                "create-hash": "^1.2.0",
-                "create-hmac": "^1.1.7",
-                "elliptic": "^6.5.3",
-                "inherits": "^2.0.4",
-                "parse-asn1": "^5.1.5",
-                "readable-stream": "^3.6.0",
-                "safe-buffer": "^5.2.0"
-            }
-        },
-        "node_modules/browserify-sign/node_modules/safe-buffer": {
-            "version": "5.2.1",
-            "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
-            "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
-            "dev": true
-        },
-        "node_modules/browserify-zlib": {
-            "version": "0.2.0",
-            "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.2.0.tgz",
-            "integrity": "sha512-Z942RysHXmJrhqk88FmKBVq/v5tqmSkDz7p54G/MGyjMnCFFnC79XWNbg+Vta8W6Wb2qtSZTSxIGkJrRpCFEiA==",
-            "dev": true,
-            "dependencies": {
-                "pako": "~1.0.5"
-            }
-        },
-        "node_modules/bson": {
-            "version": "1.0.9",
-            "resolved": "https://registry.npmjs.org/bson/-/bson-1.0.9.tgz",
-            "integrity": "sha512-IQX9/h7WdMBIW/q/++tGd+emQr0XMdeZ6icnT/74Xk9fnabWn+gZgpE+9V+gujL3hhJOoNrnDVY7tWdzc7NUTg==",
-            "engines": {
-                "node": ">=0.6.19"
-            }
-        },
-        "node_modules/buffer": {
-            "version": "5.6.0",
-            "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.6.0.tgz",
-            "integrity": "sha512-/gDYp/UtU0eA1ys8bOs9J6a+E/KWIY+DZ+Q2WESNUA0jFRsJOc0SNUO6xJ5SGA1xueg3NL65W6s+NY5l9cunuw==",
-            "dependencies": {
-                "base64-js": "^1.0.2",
-                "ieee754": "^1.1.4"
-            }
-        },
-        "node_modules/buffer-crc32": {
-            "version": "0.2.13",
-            "resolved": "https://registry.npmjs.org/buffer-crc32/-/buffer-crc32-0.2.13.tgz",
-            "integrity": "sha1-DTM+PwDqxQqhRUq9MO+MKl2ackI=",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/buffer-equal-constant-time": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/buffer-equal-constant-time/-/buffer-equal-constant-time-1.0.1.tgz",
-            "integrity": "sha1-+OcRMvf/5uAaXJaXpMbz5I1cyBk="
-        },
-        "node_modules/buffer-from": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.1.tgz",
-            "integrity": "sha512-MQcXEUbCKtEo7bhqEs6560Hyd4XaovZlO/k9V3hjVUF/zwW7KBVdSK4gIt/bzwS9MbR5qob+F5jusZsb0YQK2A=="
-        },
-        "node_modules/buffer-indexof": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/buffer-indexof/-/buffer-indexof-1.1.1.tgz",
-            "integrity": "sha512-4/rOEg86jivtPTeOUUT61jJO1Ya1TrR/OkqCSZDyq84WJh3LuuiphBYJN+fm5xufIk4XAFcEwte/8WzC8If/1g==",
-            "dev": true
-        },
-        "node_modules/buffer-shims": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/buffer-shims/-/buffer-shims-1.0.0.tgz",
-            "integrity": "sha1-mXjOMXOIxkmth5MCjDR37wRKi1E="
-        },
-        "node_modules/buffer-xor": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz",
-            "integrity": "sha1-JuYe0UIvtw3ULm42cp7VHYVf6Nk=",
-            "dev": true
-        },
-        "node_modules/built-in-math-eval": {
-            "version": "0.3.0",
-            "resolved": "https://registry.npmjs.org/built-in-math-eval/-/built-in-math-eval-0.3.0.tgz",
-            "integrity": "sha1-JA3CHLOJQ5WIxhxGDrAHZJfvxBw=",
-            "dependencies": {
-                "math-codegen": "^0.3.5"
-            }
-        },
-        "node_modules/builtin-modules": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
-            "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/builtin-status-codes": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz",
-            "integrity": "sha1-hZgoeOIbmOHGZCXgPQF0eI9Wnug=",
-            "dev": true
-        },
-        "node_modules/bytes": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.0.tgz",
-            "integrity": "sha512-zauLjrfCG+xvoyaqLoV8bLVXXNGC4JqlxFCutSDWA6fJrTo2ZuvLYTqZ7aHBLZSMOopbzwv8f+wZcVzfVTI2Dg==",
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/cacache": {
-            "version": "10.0.4",
-            "resolved": "https://registry.npmjs.org/cacache/-/cacache-10.0.4.tgz",
-            "integrity": "sha512-Dph0MzuH+rTQzGPNT9fAnrPmMmjKfST6trxJeK7NQuHRaVw24VzPRWTmg9MpcwOVQZO0E1FBICUlFeNaKPIfHA==",
-            "dev": true,
-            "dependencies": {
-                "bluebird": "^3.5.1",
-                "chownr": "^1.0.1",
-                "glob": "^7.1.2",
-                "graceful-fs": "^4.1.11",
-                "lru-cache": "^4.1.1",
-                "mississippi": "^2.0.0",
-                "mkdirp": "^0.5.1",
-                "move-concurrently": "^1.0.1",
-                "promise-inflight": "^1.0.1",
-                "rimraf": "^2.6.2",
-                "ssri": "^5.2.4",
-                "unique-filename": "^1.1.0",
-                "y18n": "^4.0.0"
-            }
-        },
-        "node_modules/cacache/node_modules/lru-cache": {
-            "version": "4.1.5",
-            "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.5.tgz",
-            "integrity": "sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==",
-            "dev": true,
-            "dependencies": {
-                "pseudomap": "^1.0.2",
-                "yallist": "^2.1.2"
-            }
-        },
-        "node_modules/cacache/node_modules/rimraf": {
-            "version": "2.7.1",
-            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-            "dev": true,
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/cacache/node_modules/yallist": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz",
-            "integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI=",
-            "dev": true
-        },
-        "node_modules/cache-base": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/cache-base/-/cache-base-1.0.1.tgz",
-            "integrity": "sha512-AKcdTnFSWATd5/GCPRxr2ChwIJ85CeyrEyjRHlKxQ56d4XJMGym0uAiKn0xbLOGOl3+yRpOTi484dVCEc5AUzQ==",
-            "dependencies": {
-                "collection-visit": "^1.0.0",
-                "component-emitter": "^1.2.1",
-                "get-value": "^2.0.6",
-                "has-value": "^1.0.0",
-                "isobject": "^3.0.1",
-                "set-value": "^2.0.0",
-                "to-object-path": "^0.3.0",
-                "union-value": "^1.0.0",
-                "unset-value": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/caller-callsite": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/caller-callsite/-/caller-callsite-2.0.0.tgz",
-            "integrity": "sha1-hH4PzgoiN1CpoCfFSzNzGtMVQTQ=",
-            "dependencies": {
-                "callsites": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/caller-callsite/node_modules/callsites": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
-            "integrity": "sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/caller-path": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/caller-path/-/caller-path-2.0.0.tgz",
-            "integrity": "sha1-Ro+DBE42mrIBD6xfBs7uFbsssfQ=",
-            "dependencies": {
-                "caller-callsite": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/callsite": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz",
-            "integrity": "sha1-KAOY5dZkvXQDi28JBRU+borxvCA=",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/callsites": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
-            "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/camelcase": {
-            "version": "5.3.1",
-            "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
-            "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/camelcase-keys": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz",
-            "integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc=",
-            "dependencies": {
-                "camelcase": "^2.0.0",
-                "map-obj": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/camelcase-keys/node_modules/camelcase": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
-            "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/camelize": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/camelize/-/camelize-1.0.0.tgz",
-            "integrity": "sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs="
-        },
-        "node_modules/canvas": {
-            "version": "2.6.1",
-            "resolved": "https://registry.npmjs.org/canvas/-/canvas-2.6.1.tgz",
-            "integrity": "sha512-S98rKsPcuhfTcYbtF53UIJhcbgIAK533d1kJKMwsMwAIFgfd58MOyxRud3kktlzWiEkFliaJtvyZCBtud/XVEA==",
-            "hasInstallScript": true,
-            "dependencies": {
-                "nan": "^2.14.0",
-                "node-pre-gyp": "^0.11.0",
-                "simple-get": "^3.0.3"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/canvas/node_modules/node-pre-gyp": {
-            "version": "0.11.0",
-            "resolved": "https://registry.npmjs.org/node-pre-gyp/-/node-pre-gyp-0.11.0.tgz",
-            "integrity": "sha512-TwWAOZb0j7e9eGaf9esRx3ZcLaE5tQ2lvYy1pb5IAaG1a2e2Kv5Lms1Y4hpj+ciXJRofIxxlt5haeQ/2ANeE0Q==",
-            "dependencies": {
-                "detect-libc": "^1.0.2",
-                "mkdirp": "^0.5.1",
-                "needle": "^2.2.1",
-                "nopt": "^4.0.1",
-                "npm-packlist": "^1.1.6",
-                "npmlog": "^4.0.2",
-                "rc": "^1.2.7",
-                "rimraf": "^2.6.1",
-                "semver": "^5.3.0",
-                "tar": "^4"
-            },
-            "bin": {
-                "node-pre-gyp": "bin/node-pre-gyp"
-            }
-        },
-        "node_modules/canvas/node_modules/rimraf": {
-            "version": "2.7.1",
-            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/capture-stack-trace": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/capture-stack-trace/-/capture-stack-trace-1.0.1.tgz",
-            "integrity": "sha512-mYQLZnx5Qt1JgB1WEiMCf2647plpGeQ2NMR/5L0HNZzGQo4fuSPnK+wjfPnKZV0aiJDgzmWqqkV/g7JD+DW0qw==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/caseless": {
-            "version": "0.12.0",
-            "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
-            "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw="
-        },
-        "node_modules/center-align": {
-            "version": "0.1.3",
-            "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz",
-            "integrity": "sha1-qg0yYptu6XIgBBHL1EYckHvCt60=",
-            "dependencies": {
-                "align-text": "^0.1.3",
-                "lazy-cache": "^1.0.3"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/chai": {
-            "version": "4.2.0",
-            "resolved": "https://registry.npmjs.org/chai/-/chai-4.2.0.tgz",
-            "integrity": "sha512-XQU3bhBukrOsQCuwZndwGcCVQHyZi53fQ6Ys1Fym7E4olpIqqZZhhoFJoaKVvV17lWQoXYwgWN2nF5crA8J2jw==",
-            "dependencies": {
-                "assertion-error": "^1.1.0",
-                "check-error": "^1.0.2",
-                "deep-eql": "^3.0.1",
-                "get-func-name": "^2.0.0",
-                "pathval": "^1.1.0",
-                "type-detect": "^4.0.5"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/chain-function": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/chain-function/-/chain-function-1.0.1.tgz",
-            "integrity": "sha512-SxltgMwL9uCko5/ZCLiyG2B7R9fY4pDZUw7hJ4MhirdjBLosoDqkWABi3XMucddHdLiFJMb7PD2MZifZriuMTg=="
-        },
-        "node_modules/chalk": {
-            "version": "2.4.2",
-            "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
-            "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-            "dependencies": {
-                "ansi-styles": "^3.2.1",
-                "escape-string-regexp": "^1.0.5",
-                "supports-color": "^5.3.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/change-emitter": {
-            "version": "0.1.6",
-            "resolved": "https://registry.npmjs.org/change-emitter/-/change-emitter-0.1.6.tgz",
-            "integrity": "sha1-6LL+PX8at9aaMhma/5HqaTFAlRU="
-        },
-        "node_modules/character-parser": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/character-parser/-/character-parser-2.2.0.tgz",
-            "integrity": "sha1-x84o821LzZdE5f/CxfzeHHMmH8A=",
-            "dependencies": {
-                "is-regex": "^1.0.3"
-            }
-        },
-        "node_modules/check-error": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/check-error/-/check-error-1.0.2.tgz",
-            "integrity": "sha1-V00xLt2Iu13YkS6Sht1sCu1KrII=",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/cheerio": {
-            "version": "1.0.0-rc.3",
-            "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-1.0.0-rc.3.tgz",
-            "integrity": "sha512-0td5ijfUPuubwLUu0OBoe98gZj8C/AA+RW3v67GPlGOrvxWjZmBXiBCRU+I8VEiNyJzjth40POfHiz2RB3gImA==",
-            "dependencies": {
-                "css-select": "~1.2.0",
-                "dom-serializer": "~0.1.1",
-                "entities": "~1.1.1",
-                "htmlparser2": "^3.9.1",
-                "lodash": "^4.15.0",
-                "parse5": "^3.0.1"
-            },
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/cheerio/node_modules/dom-serializer": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.1.tgz",
-            "integrity": "sha512-l0IU0pPzLWSHBcieZbpOKgkIn3ts3vAh7ZuFyXNwJxJXk/c4Gwj9xaTJwIDVQCXawWD0qb3IzMGH5rglQaO0XA==",
-            "dependencies": {
-                "domelementtype": "^1.3.0",
-                "entities": "^1.1.1"
-            }
-        },
-        "node_modules/child_process": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/child_process/-/child_process-1.0.2.tgz",
-            "integrity": "sha1-sffn/HPSXn/R1FWtyU4UODAYK1o="
-        },
-        "node_modules/chokidar": {
-            "version": "2.1.8",
-            "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.1.8.tgz",
-            "integrity": "sha512-ZmZUazfOzf0Nve7duiCKD23PFSCs4JPoYyccjUFF3aQkQadqBhfzhjkwBH2mNOG9cTBwhamM37EIsIkZw3nRgg==",
-            "dependencies": {
-                "anymatch": "^2.0.0",
-                "async-each": "^1.0.1",
-                "braces": "^2.3.2",
-                "glob-parent": "^3.1.0",
-                "inherits": "^2.0.3",
-                "is-binary-path": "^1.0.0",
-                "is-glob": "^4.0.0",
-                "normalize-path": "^3.0.0",
-                "path-is-absolute": "^1.0.0",
-                "readdirp": "^2.2.1",
-                "upath": "^1.1.1"
-            },
-            "optionalDependencies": {
-                "fsevents": "^1.2.7"
-            }
-        },
-        "node_modules/chokidar/node_modules/bindings": {
-            "version": "1.5.0",
-            "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
-            "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
-            "optional": true,
-            "dependencies": {
-                "file-uri-to-path": "1.0.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents": {
-            "version": "1.2.12",
-            "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.12.tgz",
-            "integrity": "sha512-Ggd/Ktt7E7I8pxZRbGIs7vwqAPscSESMrCSkx2FtWeqmheJgCo2R74fTsZFCifr0VTPwqRpPv17+6b8Zp7th0Q==",
-            "bundleDependencies": [
-                "node-pre-gyp"
-            ],
-            "hasInstallScript": true,
-            "optional": true,
-            "os": [
-                "darwin"
-            ],
-            "dependencies": {
-                "bindings": "^1.5.0",
-                "nan": "^2.12.1",
-                "node-pre-gyp": "*"
-            },
-            "engines": {
-                "node": ">= 4.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/abbrev": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/ansi-regex": {
-            "version": "2.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/aproba": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/are-we-there-yet": {
-            "version": "1.1.5",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "delegates": "^1.0.0",
-                "readable-stream": "^2.0.6"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/balanced-match": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/brace-expansion": {
-            "version": "1.1.11",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "balanced-match": "^1.0.0",
-                "concat-map": "0.0.1"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/chownr": {
-            "version": "1.1.4",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/code-point-at": {
-            "version": "1.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/concat-map": {
-            "version": "0.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/console-control-strings": {
-            "version": "1.1.0",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/core-util-is": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/debug": {
-            "version": "3.2.6",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/deep-extend": {
-            "version": "0.6.0",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/delegates": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/detect-libc": {
-            "version": "1.0.3",
-            "inBundle": true,
-            "license": "Apache-2.0",
-            "optional": true,
-            "bin": {
-                "detect-libc": "bin/detect-libc.js"
-            },
-            "engines": {
-                "node": ">=0.10"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/fs-minipass": {
-            "version": "1.2.7",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "minipass": "^2.6.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/fs.realpath": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/gauge": {
-            "version": "2.7.4",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "aproba": "^1.0.3",
-                "console-control-strings": "^1.0.0",
-                "has-unicode": "^2.0.0",
-                "object-assign": "^4.1.0",
-                "signal-exit": "^3.0.0",
-                "string-width": "^1.0.1",
-                "strip-ansi": "^3.0.1",
-                "wide-align": "^1.1.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/glob": {
-            "version": "7.1.6",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "fs.realpath": "^1.0.0",
-                "inflight": "^1.0.4",
-                "inherits": "2",
-                "minimatch": "^3.0.4",
-                "once": "^1.3.0",
-                "path-is-absolute": "^1.0.0"
-            },
-            "engines": {
-                "node": "*"
-            },
-            "funding": {
-                "url": "https://github.com/sponsors/isaacs"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/has-unicode": {
-            "version": "2.0.1",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/iconv-lite": {
-            "version": "0.4.24",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "safer-buffer": ">= 2.1.2 < 3"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/ignore-walk": {
-            "version": "3.0.3",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "minimatch": "^3.0.4"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/inflight": {
-            "version": "1.0.6",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "once": "^1.3.0",
-                "wrappy": "1"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/inherits": {
-            "version": "2.0.4",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/ini": {
-            "version": "1.3.5",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/is-fullwidth-code-point": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "number-is-nan": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/isarray": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/minimatch": {
-            "version": "3.0.4",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "brace-expansion": "^1.1.7"
-            },
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/minimist": {
-            "version": "1.2.5",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/minipass": {
-            "version": "2.9.0",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "safe-buffer": "^5.1.2",
-                "yallist": "^3.0.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/minizlib": {
-            "version": "1.3.3",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "minipass": "^2.9.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/mkdirp": {
-            "version": "0.5.3",
-            "deprecated": "Legacy versions of mkdirp are no longer supported. Please update to mkdirp 1.x. (Note that the API surface has changed to use Promises in 1.x.)",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "minimist": "^1.2.5"
-            },
-            "bin": {
-                "mkdirp": "bin/cmd.js"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/ms": {
-            "version": "2.1.2",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/needle": {
-            "version": "2.3.3",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "debug": "^3.2.6",
-                "iconv-lite": "^0.4.4",
-                "sax": "^1.2.4"
-            },
-            "bin": {
-                "needle": "bin/needle"
-            },
-            "engines": {
-                "node": ">= 4.4.x"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/node-pre-gyp": {
-            "version": "0.14.0",
-            "inBundle": true,
-            "license": "BSD-3-Clause",
-            "optional": true,
-            "dependencies": {
-                "detect-libc": "^1.0.2",
-                "mkdirp": "^0.5.1",
-                "needle": "^2.2.1",
-                "nopt": "^4.0.1",
-                "npm-packlist": "^1.1.6",
-                "npmlog": "^4.0.2",
-                "rc": "^1.2.7",
-                "rimraf": "^2.6.1",
-                "semver": "^5.3.0",
-                "tar": "^4.4.2"
-            },
-            "bin": {
-                "node-pre-gyp": "bin/node-pre-gyp"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/nopt": {
-            "version": "4.0.3",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "abbrev": "1",
-                "osenv": "^0.1.4"
-            },
-            "bin": {
-                "nopt": "bin/nopt.js"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/npm-bundled": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "npm-normalize-package-bin": "^1.0.1"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/npm-normalize-package-bin": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/npm-packlist": {
-            "version": "1.4.8",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "ignore-walk": "^3.0.1",
-                "npm-bundled": "^1.0.1",
-                "npm-normalize-package-bin": "^1.0.1"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/npmlog": {
-            "version": "4.1.2",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "are-we-there-yet": "~1.1.2",
-                "console-control-strings": "~1.1.0",
-                "gauge": "~2.7.3",
-                "set-blocking": "~2.0.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/number-is-nan": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/object-assign": {
-            "version": "4.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/once": {
-            "version": "1.4.0",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "wrappy": "1"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/os-homedir": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/os-tmpdir": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/osenv": {
-            "version": "0.1.5",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "os-homedir": "^1.0.0",
-                "os-tmpdir": "^1.0.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/path-is-absolute": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/process-nextick-args": {
-            "version": "2.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/rc": {
-            "version": "1.2.8",
-            "inBundle": true,
-            "license": "(BSD-2-Clause OR MIT OR Apache-2.0)",
-            "optional": true,
-            "dependencies": {
-                "deep-extend": "^0.6.0",
-                "ini": "~1.3.0",
-                "minimist": "^1.2.0",
-                "strip-json-comments": "~2.0.1"
-            },
-            "bin": {
-                "rc": "cli.js"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/rimraf": {
-            "version": "2.7.1",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/safe-buffer": {
-            "version": "5.1.2",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/safer-buffer": {
-            "version": "2.1.2",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/sax": {
-            "version": "1.2.4",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/semver": {
-            "version": "5.7.1",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "bin": {
-                "semver": "bin/semver"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/set-blocking": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/signal-exit": {
-            "version": "3.0.2",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/string_decoder": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/string-width": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "code-point-at": "^1.0.0",
-                "is-fullwidth-code-point": "^1.0.0",
-                "strip-ansi": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/strip-ansi": {
-            "version": "3.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "ansi-regex": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/strip-json-comments": {
-            "version": "2.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/tar": {
-            "version": "4.4.13",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "chownr": "^1.1.1",
-                "fs-minipass": "^1.2.5",
-                "minipass": "^2.8.6",
-                "minizlib": "^1.2.1",
-                "mkdirp": "^0.5.0",
-                "safe-buffer": "^5.1.2",
-                "yallist": "^3.0.3"
-            },
-            "engines": {
-                "node": ">=4.5"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/util-deprecate": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/wide-align": {
-            "version": "1.1.3",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true,
-            "dependencies": {
-                "string-width": "^1.0.2 || 2"
-            }
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/wrappy": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true
-        },
-        "node_modules/chokidar/node_modules/fsevents/node_modules/yallist": {
-            "version": "3.1.1",
-            "inBundle": true,
-            "license": "ISC",
-            "optional": true
-        },
-        "node_modules/chownr": {
-            "version": "1.1.4",
-            "resolved": "https://registry.npmjs.org/chownr/-/chownr-1.1.4.tgz",
-            "integrity": "sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg=="
-        },
-        "node_modules/chrome": {
-            "version": "0.1.0",
-            "resolved": "https://registry.npmjs.org/chrome/-/chrome-0.1.0.tgz",
-            "integrity": "sha1-9h2beS/v6MGUxwVt3BAscmqGQyk=",
-            "dependencies": {
-                "exeq": "^2.2.0",
-                "plist": "^1.1.0"
-            },
-            "bin": {
-                "chrome": "index.js"
-            }
-        },
-        "node_modules/chrome-trace-event": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/chrome-trace-event/-/chrome-trace-event-1.0.3.tgz",
-            "integrity": "sha512-p3KULyQg4S7NIHixdwbGX+nFHkoBiA4YQmyWtjb8XngSKV124nJmRysgAeujbUVb15vh+RvFUfCPqU7rXk+hZg==",
-            "dev": true,
-            "engines": {
-                "node": ">=6.0"
-            }
-        },
-        "node_modules/ci-info": {
-            "version": "1.6.0",
-            "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.6.0.tgz",
-            "integrity": "sha512-vsGdkwSCDpWmP80ncATX7iea5DWQemg1UgCW5J8tqjU3lYw4FBYuj89J0CTVomA7BEfvSZd84GmHko+MxFQU2A=="
-        },
-        "node_modules/cipher-base": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.4.tgz",
-            "integrity": "sha512-Kkht5ye6ZGmwv40uUDZztayT2ThLQGfnj/T71N/XzeZeo3nf8foyW7zGTsPYkEya3m5f3cAypH+qe7YOrM1U2Q==",
-            "dev": true,
-            "dependencies": {
-                "inherits": "^2.0.1",
-                "safe-buffer": "^5.0.1"
-            }
-        },
-        "node_modules/clamp": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/clamp/-/clamp-1.0.1.tgz",
-            "integrity": "sha1-ZqDmQBGBbjcZaCj9yMjBRzEshjQ="
-        },
-        "node_modules/class-transformer": {
-            "version": "0.2.3",
-            "resolved": "https://registry.npmjs.org/class-transformer/-/class-transformer-0.2.3.tgz",
-            "integrity": "sha512-qsP+0xoavpOlJHuYsQJsN58HXSl8Jvveo+T37rEvCEeRfMWoytAyR0Ua/YsFgpM6AZYZ/og2PJwArwzJl1aXtQ=="
-        },
-        "node_modules/class-utils": {
-            "version": "0.3.6",
-            "resolved": "https://registry.npmjs.org/class-utils/-/class-utils-0.3.6.tgz",
-            "integrity": "sha512-qOhPa/Fj7s6TY8H8esGu5QNpMMQxz79h+urzrNYN6mn+9BnxlDGf5QZ+XeCDsxSjPqsSR56XOZOJmpeurnLMeg==",
-            "dependencies": {
-                "arr-union": "^3.1.0",
-                "define-property": "^0.2.5",
-                "isobject": "^3.0.0",
-                "static-extend": "^0.1.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/class-utils/node_modules/define-property": {
-            "version": "0.2.5",
-            "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-            "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
-            "dependencies": {
-                "is-descriptor": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/classnames": {
-            "version": "2.2.6",
-            "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz",
-            "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q=="
-        },
-        "node_modules/clean-css": {
-            "version": "4.2.3",
-            "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.3.tgz",
-            "integrity": "sha512-VcMWDN54ZN/DS+g58HYL5/n4Zrqe8vHJpGA8KdgUXFU4fuP/aHNw8eld9SyEIyabIMJX/0RaY/fplOo5hYLSFA==",
-            "dependencies": {
-                "source-map": "~0.6.0"
-            },
-            "engines": {
-                "node": ">= 4.0"
-            }
-        },
-        "node_modules/clean-css/node_modules/source-map": {
-            "version": "0.6.1",
-            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/cli-boxes": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-1.0.0.tgz",
-            "integrity": "sha1-T6kXw+WclKAEzWH47lCdplFocUM=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/cliss": {
-            "version": "0.0.2",
-            "resolved": "https://registry.npmjs.org/cliss/-/cliss-0.0.2.tgz",
-            "integrity": "sha512-6rj9pgdukjT994Md13JCUAgTk91abAKrygL9sAvmHY4F6AKMOV8ccGaxhUUfcBuyg3sundWnn3JE0Mc9W6ZYqw==",
-            "dependencies": {
-                "command-line-usage": "^4.0.1",
-                "deepmerge": "^2.0.0",
-                "get-stdin": "^5.0.1",
-                "inspect-parameters-declaration": "0.0.9",
-                "object-to-arguments": "0.0.8",
-                "pipe-functions": "^1.3.0",
-                "strip-ansi": "^4.0.0",
-                "yargs-parser": "^7.0.0"
-            }
-        },
-        "node_modules/cliss/node_modules/camelcase": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
-            "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/cliss/node_modules/yargs-parser": {
-            "version": "7.0.0",
-            "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-7.0.0.tgz",
-            "integrity": "sha1-jQrELxbqVd69MyyvTEA4s+P139k=",
-            "dependencies": {
-                "camelcase": "^4.1.0"
-            }
-        },
-        "node_modules/cliui": {
-            "version": "5.0.0",
-            "resolved": "https://registry.npmjs.org/cliui/-/cliui-5.0.0.tgz",
-            "integrity": "sha512-PYeGSEmmHM6zvoef2w8TPzlrnNpXIjTipYK780YswmIP9vjxmd6Y2a3CB2Ks6/AU8NHjZugXvo8w3oWM2qnwXA==",
-            "dependencies": {
-                "string-width": "^3.1.0",
-                "strip-ansi": "^5.2.0",
-                "wrap-ansi": "^5.1.0"
-            }
-        },
-        "node_modules/cliui/node_modules/ansi-regex": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
-            "integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/cliui/node_modules/string-width": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
-            "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
-            "dependencies": {
-                "emoji-regex": "^7.0.1",
-                "is-fullwidth-code-point": "^2.0.0",
-                "strip-ansi": "^5.1.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/cliui/node_modules/strip-ansi": {
-            "version": "5.2.0",
-            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
-            "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
-            "dependencies": {
-                "ansi-regex": "^4.1.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/clj-fuzzy": {
-            "version": "0.3.3",
-            "resolved": "https://registry.npmjs.org/clj-fuzzy/-/clj-fuzzy-0.3.3.tgz",
-            "integrity": "sha1-seU0MJHFIC28UlMoY+HEp4RX8D0="
-        },
-        "node_modules/clone-deep": {
-            "version": "4.0.1",
-            "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-4.0.1.tgz",
-            "integrity": "sha512-neHB9xuzh/wk0dIHweyAXv2aPGZIVk3pLMe+/RNzINf17fe0OG96QroktYAUm7SM1PBnzTabaLboqqxDyMU+SQ==",
-            "dev": true,
-            "dependencies": {
-                "is-plain-object": "^2.0.4",
-                "kind-of": "^6.0.2",
-                "shallow-clone": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/clsx": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.1.1.tgz",
-            "integrity": "sha512-6/bPho624p3S2pMyvP5kKBPXnI3ufHLObBFCfgx+LkeR5lg2XYy2hqZqUf45ypD8COn2bhgGJSUE+l5dhNBieA==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/code-point-at": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
-            "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/collection-visit": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/collection-visit/-/collection-visit-1.0.0.tgz",
-            "integrity": "sha1-S8A3PBZLwykbTTaMgpzxqApZ3KA=",
-            "dependencies": {
-                "map-visit": "^1.0.0",
-                "object-visit": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/color": {
-            "version": "3.1.2",
-            "resolved": "https://registry.npmjs.org/color/-/color-3.1.2.tgz",
-            "integrity": "sha512-vXTJhHebByxZn3lDvDJYw4lR5+uB3vuoHsuYA5AKuxRVn5wzzIfQKGLBmgdVRHKTJYeK5rvJcHnrd0Li49CFpg==",
-            "dependencies": {
-                "color-convert": "^1.9.1",
-                "color-string": "^1.5.2"
-            }
-        },
-        "node_modules/color-convert": {
-            "version": "1.9.3",
-            "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
-            "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
-            "dependencies": {
-                "color-name": "1.1.3"
-            }
-        },
-        "node_modules/color-name": {
-            "version": "1.1.3",
-            "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-            "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
-        },
-        "node_modules/color-string": {
-            "version": "1.5.3",
-            "resolved": "https://registry.npmjs.org/color-string/-/color-string-1.5.3.tgz",
-            "integrity": "sha512-dC2C5qeWoYkxki5UAXapdjqO672AM4vZuPGRQfO8b5HKuKGBbKWpITyDYN7TOFKvRW7kOgAn3746clDBMDJyQw==",
-            "dependencies": {
-                "color-name": "^1.0.0",
-                "simple-swizzle": "^0.2.2"
-            }
-        },
-        "node_modules/colors": {
-            "version": "1.4.0",
-            "resolved": "https://registry.npmjs.org/colors/-/colors-1.4.0.tgz",
-            "integrity": "sha512-a+UqTh4kgZg/SlGvfbzDHpgRu7AAQOmmqRHJnxhRZICKFUT91brVhNNt58CMWU9PsBbv3PDCZUHbVxuDiH2mtA==",
-            "engines": {
-                "node": ">=0.1.90"
-            }
-        },
-        "node_modules/combined-stream": {
-            "version": "1.0.8",
-            "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
-            "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
-            "dependencies": {
-                "delayed-stream": "~1.0.0"
-            },
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/command-exists": {
-            "version": "1.2.6",
-            "resolved": "https://registry.npmjs.org/command-exists/-/command-exists-1.2.6.tgz",
-            "integrity": "sha512-Qst/zUUNmS/z3WziPxyqjrcz09pm+2Knbs5mAZL4VAE0sSrNY1/w8+/YxeHcoBTsO6iojA6BW7eFf27Eg2MRuw=="
-        },
-        "node_modules/command-line-usage": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/command-line-usage/-/command-line-usage-4.1.0.tgz",
-            "integrity": "sha512-MxS8Ad995KpdAC0Jopo/ovGIroV/m0KHwzKfXxKag6FHOkGsH8/lv5yjgablcRxCJJC0oJeUMuO/gmaq+Wq46g==",
-            "dependencies": {
-                "ansi-escape-sequences": "^4.0.0",
-                "array-back": "^2.0.0",
-                "table-layout": "^0.4.2",
-                "typical": "^2.6.1"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/commander": {
-            "version": "2.20.3",
-            "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
-            "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ=="
-        },
-        "node_modules/commondir": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
-            "integrity": "sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs=",
-            "dev": true
-        },
-        "node_modules/component-bind": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz",
-            "integrity": "sha1-AMYIq33Nk4l8AAllGx06jh5zu9E="
-        },
-        "node_modules/component-emitter": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.3.0.tgz",
-            "integrity": "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg=="
-        },
-        "node_modules/component-inherit": {
-            "version": "0.0.3",
-            "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz",
-            "integrity": "sha1-ZF/ErfWLcrZJ1crmUTVhnbJv8UM="
-        },
-        "node_modules/compress-commons": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/compress-commons/-/compress-commons-2.1.1.tgz",
-            "integrity": "sha512-eVw6n7CnEMFzc3duyFVrQEuY1BlHR3rYsSztyG32ibGMW722i3C6IizEGMFmfMU+A+fALvBIwxN3czffTcdA+Q==",
-            "dependencies": {
-                "buffer-crc32": "^0.2.13",
-                "crc32-stream": "^3.0.1",
-                "normalize-path": "^3.0.0",
-                "readable-stream": "^2.3.6"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/compress-commons/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/compressible": {
-            "version": "2.0.18",
-            "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz",
-            "integrity": "sha512-AF3r7P5dWxL8MxyITRMlORQNaOA2IkAFaTr4k7BUumjPtRpGDTZpl0Pb1XCO6JeDCBdp126Cgs9sMxqSjgYyRg==",
-            "dev": true,
-            "dependencies": {
-                "mime-db": ">= 1.43.0 < 2"
-            },
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/compression": {
-            "version": "1.7.4",
-            "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.4.tgz",
-            "integrity": "sha512-jaSIDzP9pZVS4ZfQ+TzvtiWhdpFhE2RDHz8QJkpX9SIpLq88VueF5jJw6t+6CUQcAoA6t+x89MLrWAqpfDE8iQ==",
-            "dev": true,
-            "dependencies": {
-                "accepts": "~1.3.5",
-                "bytes": "3.0.0",
-                "compressible": "~2.0.16",
-                "debug": "2.6.9",
-                "on-headers": "~1.0.2",
-                "safe-buffer": "5.1.2",
-                "vary": "~1.1.2"
-            },
-            "engines": {
-                "node": ">= 0.8.0"
-            }
-        },
-        "node_modules/compression/node_modules/bytes": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz",
-            "integrity": "sha1-0ygVQE1olpn4Wk6k+odV3ROpYEg=",
-            "dev": true,
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/compression/node_modules/debug": {
-            "version": "2.6.9",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-            "dev": true,
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/compression/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
-            "dev": true
-        },
-        "node_modules/concat-map": {
-            "version": "0.0.1",
-            "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
-            "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
-        },
-        "node_modules/concat-stream": {
-            "version": "1.6.2",
-            "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.2.tgz",
-            "integrity": "sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw==",
-            "engines": [
-                "node >= 0.8"
-            ],
-            "dependencies": {
-                "buffer-from": "^1.0.0",
-                "inherits": "^2.0.3",
-                "readable-stream": "^2.2.2",
-                "typedarray": "^0.0.6"
-            }
-        },
-        "node_modules/concat-stream/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/configstore": {
-            "version": "3.1.2",
-            "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.2.tgz",
-            "integrity": "sha512-vtv5HtGjcYUgFrXc6Kx747B83MRRVS5R1VTEQoXvuP+kMI+if6uywV0nDGoiydJRy4yk7h9od5Og0kxx4zUXmw==",
-            "dependencies": {
-                "dot-prop": "^4.1.0",
-                "graceful-fs": "^4.1.2",
-                "make-dir": "^1.0.0",
-                "unique-string": "^1.0.0",
-                "write-file-atomic": "^2.0.0",
-                "xdg-basedir": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/connect-flash": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/connect-flash/-/connect-flash-0.1.1.tgz",
-            "integrity": "sha1-2GMPJtlaf4UfmVax6MxnMvO2qjA=",
-            "engines": {
-                "node": ">= 0.4.0"
-            }
-        },
-        "node_modules/connect-history-api-fallback": {
-            "version": "1.6.0",
-            "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz",
-            "integrity": "sha512-e54B99q/OUoH64zYYRf3HBP5z24G38h5D3qXu23JGRoigpX5Ss4r9ZnDk3g0Z8uQC2x2lPaJ+UlWBc1ZWBWdLg==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.8"
-            }
-        },
-        "node_modules/connect-mongo": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/connect-mongo/-/connect-mongo-2.0.3.tgz",
-            "integrity": "sha512-Vs+QZ/6X6gbCrP1Ls7Oh/wlyY6pgpbPSrUKF5yRT+zd+4GZPNbjNquxquZ+Clv2+03HBXE7T4lVM0PUcaBhihg==",
-            "dependencies": {
-                "mongodb": "^2.0.36"
-            }
-        },
-        "node_modules/connect-mongo/node_modules/mongodb": {
-            "version": "2.2.36",
-            "resolved": "https://registry.npmjs.org/mongodb/-/mongodb-2.2.36.tgz",
-            "integrity": "sha512-P2SBLQ8Z0PVx71ngoXwo12+FiSfbNfGOClAao03/bant5DgLNkOPAck5IaJcEk4gKlQhDEURzfR3xuBG1/B+IA==",
-            "dependencies": {
-                "es6-promise": "3.2.1",
-                "mongodb-core": "2.1.20",
-                "readable-stream": "2.2.7"
-            },
-            "engines": {
-                "node": ">=0.10.3"
-            }
-        },
-        "node_modules/connect-mongo/node_modules/process-nextick-args": {
-            "version": "1.0.7",
-            "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
-            "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M="
-        },
-        "node_modules/connect-mongo/node_modules/readable-stream": {
-            "version": "2.2.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.7.tgz",
-            "integrity": "sha1-BwV6y+JGeyIELTb5jFrVBwVOlbE=",
-            "dependencies": {
-                "buffer-shims": "~1.0.0",
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.1",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~1.0.6",
-                "string_decoder": "~1.0.0",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/connect-mongo/node_modules/string_decoder": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-            "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==",
-            "dependencies": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
-        "node_modules/console-browserify": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.2.0.tgz",
-            "integrity": "sha512-ZMkYO/LkF17QvCPqM0gxw8yUzigAOZOSWSHg91FH6orS7vcEj5dVZTidN2fQ14yBSdg97RqhSNwLUXInd52OTA==",
-            "dev": true
-        },
-        "node_modules/console-control-strings": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
-            "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4="
-        },
-        "node_modules/constantinople": {
-            "version": "3.1.2",
-            "resolved": "https://registry.npmjs.org/constantinople/-/constantinople-3.1.2.tgz",
-            "integrity": "sha512-yePcBqEFhLOqSBtwYOGGS1exHo/s1xjekXiinh4itpNQGCu4KA1euPh1fg07N2wMITZXQkBz75Ntdt1ctGZouw==",
-            "dependencies": {
-                "@types/babel-types": "^7.0.0",
-                "@types/babylon": "^6.16.2",
-                "babel-types": "^6.26.0",
-                "babylon": "^6.18.0"
-            }
-        },
-        "node_modules/constants-browserify": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
-            "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U=",
-            "dev": true
-        },
-        "node_modules/content-disposition": {
-            "version": "0.5.3",
-            "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.3.tgz",
-            "integrity": "sha512-ExO0774ikEObIAEV9kDo50o+79VCUdEB6n6lzKgGwupcVeRlhrj3qGAfwq8G6uBJjkqLrhT0qEYFcWng8z1z0g==",
-            "dependencies": {
-                "safe-buffer": "5.1.2"
-            },
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/content-type": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.4.tgz",
-            "integrity": "sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA==",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/convert-source-map": {
-            "version": "1.7.0",
-            "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.7.0.tgz",
-            "integrity": "sha512-4FJkXzKXEDB1snCFZlLP4gpC3JILicCpGbzG9f9G7tGqGCzETQ2hWPrcinA9oU4wtf2biUaEH5065UnMeR33oA==",
-            "dependencies": {
-                "safe-buffer": "~5.1.1"
-            }
-        },
-        "node_modules/cookie": {
-            "version": "0.4.0",
-            "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.0.tgz",
-            "integrity": "sha512-+Hp8fLp57wnUSt0tY0tHEXh4voZRDnoIrZPqlo3DPiI4y9lwg/jqx+1Om94/W6ZaPDOUbnjOt/99w66zk+l1Xg==",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/cookie-parser": {
-            "version": "1.4.5",
-            "resolved": "https://registry.npmjs.org/cookie-parser/-/cookie-parser-1.4.5.tgz",
-            "integrity": "sha512-f13bPUj/gG/5mDr+xLmSxxDsB9DQiTIfhJS/sqjrmfAWiAN+x2O4i/XguTL9yDZ+/IFDanJ+5x7hC4CXT9Tdzw==",
-            "dependencies": {
-                "cookie": "0.4.0",
-                "cookie-signature": "1.0.6"
-            },
-            "engines": {
-                "node": ">= 0.8.0"
-            }
-        },
-        "node_modules/cookie-session": {
-            "version": "2.0.0-rc.1",
-            "resolved": "https://registry.npmjs.org/cookie-session/-/cookie-session-2.0.0-rc.1.tgz",
-            "integrity": "sha512-zg80EsLe7S1J4y0XxV7SZ8Fbi90ZZoampuX2bfYDOvJfc//98sSlZC41YDzTTjtVbeU1VlVdBbldXOOyi5xzEw==",
-            "dependencies": {
-                "cookies": "0.8.0",
-                "debug": "3.2.6",
-                "on-headers": "~1.0.2",
-                "safe-buffer": "5.2.0"
-            },
-            "engines": {
-                "node": ">= 0.10"
-            }
-        },
-        "node_modules/cookie-session/node_modules/safe-buffer": {
-            "version": "5.2.0",
-            "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.0.tgz",
-            "integrity": "sha512-fZEwUGbVl7kouZs1jCdMLdt95hdIv0ZeHg6L7qPeciMZhZ+/gdesW4wgTARkrFWEpspjEATAzUGPG8N2jJiwbg=="
-        },
-        "node_modules/cookie-signature": {
-            "version": "1.0.6",
-            "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
-            "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
-        },
-        "node_modules/cookies": {
-            "version": "0.8.0",
-            "resolved": "https://registry.npmjs.org/cookies/-/cookies-0.8.0.tgz",
-            "integrity": "sha512-8aPsApQfebXnuI+537McwYsDtjVxGm8gTIzQI3FDW6t5t/DAhERxtnbEPN/8RX+uZthoz4eCOgloXaE5cYyNow==",
-            "dependencies": {
-                "depd": "~2.0.0",
-                "keygrip": "~1.1.0"
-            },
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/cookies/node_modules/depd": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
-            "integrity": "sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==",
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/copy-concurrently": {
-            "version": "1.0.5",
-            "resolved": "https://registry.npmjs.org/copy-concurrently/-/copy-concurrently-1.0.5.tgz",
-            "integrity": "sha512-f2domd9fsVDFtaFcbaRZuYXwtdmnzqbADSwhSWYxYB/Q8zsdUUFMXVRwXGDMWmbEzAn1kdRrtI1T/KTFOL4X2A==",
-            "dev": true,
-            "dependencies": {
-                "aproba": "^1.1.1",
-                "fs-write-stream-atomic": "^1.0.8",
-                "iferr": "^0.1.5",
-                "mkdirp": "^0.5.1",
-                "rimraf": "^2.5.4",
-                "run-queue": "^1.0.0"
-            }
-        },
-        "node_modules/copy-concurrently/node_modules/rimraf": {
-            "version": "2.7.1",
-            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-            "dev": true,
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/copy-descriptor": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/copy-descriptor/-/copy-descriptor-0.1.1.tgz",
-            "integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/copy-webpack-plugin": {
-            "version": "4.6.0",
-            "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-4.6.0.tgz",
-            "integrity": "sha512-Y+SQCF+0NoWQryez2zXn5J5knmr9z/9qSQt7fbL78u83rxmigOy8X5+BFn8CFSuX+nKT8gpYwJX68ekqtQt6ZA==",
-            "dev": true,
-            "dependencies": {
-                "cacache": "^10.0.4",
-                "find-cache-dir": "^1.0.0",
-                "globby": "^7.1.1",
-                "is-glob": "^4.0.0",
-                "loader-utils": "^1.1.0",
-                "minimatch": "^3.0.4",
-                "p-limit": "^1.0.0",
-                "serialize-javascript": "^1.4.0"
-            },
-            "engines": {
-                "node": ">= 4"
-            }
-        },
-        "node_modules/copy-webpack-plugin/node_modules/p-limit": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.3.0.tgz",
-            "integrity": "sha512-vvcXsLAJ9Dr5rQOPk7toZQZJApBl2K4J6dANSsEuh6QI41JYcsS/qhTGa9ErIUUgK3WNQoJYvylxvjqmiqEA9Q==",
-            "dev": true,
-            "dependencies": {
-                "p-try": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/copy-webpack-plugin/node_modules/p-try": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/p-try/-/p-try-1.0.0.tgz",
-            "integrity": "sha1-y8ec26+P1CKOE/Yh8rGiN8GyB7M=",
-            "dev": true,
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/core-js": {
-            "version": "1.2.7",
-            "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-            "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
-        },
-        "node_modules/core-js-pure": {
-            "version": "3.6.5",
-            "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.6.5.tgz",
-            "integrity": "sha512-lacdXOimsiD0QyNf9BC/mxivNJ/ybBGJXQFKzRekp1WTHoVUWsUHEn+2T8GJAzzIhyOuXA+gOxCVN3l+5PLPUA==",
-            "hasInstallScript": true
-        },
-        "node_modules/core-util-is": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
-            "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
-        },
-        "node_modules/cors": {
-            "version": "2.8.5",
-            "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
-            "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
-            "dependencies": {
-                "object-assign": "^4",
-                "vary": "^1"
-            },
-            "engines": {
-                "node": ">= 0.10"
-            }
-        },
-        "node_modules/cosmiconfig": {
-            "version": "6.0.0",
-            "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-6.0.0.tgz",
-            "integrity": "sha512-xb3ZL6+L8b9JLLCx3ZdoZy4+2ECphCMo2PwqgP1tlfVq6M6YReyzBJtvWWtbDSpNr9hn96pkCiZqUcFEc+54Qg==",
-            "dependencies": {
-                "@types/parse-json": "^4.0.0",
-                "import-fresh": "^3.1.0",
-                "parse-json": "^5.0.0",
-                "path-type": "^4.0.0",
-                "yaml": "^1.7.2"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/crc": {
-            "version": "3.8.0",
-            "resolved": "https://registry.npmjs.org/crc/-/crc-3.8.0.tgz",
-            "integrity": "sha512-iX3mfgcTMIq3ZKLIsVFAbv7+Mc10kxabAGQb8HvjA1o3T1PIYprbakQ65d3I+2HGHt6nSKkM9PYjgoJO2KcFBQ==",
-            "dependencies": {
-                "buffer": "^5.1.0"
-            }
-        },
-        "node_modules/crc32-stream": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/crc32-stream/-/crc32-stream-3.0.1.tgz",
-            "integrity": "sha512-mctvpXlbzsvK+6z8kJwSJ5crm7yBwrQMTybJzMw1O4lLGJqjlDCXY2Zw7KheiA6XBEcBmfLx1D88mjRGVJtY9w==",
-            "dependencies": {
-                "crc": "^3.4.4",
-                "readable-stream": "^3.4.0"
-            },
-            "engines": {
-                "node": ">= 6.9.0"
-            }
-        },
-        "node_modules/create-ecdh": {
-            "version": "4.0.4",
-            "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.4.tgz",
-            "integrity": "sha512-mf+TCx8wWc9VpuxfP2ht0iSISLZnt0JgWlrOKZiNqyUZWnjIaCIVNQArMHnCZKfEYRg6IM7A+NeJoN8gf/Ws0A==",
-            "dev": true,
-            "dependencies": {
-                "bn.js": "^4.1.0",
-                "elliptic": "^6.5.3"
-            }
-        },
-        "node_modules/create-ecdh/node_modules/bn.js": {
-            "version": "4.12.0",
-            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
-            "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==",
-            "dev": true
-        },
-        "node_modules/create-emotion": {
-            "version": "10.0.27",
-            "resolved": "https://registry.npmjs.org/create-emotion/-/create-emotion-10.0.27.tgz",
-            "integrity": "sha512-fIK73w82HPPn/RsAij7+Zt8eCE8SptcJ3WoRMfxMtjteYxud8GDTKKld7MYwAX2TVhrw29uR1N/bVGxeStHILg==",
-            "dependencies": {
-                "@emotion/cache": "^10.0.27",
-                "@emotion/serialize": "^0.11.15",
-                "@emotion/sheet": "0.9.4",
-                "@emotion/utils": "0.11.3"
-            }
-        },
-        "node_modules/create-error-class": {
-            "version": "3.0.2",
-            "resolved": "https://registry.npmjs.org/create-error-class/-/create-error-class-3.0.2.tgz",
-            "integrity": "sha1-Br56vvlHo/FKMP1hBnHUAbyot7Y=",
-            "dependencies": {
-                "capture-stack-trace": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/create-hash": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
-            "integrity": "sha512-z00bCGNHDG8mHAkP7CtT1qVu+bFQUPjYq/4Iv3C3kWjTFV10zIjfSoeqXo9Asws8gwSHDGj/hl2u4OGIjapeCg==",
-            "dev": true,
-            "dependencies": {
-                "cipher-base": "^1.0.1",
-                "inherits": "^2.0.1",
-                "md5.js": "^1.3.4",
-                "ripemd160": "^2.0.1",
-                "sha.js": "^2.4.0"
-            }
-        },
-        "node_modules/create-hmac": {
-            "version": "1.1.7",
-            "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz",
-            "integrity": "sha512-MJG9liiZ+ogc4TzUwuvbER1JRdgvUFSB5+VR/g5h82fGaIRWMWddtKBHi7/sVhfjQZ6SehlyhvQYrcYkaUIpLg==",
-            "dev": true,
-            "dependencies": {
-                "cipher-base": "^1.0.3",
-                "create-hash": "^1.1.0",
-                "inherits": "^2.0.1",
-                "ripemd160": "^2.0.0",
-                "safe-buffer": "^5.0.1",
-                "sha.js": "^2.4.8"
-            }
-        },
-        "node_modules/create-react-context": {
-            "version": "0.2.3",
-            "resolved": "https://registry.npmjs.org/create-react-context/-/create-react-context-0.2.3.tgz",
-            "integrity": "sha512-CQBmD0+QGgTaxDL3OX1IDXYqjkp2It4RIbcb99jS6AEg27Ga+a9G3JtK6SIu0HBwPLZlmwt9F7UwWA4Bn92Rag==",
-            "dependencies": {
-                "fbjs": "^0.8.0",
-                "gud": "^1.0.0"
-            }
-        },
-        "node_modules/cross-env": {
-            "version": "5.2.1",
-            "resolved": "https://registry.npmjs.org/cross-env/-/cross-env-5.2.1.tgz",
-            "integrity": "sha512-1yHhtcfAd1r4nwQgknowuUNfIT9E8dOMMspC36g45dN+iD1blloi7xp8X/xAIDnjHWyt1uQ8PHk2fkNaym7soQ==",
-            "dev": true,
-            "dependencies": {
-                "cross-spawn": "^6.0.5"
-            },
-            "bin": {
-                "cross-env": "dist/bin/cross-env.js",
-                "cross-env-shell": "dist/bin/cross-env-shell.js"
-            },
-            "engines": {
-                "node": ">=4.0"
-            }
-        },
-        "node_modules/cross-env/node_modules/cross-spawn": {
-            "version": "6.0.5",
-            "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
-            "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
-            "dev": true,
-            "dependencies": {
-                "nice-try": "^1.0.4",
-                "path-key": "^2.0.1",
-                "semver": "^5.5.0",
-                "shebang-command": "^1.2.0",
-                "which": "^1.2.9"
-            },
-            "engines": {
-                "node": ">=4.8"
-            }
-        },
-        "node_modules/cross-fetch": {
-            "version": "3.0.4",
-            "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-3.0.4.tgz",
-            "integrity": "sha512-MSHgpjQqgbT/94D4CyADeNoYh52zMkCX4pcJvPP5WqPsLFMKjr2TCMg381ox5qI0ii2dPwaLx/00477knXqXVw==",
-            "dependencies": {
-                "node-fetch": "2.6.0",
-                "whatwg-fetch": "3.0.0"
-            }
-        },
-        "node_modules/cross-fetch/node_modules/node-fetch": {
-            "version": "2.6.0",
-            "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.0.tgz",
-            "integrity": "sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA==",
-            "engines": {
-                "node": "4.x || >=6.0.0"
-            }
-        },
-        "node_modules/cross-spawn": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-3.0.1.tgz",
-            "integrity": "sha1-ElYDfsufDF9549bvE14wdwGEuYI=",
-            "dependencies": {
-                "lru-cache": "^4.0.1",
-                "which": "^1.2.9"
-            }
-        },
-        "node_modules/cross-spawn/node_modules/lru-cache": {
-            "version": "4.1.5",
-            "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.5.tgz",
-            "integrity": "sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==",
-            "dependencies": {
-                "pseudomap": "^1.0.2",
-                "yallist": "^2.1.2"
-            }
-        },
-        "node_modules/cross-spawn/node_modules/yallist": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz",
-            "integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI="
-        },
-        "node_modules/crypto-browserify": {
-            "version": "3.12.0",
-            "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.12.0.tgz",
-            "integrity": "sha512-fz4spIh+znjO2VjL+IdhEpRJ3YN6sMzITSBijk6FK2UvTqruSQW+/cCZTSNsMiZNvUeq0CqurF+dAbyiGOY6Wg==",
-            "dev": true,
-            "dependencies": {
-                "browserify-cipher": "^1.0.0",
-                "browserify-sign": "^4.0.0",
-                "create-ecdh": "^4.0.0",
-                "create-hash": "^1.1.0",
-                "create-hmac": "^1.1.0",
-                "diffie-hellman": "^5.0.0",
-                "inherits": "^2.0.1",
-                "pbkdf2": "^3.0.3",
-                "public-encrypt": "^4.0.0",
-                "randombytes": "^2.0.0",
-                "randomfill": "^1.0.3"
-            },
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/crypto-random-string": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz",
-            "integrity": "sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/css-box-model": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/css-box-model/-/css-box-model-1.2.1.tgz",
-            "integrity": "sha512-a7Vr4Q/kd/aw96bnJG332W9V9LkJO69JRcaCYDUqjp6/z0w6VcZjgAcTbgFxEPfBgdnAwlh3iwu+hLopa+flJw==",
-            "dependencies": {
-                "tiny-invariant": "^1.0.6"
-            }
-        },
-        "node_modules/css-color-keywords": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/css-color-keywords/-/css-color-keywords-1.0.0.tgz",
-            "integrity": "sha1-/qJhbcZ2spYmhrOvjb2+GAskTgU=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/css-in-js-utils": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-2.0.1.tgz",
-            "integrity": "sha512-PJF0SpJT+WdbVVt0AOYp9C8GnuruRlL/UFW7932nLWmFLQTaWEzTBQEx7/hn4BuV+WON75iAViSUJLiU3PKbpA==",
-            "dependencies": {
-                "hyphenate-style-name": "^1.0.2",
-                "isobject": "^3.0.1"
-            }
-        },
-        "node_modules/css-loader": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-2.1.1.tgz",
-            "integrity": "sha512-OcKJU/lt232vl1P9EEDamhoO9iKY3tIjY5GU+XDLblAykTdgs6Ux9P1hTHve8nFKy5KPpOXOsVI/hIwi3841+w==",
-            "dev": true,
-            "dependencies": {
-                "camelcase": "^5.2.0",
-                "icss-utils": "^4.1.0",
-                "loader-utils": "^1.2.3",
-                "normalize-path": "^3.0.0",
-                "postcss": "^7.0.14",
-                "postcss-modules-extract-imports": "^2.0.0",
-                "postcss-modules-local-by-default": "^2.0.6",
-                "postcss-modules-scope": "^2.1.0",
-                "postcss-modules-values": "^2.0.0",
-                "postcss-value-parser": "^3.3.0",
-                "schema-utils": "^1.0.0"
-            },
-            "engines": {
-                "node": ">= 6.9.0"
-            }
-        },
-        "node_modules/css-loader/node_modules/schema-utils": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
-            "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
-            "dev": true,
-            "dependencies": {
-                "ajv": "^6.1.0",
-                "ajv-errors": "^1.0.0",
-                "ajv-keywords": "^3.1.0"
-            },
-            "engines": {
-                "node": ">= 4"
-            }
-        },
-        "node_modules/css-select": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
-            "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg=",
-            "dependencies": {
-                "boolbase": "~1.0.0",
-                "css-what": "2.1",
-                "domutils": "1.5.1",
-                "nth-check": "~1.0.1"
-            }
-        },
-        "node_modules/css-select/node_modules/domutils": {
-            "version": "1.5.1",
-            "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
-            "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8=",
-            "dependencies": {
-                "dom-serializer": "0",
-                "domelementtype": "1"
-            }
-        },
-        "node_modules/css-to-react-native": {
-            "version": "2.3.2",
-            "resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-2.3.2.tgz",
-            "integrity": "sha512-VOFaeZA053BqvvvqIA8c9n0+9vFppVBAHCp6JgFTtTMU3Mzi+XnelJ9XC9ul3BqFzZyQ5N+H0SnwsWT2Ebchxw==",
-            "dependencies": {
-                "camelize": "^1.0.0",
-                "css-color-keywords": "^1.0.0",
-                "postcss-value-parser": "^3.3.0"
-            }
-        },
-        "node_modules/css-vendor": {
-            "version": "2.0.8",
-            "resolved": "https://registry.npmjs.org/css-vendor/-/css-vendor-2.0.8.tgz",
-            "integrity": "sha512-x9Aq0XTInxrkuFeHKbYC7zWY8ai7qJ04Kxd9MnvbC1uO5DagxoHQjm4JvG+vCdXOoFtCjbL2XSZfxmoYa9uQVQ==",
-            "dependencies": {
-                "@babel/runtime": "^7.8.3",
-                "is-in-browser": "^1.0.2"
-            }
-        },
-        "node_modules/css-what": {
-            "version": "2.1.3",
-            "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.3.tgz",
-            "integrity": "sha512-a+EPoD+uZiNfh+5fxw2nO9QwFa6nJe2Or35fGY6Ipw1R3R4AGz1d1TEZrCegvw2YTmZ0jXirGYlzxxpYSHwpEg==",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/cssesc": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
-            "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
-            "dev": true,
-            "bin": {
-                "cssesc": "bin/cssesc"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/cssom": {
-            "version": "0.4.4",
-            "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.4.4.tgz",
-            "integrity": "sha512-p3pvU7r1MyyqbTk+WbNJIgJjG2VmTIaB10rI93LzVPrmDJKkzKYMtxxyAvQXR/NS6otuzveI7+7BBq3SjBS2mw==",
-            "dev": true
-        },
-        "node_modules/cssstyle": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-2.2.0.tgz",
-            "integrity": "sha512-sEb3XFPx3jNnCAMtqrXPDeSgQr+jojtCeNf8cvMNMh1cG970+lljssvQDzPq6lmmJu2Vhqood/gtEomBiHOGnA==",
-            "dev": true,
-            "dependencies": {
-                "cssom": "~0.3.6"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/cssstyle/node_modules/cssom": {
-            "version": "0.3.8",
-            "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.3.8.tgz",
-            "integrity": "sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==",
-            "dev": true
-        },
-        "node_modules/csstype": {
-            "version": "2.6.10",
-            "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.10.tgz",
-            "integrity": "sha512-D34BqZU4cIlMCY93rZHbrq9pjTAQJ3U8S8rfBqjwHxkGPThWFjzZDQpgMJY0QViLxth6ZKYiwFBo14RdN44U/w=="
-        },
-        "node_modules/currently-unhandled": {
-            "version": "0.4.1",
-            "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
-            "integrity": "sha1-mI3zP+qxke95mmE2nddsF635V+o=",
-            "dependencies": {
-                "array-find-index": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/custom-event": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz",
-            "integrity": "sha1-XQKkaFCt8bSjF5RqOSj8y1v9BCU="
-        },
-        "node_modules/cyclist": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz",
-            "integrity": "sha1-WW6WmP0MgOEgOMK4LW6xs1tiJNk=",
-            "dev": true
-        },
-        "node_modules/d": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/d/-/d-1.0.1.tgz",
-            "integrity": "sha512-m62ShEObQ39CfralilEQRjH6oAMtNCV1xJyEx5LpRYUVN+EviphDgUc/F3hnYbADmkiNs67Y+3ylmlG7Lnu+FA==",
-            "dev": true,
-            "dependencies": {
-                "es5-ext": "^0.10.50",
-                "type": "^1.0.1"
-            }
-        },
-        "node_modules/d3-array": {
-            "version": "1.2.4",
-            "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-1.2.4.tgz",
-            "integrity": "sha512-KHW6M86R+FUPYGb3R5XiYjXPq7VzwxZ22buHhAEVG5ztoEcZZMLov530mmccaqA1GghZArjQV46fuc8kUqhhHw=="
-        },
-        "node_modules/d3-axis": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/d3-axis/-/d3-axis-2.0.0.tgz",
-            "integrity": "sha512-9nzB0uePtb+u9+dWir+HTuEAKJOEUYJoEwbJPsZ1B4K3iZUgzJcSENQ05Nj7S4CIfbZZ8/jQGoUzGKFznBhiiQ=="
-        },
-        "node_modules/d3-color": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-2.0.0.tgz",
-            "integrity": "sha512-SPXi0TSKPD4g9tw0NMZFnR95XVgUZiBH+uUTqQuDu1OsE2zomHU7ho0FISciaPvosimixwHFl3WHLGabv6dDgQ=="
-        },
-        "node_modules/d3-dispatch": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/d3-dispatch/-/d3-dispatch-2.0.0.tgz",
-            "integrity": "sha512-S/m2VsXI7gAti2pBoLClFFTMOO1HTtT0j99AuXLoGFKO6deHDdnv6ZGTxSTTUTgO1zVcv82fCOtDjYK4EECmWA=="
-        },
-        "node_modules/d3-drag": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/d3-drag/-/d3-drag-2.0.0.tgz",
-            "integrity": "sha512-g9y9WbMnF5uqB9qKqwIIa/921RYWzlUDv9Jl1/yONQwxbOfszAWTCm8u7HOTgJgRDXiRZN56cHT9pd24dmXs8w==",
-            "dependencies": {
-                "d3-dispatch": "1 - 2",
-                "d3-selection": "2"
-            }
-        },
-        "node_modules/d3-ease": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/d3-ease/-/d3-ease-2.0.0.tgz",
-            "integrity": "sha512-68/n9JWarxXkOWMshcT5IcjbB+agblQUaIsbnXmrzejn2O82n3p2A9R2zEB9HIEFWKFwPAEDDN8gR0VdSAyyAQ=="
-        },
-        "node_modules/d3-format": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-2.0.0.tgz",
-            "integrity": "sha512-Ab3S6XuE/Q+flY96HXT0jOXcM4EAClYFnRGY5zsjRGNy6qCYrQsMffs7cV5Q9xejb35zxW5hf/guKw34kvIKsA=="
-        },
-        "node_modules/d3-interpolate": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-2.0.1.tgz",
-            "integrity": "sha512-c5UhwwTs/yybcmTpAVqwSFl6vrQ8JZJoT5F7xNFK9pymv5C0Ymcc9/LIJHtYIggg/yS9YHw8i8O8tgb9pupjeQ==",
-            "dependencies": {
-                "d3-color": "1 - 2"
-            }
-        },
-        "node_modules/d3-path": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/d3-path/-/d3-path-2.0.0.tgz",
-            "integrity": "sha512-ZwZQxKhBnv9yHaiWd6ZU4x5BtCQ7pXszEV9CU6kRgwIQVQGLMv1oiL4M+MK/n79sYzsj+gcgpPQSctJUsLN7fA=="
-        },
-        "node_modules/d3-scale": {
-            "version": "3.2.3",
-            "resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-3.2.3.tgz",
-            "integrity": "sha512-8E37oWEmEzj57bHcnjPVOBS3n4jqakOeuv1EDdQSiSrYnMCBdMd3nc4HtKk7uia8DUHcY/CGuJ42xxgtEYrX0g==",
-            "dependencies": {
-                "d3-array": "^2.3.0",
-                "d3-format": "1 - 2",
-                "d3-interpolate": "1.2.0 - 2",
-                "d3-time": "1 - 2",
-                "d3-time-format": "2 - 3"
-            }
-        },
-        "node_modules/d3-scale/node_modules/d3-array": {
-            "version": "2.11.0",
-            "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-2.11.0.tgz",
-            "integrity": "sha512-26clcwmHQEdsLv34oNKq5Ia9tQ26Y/4HqS3dQzF42QBUqymZJ+9PORcN1G52bt37NsL2ABoX4lvyYZc+A9Y0zw==",
-            "dependencies": {
-                "internmap": "^1.0.0"
-            }
-        },
-        "node_modules/d3-selection": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/d3-selection/-/d3-selection-2.0.0.tgz",
-            "integrity": "sha512-XoGGqhLUN/W14NmaqcO/bb1nqjDAw5WtSYb2X8wiuQWvSZUsUVYsOSkOybUrNvcBjaywBdYPy03eXHMXjk9nZA=="
-        },
-        "node_modules/d3-shape": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-2.0.0.tgz",
-            "integrity": "sha512-djpGlA779ua+rImicYyyjnOjeubyhql1Jyn1HK0bTyawuH76UQRWXd+pftr67H6Fa8hSwetkgb/0id3agKWykw==",
-            "dependencies": {
-                "d3-path": "1 - 2"
-            }
-        },
-        "node_modules/d3-time": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-2.0.0.tgz",
-            "integrity": "sha512-2mvhstTFcMvwStWd9Tj3e6CEqtOivtD8AUiHT8ido/xmzrI9ijrUUihZ6nHuf/vsScRBonagOdj0Vv+SEL5G3Q=="
-        },
-        "node_modules/d3-time-format": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-3.0.0.tgz",
-            "integrity": "sha512-UXJh6EKsHBTjopVqZBhFysQcoXSv/5yLONZvkQ5Kk3qbwiUYkdX17Xa1PT6U1ZWXGGfB1ey5L8dKMlFq2DO0Ag==",
-            "dependencies": {
-                "d3-time": "1 - 2"
-            }
-        },
-        "node_modules/d3-timer": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/d3-timer/-/d3-timer-2.0.0.tgz",
-            "integrity": "sha512-TO4VLh0/420Y/9dO3+f9abDEFYeCUr2WZRlxJvbp4HPTQcSylXNiL6yZa9FIUvV1yRiFufl1bszTCLDqv9PWNA=="
-        },
-        "node_modules/d3-transition": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/d3-transition/-/d3-transition-2.0.0.tgz",
-            "integrity": "sha512-42ltAGgJesfQE3u9LuuBHNbGrI/AJjNL2OAUdclE70UE6Vy239GCBEYD38uBPoLeNsOhFStGpPI0BAOV+HMxog==",
-            "dependencies": {
-                "d3-color": "1 - 2",
-                "d3-dispatch": "1 - 2",
-                "d3-ease": "1 - 2",
-                "d3-interpolate": "1 - 2",
-                "d3-timer": "1 - 2"
-            }
-        },
-        "node_modules/d3-zoom": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/d3-zoom/-/d3-zoom-2.0.0.tgz",
-            "integrity": "sha512-fFg7aoaEm9/jf+qfstak0IYpnesZLiMX6GZvXtUSdv8RH2o4E2qeelgdU09eKS6wGuiGMfcnMI0nTIqWzRHGpw==",
-            "dependencies": {
-                "d3-dispatch": "1 - 2",
-                "d3-drag": "2",
-                "d3-interpolate": "1 - 2",
-                "d3-selection": "2",
-                "d3-transition": "2"
-            }
-        },
-        "node_modules/dashdash": {
-            "version": "1.14.1",
-            "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
-            "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
-            "dependencies": {
-                "assert-plus": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10"
-            }
-        },
-        "node_modules/data-urls": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-1.1.0.tgz",
-            "integrity": "sha512-YTWYI9se1P55u58gL5GkQHW4P6VJBJ5iBT+B5a7i2Tjadhv52paJG0qHX4A0OR6/t52odI64KP2YvFpkDOi3eQ==",
-            "dev": true,
-            "dependencies": {
-                "abab": "^2.0.0",
-                "whatwg-mimetype": "^2.2.0",
-                "whatwg-url": "^7.0.0"
-            }
-        },
-        "node_modules/date-fns": {
-            "version": "2.14.0",
-            "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.14.0.tgz",
-            "integrity": "sha512-1zD+68jhFgDIM0rF05rcwYO8cExdNqxjq4xP1QKM60Q45mnO6zaMWB4tOzrIr4M4GSLntsKeE4c9Bdl2jhL/yw=="
-        },
-        "node_modules/dateformat": {
-            "version": "1.0.12",
-            "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
-            "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk=",
-            "dev": true,
-            "dependencies": {
-                "get-stdin": "^4.0.1",
-                "meow": "^3.3.0"
-            },
-            "bin": {
-                "dateformat": "bin/cli.js"
-            },
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/dateformat/node_modules/get-stdin": {
-            "version": "4.0.1",
-            "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
-            "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/de-indent": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz",
-            "integrity": "sha1-sgOOhG3DO6pXlhKNCAS0VbjB4h0="
-        },
-        "node_modules/debounce": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/debounce/-/debounce-1.2.1.tgz",
-            "integrity": "sha512-XRRe6Glud4rd/ZGQfiV1ruXSfbvfJedlV9Y6zOlP+2K04vBYiJEte6stfFkCP03aMnY5tsipamumUjL14fofug=="
-        },
-        "node_modules/debug": {
-            "version": "3.2.6",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
-            "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/decamelize": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
-            "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/decode-uri-component": {
-            "version": "0.2.0",
-            "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz",
-            "integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU=",
-            "engines": {
-                "node": ">=0.10"
-            }
-        },
-        "node_modules/decompress-response": {
-            "version": "4.2.1",
-            "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-4.2.1.tgz",
-            "integrity": "sha512-jOSne2qbyE+/r8G1VU+G/82LBs2Fs4LAsTiLSHOCOMZQl2OKZ6i8i4IyHemTe+/yIXOtTcRQMzPcgyhoFlqPkw==",
-            "dependencies": {
-                "mimic-response": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/deep-eql": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-3.0.1.tgz",
-            "integrity": "sha512-+QeIQyN5ZuO+3Uk5DYh6/1eKO0m0YmJFGNmFHGACpf1ClL1nmlV/p4gNgbl2pJGxgXb4faqo6UE+M5ACEMyVcw==",
-            "dependencies": {
-                "type-detect": "^4.0.0"
-            },
-            "engines": {
-                "node": ">=0.12"
-            }
-        },
-        "node_modules/deep-equal": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.1.1.tgz",
-            "integrity": "sha512-yd9c5AdiqVcR+JjcwUQb9DkhJc8ngNr0MahEBGvDiJw8puWab2yZlh+nkasOnZP+EGTAP6rRp2JzJhJZzvNF8g==",
-            "dependencies": {
-                "is-arguments": "^1.0.4",
-                "is-date-object": "^1.0.1",
-                "is-regex": "^1.0.4",
-                "object-is": "^1.0.1",
-                "object-keys": "^1.1.1",
-                "regexp.prototype.flags": "^1.2.0"
-            }
-        },
-        "node_modules/deep-extend": {
-            "version": "0.6.0",
-            "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.6.0.tgz",
-            "integrity": "sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==",
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/deep-is": {
-            "version": "0.1.3",
-            "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
-            "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ=",
-            "dev": true
-        },
-        "node_modules/deepmerge": {
-            "version": "2.2.1",
-            "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-2.2.1.tgz",
-            "integrity": "sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/default-gateway": {
-            "version": "4.2.0",
-            "resolved": "https://registry.npmjs.org/default-gateway/-/default-gateway-4.2.0.tgz",
-            "integrity": "sha512-h6sMrVB1VMWVrW13mSc6ia/DwYYw5MN6+exNu1OaJeFac5aSAvwM7lZ0NVfTABuSkQelr4h5oebg3KB1XPdjgA==",
-            "dev": true,
-            "dependencies": {
-                "execa": "^1.0.0",
-                "ip-regex": "^2.1.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/default-gateway/node_modules/cross-spawn": {
-            "version": "6.0.5",
-            "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
-            "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
-            "dev": true,
-            "dependencies": {
-                "nice-try": "^1.0.4",
-                "path-key": "^2.0.1",
-                "semver": "^5.5.0",
-                "shebang-command": "^1.2.0",
-                "which": "^1.2.9"
-            },
-            "engines": {
-                "node": ">=4.8"
-            }
-        },
-        "node_modules/default-gateway/node_modules/execa": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/execa/-/execa-1.0.0.tgz",
-            "integrity": "sha512-adbxcyWV46qiHyvSp50TKt05tB4tK3HcmF7/nxfAdhnox83seTDbwnaqKO4sXRy7roHAIFqJP/Rw/AuEbX61LA==",
-            "dev": true,
-            "dependencies": {
-                "cross-spawn": "^6.0.0",
-                "get-stream": "^4.0.0",
-                "is-stream": "^1.1.0",
-                "npm-run-path": "^2.0.0",
-                "p-finally": "^1.0.0",
-                "signal-exit": "^3.0.0",
-                "strip-eof": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/default-gateway/node_modules/get-stream": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-4.1.0.tgz",
-            "integrity": "sha512-GMat4EJ5161kIy2HevLlr4luNjBgvmj413KaQA7jt4V8B4RDsfpHk7WQ9GVqfYyyx8OS/L66Kox+rJRNklLK7w==",
-            "dev": true,
-            "dependencies": {
-                "pump": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/define-properties": {
-            "version": "1.1.3",
-            "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.3.tgz",
-            "integrity": "sha512-3MqfYKj2lLzdMSf8ZIZE/V+Zuy+BgD6f164e8K2w7dgnpKArBDerGYpM46IYYcjnkdPNMjPk9A6VFB8+3SKlXQ==",
-            "dependencies": {
-                "object-keys": "^1.0.12"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/define-property": {
-            "version": "2.0.2",
-            "resolved": "https://registry.npmjs.org/define-property/-/define-property-2.0.2.tgz",
-            "integrity": "sha512-jwK2UV4cnPpbcG7+VRARKTZPUWowwXA8bzH5NP6ud0oeAxyYPuGZUAC7hMugpCdz4BeSZl2Dl9k66CHJ/46ZYQ==",
-            "dependencies": {
-                "is-descriptor": "^1.0.2",
-                "isobject": "^3.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/define-property/node_modules/is-accessor-descriptor": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-1.0.0.tgz",
-            "integrity": "sha512-m5hnHTkcVsPfqx3AKlyttIPb7J+XykHvJP2B9bZDjlhLIoEq4XoK64Vg7boZlVWYK6LUY94dYPEE7Lh0ZkZKcQ==",
-            "dependencies": {
-                "kind-of": "^6.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/define-property/node_modules/is-data-descriptor": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-1.0.0.tgz",
-            "integrity": "sha512-jbRXy1FmtAoCjQkVmIVYwuuqDFUbaOeDjmed1tOGPrsMhtJA4rD9tkgA0F1qJ3gRFRXcHYVkdeaP50Q5rE/jLQ==",
-            "dependencies": {
-                "kind-of": "^6.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/define-property/node_modules/is-descriptor": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.2.tgz",
-            "integrity": "sha512-2eis5WqQGV7peooDyLmNEPUrps9+SXX5c9pL3xEB+4e9HnGuDa7mB7kHxHw4CbqS9k1T2hOH3miL8n8WtiYVtg==",
-            "dependencies": {
-                "is-accessor-descriptor": "^1.0.0",
-                "is-data-descriptor": "^1.0.0",
-                "kind-of": "^6.0.2"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/del": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/del/-/del-4.1.1.tgz",
-            "integrity": "sha512-QwGuEUouP2kVwQenAsOof5Fv8K9t3D8Ca8NxcXKrIpEHjTXK5J2nXLdP+ALI1cgv8wj7KuwBhTwBkOZSJKM5XQ==",
-            "dev": true,
-            "dependencies": {
-                "@types/glob": "^7.1.1",
-                "globby": "^6.1.0",
-                "is-path-cwd": "^2.0.0",
-                "is-path-in-cwd": "^2.0.0",
-                "p-map": "^2.0.0",
-                "pify": "^4.0.1",
-                "rimraf": "^2.6.3"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/del/node_modules/globby": {
-            "version": "6.1.0",
-            "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
-            "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
-            "dev": true,
-            "dependencies": {
-                "array-union": "^1.0.1",
-                "glob": "^7.0.3",
-                "object-assign": "^4.0.1",
-                "pify": "^2.0.0",
-                "pinkie-promise": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/del/node_modules/globby/node_modules/pify": {
-            "version": "2.3.0",
-            "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-            "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/del/node_modules/rimraf": {
-            "version": "2.7.1",
-            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-            "dev": true,
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/delayed-stream": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
-            "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/delegates": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
-            "integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o="
-        },
-        "node_modules/denque": {
-            "version": "1.4.1",
-            "resolved": "https://registry.npmjs.org/denque/-/denque-1.4.1.tgz",
-            "integrity": "sha512-OfzPuSZKGcgr96rf1oODnfjqBFmr1DVoc/TrItj3Ohe0Ah1C5WX5Baquw/9U9KovnQ88EqmJbD66rKYUQYN1tQ==",
-            "engines": {
-                "node": ">=0.10"
-            }
-        },
-        "node_modules/depcheck": {
-            "version": "0.9.2",
-            "resolved": "https://registry.npmjs.org/depcheck/-/depcheck-0.9.2.tgz",
-            "integrity": "sha512-w5f+lSZqLJJkk58s44eOd0Vor7hLZot4PlFL0y2JsIX5LuHQ2eAjHlDVeGBD4Mj6ZQSKakvKWRRCcPlvrdU2Sg==",
-            "dependencies": {
-                "@babel/parser": "^7.7.7",
-                "@babel/traverse": "^7.7.4",
-                "builtin-modules": "^3.0.0",
-                "camelcase": "^5.3.1",
-                "cosmiconfig": "^5.2.1",
-                "debug": "^4.1.1",
-                "deps-regex": "^0.1.4",
-                "js-yaml": "^3.4.2",
-                "lodash": "^4.17.15",
-                "minimatch": "^3.0.2",
-                "node-sass-tilde-importer": "^1.0.2",
-                "please-upgrade-node": "^3.2.0",
-                "require-package-name": "^2.0.1",
-                "resolve": "^1.14.1",
-                "vue-template-compiler": "^2.6.11",
-                "walkdir": "^0.4.1",
-                "yargs": "^15.0.2"
-            },
-            "bin": {
-                "depcheck": "bin/depcheck.js"
-            },
-            "engines": {
-                "node": ">=10"
-            }
-        },
-        "node_modules/depcheck/node_modules/ansi-regex": {
-            "version": "5.0.0",
-            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.0.tgz",
-            "integrity": "sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg==",
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/depcheck/node_modules/ansi-styles": {
-            "version": "4.2.1",
-            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.2.1.tgz",
-            "integrity": "sha512-9VGjrMsG1vePxcSweQsN20KY/c4zN0h9fLjqAbwbPfahM3t+NL+M9HC8xeXG2I8pX5NoamTGNuomEUFI7fcUjA==",
-            "dependencies": {
-                "@types/color-name": "^1.1.1",
-                "color-convert": "^2.0.1"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/depcheck/node_modules/builtin-modules": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-3.1.0.tgz",
-            "integrity": "sha512-k0KL0aWZuBt2lrxrcASWDfwOLMnodeQjodT/1SxEQAXsHANgo6ZC/VEaSEHCXt7aSTZ4/4H5LKa+tBXmW7Vtvw==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/depcheck/node_modules/cliui": {
-            "version": "6.0.0",
-            "resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz",
-            "integrity": "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==",
-            "dependencies": {
-                "string-width": "^4.2.0",
-                "strip-ansi": "^6.0.0",
-                "wrap-ansi": "^6.2.0"
-            }
-        },
-        "node_modules/depcheck/node_modules/color-convert": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
-            "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-            "dependencies": {
-                "color-name": "~1.1.4"
-            },
-            "engines": {
-                "node": ">=7.0.0"
-            }
-        },
-        "node_modules/depcheck/node_modules/color-name": {
-            "version": "1.1.4",
-            "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-            "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
-        },
-        "node_modules/depcheck/node_modules/cosmiconfig": {
-            "version": "5.2.1",
-            "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-5.2.1.tgz",
-            "integrity": "sha512-H65gsXo1SKjf8zmrJ67eJk8aIRKV5ff2D4uKZIBZShbhGSpEmsQOPW/SKMKYhSTrqR7ufy6RP69rPogdaPh/kA==",
-            "dependencies": {
-                "import-fresh": "^2.0.0",
-                "is-directory": "^0.3.1",
-                "js-yaml": "^3.13.1",
-                "parse-json": "^4.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/depcheck/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/depcheck/node_modules/emoji-regex": {
-            "version": "8.0.0",
-            "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
-            "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
-        },
-        "node_modules/depcheck/node_modules/find-up": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
-            "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
-            "dependencies": {
-                "locate-path": "^5.0.0",
-                "path-exists": "^4.0.0"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/depcheck/node_modules/import-fresh": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-2.0.0.tgz",
-            "integrity": "sha1-2BNVwVYS04bGH53dOSLUMEgipUY=",
-            "dependencies": {
-                "caller-path": "^2.0.0",
-                "resolve-from": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/depcheck/node_modules/is-fullwidth-code-point": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
-            "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/depcheck/node_modules/locate-path": {
-            "version": "5.0.0",
-            "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
-            "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
-            "dependencies": {
-                "p-locate": "^4.1.0"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/depcheck/node_modules/p-locate": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
-            "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
-            "dependencies": {
-                "p-limit": "^2.2.0"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/depcheck/node_modules/parse-json": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-4.0.0.tgz",
-            "integrity": "sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA=",
-            "dependencies": {
-                "error-ex": "^1.3.1",
-                "json-parse-better-errors": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/depcheck/node_modules/path-exists": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
-            "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/depcheck/node_modules/resolve-from": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-3.0.0.tgz",
-            "integrity": "sha1-six699nWiBvItuZTM17rywoYh0g=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/depcheck/node_modules/string-width": {
-            "version": "4.2.0",
-            "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.0.tgz",
-            "integrity": "sha512-zUz5JD+tgqtuDjMhwIg5uFVV3dtqZ9yQJlZVfq4I01/K5Paj5UHj7VyrQOJvzawSVlKpObApbfD0Ed6yJc+1eg==",
-            "dependencies": {
-                "emoji-regex": "^8.0.0",
-                "is-fullwidth-code-point": "^3.0.0",
-                "strip-ansi": "^6.0.0"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/depcheck/node_modules/strip-ansi": {
-            "version": "6.0.0",
-            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.0.tgz",
-            "integrity": "sha512-AuvKTrTfQNYNIctbR1K/YGTR1756GycPsg7b9bdV9Duqur4gv6aKqHXah67Z8ImS7WEz5QVcOtlfW2rZEugt6w==",
-            "dependencies": {
-                "ansi-regex": "^5.0.0"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/depcheck/node_modules/wrap-ansi": {
-            "version": "6.2.0",
-            "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
-            "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
-            "dependencies": {
-                "ansi-styles": "^4.0.0",
-                "string-width": "^4.1.0",
-                "strip-ansi": "^6.0.0"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/depcheck/node_modules/yargs": {
-            "version": "15.3.1",
-            "resolved": "https://registry.npmjs.org/yargs/-/yargs-15.3.1.tgz",
-            "integrity": "sha512-92O1HWEjw27sBfgmXiixJWT5hRBp2eobqXicLtPBIDBhYB+1HpwZlXmbW2luivBJHBzki+7VyCLRtAkScbTBQA==",
-            "dependencies": {
-                "cliui": "^6.0.0",
-                "decamelize": "^1.2.0",
-                "find-up": "^4.1.0",
-                "get-caller-file": "^2.0.1",
-                "require-directory": "^2.1.1",
-                "require-main-filename": "^2.0.0",
-                "set-blocking": "^2.0.0",
-                "string-width": "^4.2.0",
-                "which-module": "^2.0.0",
-                "y18n": "^4.0.0",
-                "yargs-parser": "^18.1.1"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/depcheck/node_modules/yargs-parser": {
-            "version": "18.1.3",
-            "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-18.1.3.tgz",
-            "integrity": "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==",
-            "dependencies": {
-                "camelcase": "^5.0.0",
-                "decamelize": "^1.2.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/depd": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.2.tgz",
-            "integrity": "sha1-m81S4UwJd2PnSbJ0xDRu0uVgtak=",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/deps-regex": {
-            "version": "0.1.4",
-            "resolved": "https://registry.npmjs.org/deps-regex/-/deps-regex-0.1.4.tgz",
-            "integrity": "sha1-UYZnt2kUYKXn4KNBvnbrfOgJAYQ="
-        },
-        "node_modules/des.js": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.1.tgz",
-            "integrity": "sha512-Q0I4pfFrv2VPd34/vfLrFOoRmlYj3OV50i7fskps1jZWK1kApMWWT9G6RRUeYedLcBDIhnSDaUvJMb3AhUlaEA==",
-            "dev": true,
-            "dependencies": {
-                "inherits": "^2.0.1",
-                "minimalistic-assert": "^1.0.0"
-            }
-        },
-        "node_modules/destroy": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
-            "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA="
-        },
-        "node_modules/detect-file": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-1.0.0.tgz",
-            "integrity": "sha1-8NZtA2cqglyxtzvbP+YjEMjlUrc=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/detect-libc": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz",
-            "integrity": "sha1-+hN8S9aY7fVc1c0CrFWfkaTEups=",
-            "bin": {
-                "detect-libc": "bin/detect-libc.js"
-            },
-            "engines": {
-                "node": ">=0.10"
-            }
-        },
-        "node_modules/detect-node": {
-            "version": "2.0.4",
-            "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.4.tgz",
-            "integrity": "sha512-ZIzRpLJrOj7jjP2miAtgqIfmzbxa4ZOr5jJc601zklsfEx9oTzmmj2nVpIPRpNlRTIh8lc1kyViIY7BWSGNmKw==",
-            "dev": true
-        },
-        "node_modules/diff": {
-            "version": "3.5.0",
-            "resolved": "https://registry.npmjs.org/diff/-/diff-3.5.0.tgz",
-            "integrity": "sha512-A46qtFgd+g7pDZinpnwiRJtxbC1hpgf0uzP3iG89scHk0AUC7A1TGxf5OiiOUv/JMZR8GOt8hL900hV0bOy5xA==",
-            "engines": {
-                "node": ">=0.3.1"
-            }
-        },
-        "node_modules/diff-match-patch": {
-            "version": "1.0.5",
-            "resolved": "https://registry.npmjs.org/diff-match-patch/-/diff-match-patch-1.0.5.tgz",
-            "integrity": "sha512-IayShXAgj/QMXgB0IWmKx+rOPuGMhqm5w6jvFxmVenXKIzRqTAAsbBPT3kWQeGANj3jGgvcvv4yK6SxqYmikgw=="
-        },
-        "node_modules/diffie-hellman": {
-            "version": "5.0.3",
-            "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
-            "integrity": "sha512-kqag/Nl+f3GwyK25fhUMYj81BUOrZ9IuJsjIcDE5icNM9FJHAVm3VcUDxdLPoQtTuUylWm6ZIknYJwwaPxsUzg==",
-            "dev": true,
-            "dependencies": {
-                "bn.js": "^4.1.0",
-                "miller-rabin": "^4.0.0",
-                "randombytes": "^2.0.0"
-            }
-        },
-        "node_modules/diffie-hellman/node_modules/bn.js": {
-            "version": "4.12.0",
-            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
-            "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==",
-            "dev": true
-        },
-        "node_modules/dir-glob": {
-            "version": "2.2.2",
-            "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-2.2.2.tgz",
-            "integrity": "sha512-f9LBi5QWzIW3I6e//uxZoLBlUt9kcp66qo0sSCxL6YZKc75R1c4MFCoe/LaZiBGmgujvQdxc5Bn3QhfyvK5Hsw==",
-            "dev": true,
-            "dependencies": {
-                "path-type": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/dir-glob/node_modules/path-type": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/path-type/-/path-type-3.0.0.tgz",
-            "integrity": "sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==",
-            "dev": true,
-            "dependencies": {
-                "pify": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/dir-glob/node_modules/pify": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
-            "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=",
-            "dev": true,
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/dns-equal": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/dns-equal/-/dns-equal-1.0.0.tgz",
-            "integrity": "sha1-s55/HabrCnW6nBcySzR1PEfgZU0=",
-            "dev": true
-        },
-        "node_modules/dns-packet": {
-            "version": "1.3.1",
-            "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.1.tgz",
-            "integrity": "sha512-0UxfQkMhYAUaZI+xrNZOz/as5KgDU0M/fQ9b6SpkyLbk3GEswDi6PADJVaYJradtRVsRIlF1zLyOodbcTCDzUg==",
-            "dev": true,
-            "dependencies": {
-                "ip": "^1.1.0",
-                "safe-buffer": "^5.0.1"
-            }
-        },
-        "node_modules/dns-txt": {
-            "version": "2.0.2",
-            "resolved": "https://registry.npmjs.org/dns-txt/-/dns-txt-2.0.2.tgz",
-            "integrity": "sha1-uR2Ab10nGI5Ks+fRB9iBocxGQrY=",
-            "dev": true,
-            "dependencies": {
-                "buffer-indexof": "^1.0.0"
-            }
-        },
-        "node_modules/doctypes": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/doctypes/-/doctypes-1.1.0.tgz",
-            "integrity": "sha1-6oCxBqh1OHdOijpKWv4pPeSJ4Kk="
-        },
-        "node_modules/dom-helpers": {
-            "version": "3.4.0",
-            "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.4.0.tgz",
-            "integrity": "sha512-LnuPJ+dwqKDIyotW1VzmOZ5TONUN7CwkCR5hrgawTUbkBGYdeoNLZo6nNfGkCrjtE1nXXaj7iMMpDa8/d9WoIA==",
-            "dependencies": {
-                "@babel/runtime": "^7.1.2"
-            }
-        },
-        "node_modules/dom-serializer": {
-            "version": "0.2.2",
-            "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.2.2.tgz",
-            "integrity": "sha512-2/xPb3ORsQ42nHYiSunXkDjPLBaEj/xTwUO4B7XCZQTRk7EBtTOPaygh10YAAh2OI1Qrp6NWfpAhzswj0ydt9g==",
-            "dependencies": {
-                "domelementtype": "^2.0.1",
-                "entities": "^2.0.0"
-            }
-        },
-        "node_modules/dom-serializer/node_modules/domelementtype": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.0.1.tgz",
-            "integrity": "sha512-5HOHUDsYZWV8FGWN0Njbr/Rn7f/eWSQi1v7+HsUVwXgn8nWWlL64zKDkS0n8ZmQ3mlWOMuXOnR+7Nx/5tMO5AQ=="
-        },
-        "node_modules/dom-serializer/node_modules/entities": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/entities/-/entities-2.0.0.tgz",
-            "integrity": "sha512-D9f7V0JSRwIxlRI2mjMqufDrRDnx8p+eEOz7aUM9SuvF8gsBzra0/6tbjl1m8eQHrZlYj6PxqE00hZ1SAIKPLw=="
-        },
-        "node_modules/domain-browser": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.2.0.tgz",
-            "integrity": "sha512-jnjyiM6eRyZl2H+W8Q/zLMA481hzi0eszAaBUzIVnmYVDBbnLxVNnfu1HgEBvCbL+71FrxMl3E6lpKH7Ge3OXA==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.4",
-                "npm": ">=1.2"
-            }
-        },
-        "node_modules/domelementtype": {
-            "version": "1.3.1",
-            "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.1.tgz",
-            "integrity": "sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w=="
-        },
-        "node_modules/domexception": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/domexception/-/domexception-1.0.1.tgz",
-            "integrity": "sha512-raigMkn7CJNNo6Ihro1fzG7wr3fHuYVytzquZKX5n0yizGsTcYgzdIUwj1X9pK0VvjeihV+XiclP+DjwbsSKug==",
-            "dev": true,
-            "dependencies": {
-                "webidl-conversions": "^4.0.2"
-            }
-        },
-        "node_modules/domhandler": {
-            "version": "2.4.2",
-            "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.2.tgz",
-            "integrity": "sha512-JiK04h0Ht5u/80fdLMCEmV4zkNh2BcoMFBmZ/91WtYZ8qVXSKjiw7fXMgFPnHcSZgOo3XdinHvmnDUeMf5R4wA==",
-            "dependencies": {
-                "domelementtype": "1"
-            }
-        },
-        "node_modules/domutils": {
-            "version": "1.7.0",
-            "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.7.0.tgz",
-            "integrity": "sha512-Lgd2XcJ/NjEw+7tFvfKxOzCYKZsdct5lczQ2ZaQY8Djz7pfAD3Gbp8ySJWtreII/vDlMVmxwa6pHmdxIYgttDg==",
-            "dependencies": {
-                "dom-serializer": "0",
-                "domelementtype": "1"
-            }
-        },
-        "node_modules/dot-prop": {
-            "version": "4.2.0",
-            "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.2.0.tgz",
-            "integrity": "sha512-tUMXrxlExSW6U2EXiiKGSBVdYgtV8qlHL+C10TsW4PURY/ic+eaysnSkwB4kA/mBlCyy/IKDJ+Lc3wbWeaXtuQ==",
-            "dependencies": {
-                "is-obj": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/dotenv": {
-            "version": "8.2.0",
-            "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.2.0.tgz",
-            "integrity": "sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw==",
-            "dev": true,
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/double-bits": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/double-bits/-/double-bits-1.1.1.tgz",
-            "integrity": "sha1-WKu6RUlNpND6Nrc60RoobJGEscY="
-        },
-        "node_modules/duplexer3": {
-            "version": "0.1.4",
-            "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz",
-            "integrity": "sha1-7gHdHKwO08vH/b6jfcCo8c4ALOI="
-        },
-        "node_modules/duplexify": {
-            "version": "3.7.1",
-            "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.7.1.tgz",
-            "integrity": "sha512-07z8uv2wMyS51kKhD1KsdXJg5WQ6t93RneqRxUHnskXVtlYYkLqM0gqStQZ3pj073g687jPCHrqNfCzawLYh5g==",
-            "dev": true,
-            "dependencies": {
-                "end-of-stream": "^1.0.0",
-                "inherits": "^2.0.1",
-                "readable-stream": "^2.0.0",
-                "stream-shift": "^1.0.0"
-            }
-        },
-        "node_modules/duplexify/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/dynamic-dedupe": {
-            "version": "0.3.0",
-            "resolved": "https://registry.npmjs.org/dynamic-dedupe/-/dynamic-dedupe-0.3.0.tgz",
-            "integrity": "sha1-BuRMIj9eTpTXjvnbI6ZRXOL5YqE=",
-            "dev": true,
-            "dependencies": {
-                "xtend": "^4.0.0"
-            }
-        },
-        "node_modules/ecc-jsbn": {
-            "version": "0.1.2",
-            "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.2.tgz",
-            "integrity": "sha1-OoOpBOVDUyh4dMVkt1SThoSamMk=",
-            "dependencies": {
-                "jsbn": "~0.1.0",
-                "safer-buffer": "^2.1.0"
-            }
-        },
-        "node_modules/ecdsa-sig-formatter": {
-            "version": "1.0.11",
-            "resolved": "https://registry.npmjs.org/ecdsa-sig-formatter/-/ecdsa-sig-formatter-1.0.11.tgz",
-            "integrity": "sha512-nagl3RYrbNv6kQkeJIpt6NJZy8twLB/2vtz6yN9Z4vRKHN4/QZJIEbqohALSgwKdnksuY3k5Addp5lg8sVoVcQ==",
-            "dependencies": {
-                "safe-buffer": "^5.0.1"
-            }
-        },
-        "node_modules/ee-first": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
-            "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
-        },
-        "node_modules/elliptic": {
-            "version": "6.5.4",
-            "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.4.tgz",
-            "integrity": "sha512-iLhC6ULemrljPZb+QutR5TQGB+pdW6KGD5RSegS+8sorOZT+rdQFbsQFJgvN3eRqNALqJer4oQ16YvJHlU8hzQ==",
-            "dev": true,
-            "dependencies": {
-                "bn.js": "^4.11.9",
-                "brorand": "^1.1.0",
-                "hash.js": "^1.0.0",
-                "hmac-drbg": "^1.0.1",
-                "inherits": "^2.0.4",
-                "minimalistic-assert": "^1.0.1",
-                "minimalistic-crypto-utils": "^1.0.1"
-            }
-        },
-        "node_modules/elliptic/node_modules/bn.js": {
-            "version": "4.12.0",
-            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
-            "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==",
-            "dev": true
-        },
-        "node_modules/emoji-regex": {
-            "version": "7.0.3",
-            "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-7.0.3.tgz",
-            "integrity": "sha512-CwBLREIQ7LvYFB0WyRvwhq5N5qPhc6PMjD6bYggFlI5YyDgl+0vxq5VHbMOFqLg7hfWzmu8T5Z1QofhmTIhItA=="
-        },
-        "node_modules/emojis-list": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz",
-            "integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==",
-            "engines": {
-                "node": ">= 4"
-            }
-        },
-        "node_modules/emotion": {
-            "version": "10.0.27",
-            "resolved": "https://registry.npmjs.org/emotion/-/emotion-10.0.27.tgz",
-            "integrity": "sha512-2xdDzdWWzue8R8lu4G76uWX5WhyQuzATon9LmNeCy/2BHVC6dsEpfhN1a0qhELgtDVdjyEA6J8Y/VlI5ZnaH0g==",
-            "dependencies": {
-                "babel-plugin-emotion": "^10.0.27",
-                "create-emotion": "^10.0.27"
-            }
-        },
-        "node_modules/encodeurl": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
-            "integrity": "sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k=",
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/encoding": {
-            "version": "0.1.12",
-            "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz",
-            "integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s=",
-            "dependencies": {
-                "iconv-lite": "~0.4.13"
-            }
-        },
-        "node_modules/end-of-stream": {
-            "version": "1.4.4",
-            "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz",
-            "integrity": "sha512-+uw1inIHVPQoaVuHzRyXd21icM+cnt4CzD5rW+NC1wjOUSTOs+Te7FOv7AhN7vS9x/oIyhLP5PR1H+phQAHu5Q==",
-            "dependencies": {
-                "once": "^1.4.0"
-            }
-        },
-        "node_modules/engine.io": {
-            "version": "3.4.1",
-            "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-3.4.1.tgz",
-            "integrity": "sha512-8MfIfF1/IIfxuc2gv5K+XlFZczw/BpTvqBdl0E2fBLkYQp4miv4LuDTVtYt4yMyaIFLEr4vtaSgV4mjvll8Crw==",
-            "dependencies": {
-                "accepts": "~1.3.4",
-                "base64id": "2.0.0",
-                "cookie": "0.3.1",
-                "debug": "~4.1.0",
-                "engine.io-parser": "~2.2.0",
-                "ws": "^7.1.2"
-            },
-            "engines": {
-                "node": ">=8.0.0"
-            }
-        },
-        "node_modules/engine.io-client": {
-            "version": "3.4.1",
-            "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-3.4.1.tgz",
-            "integrity": "sha512-RJNmA+A9Js+8Aoq815xpGAsgWH1VoSYM//2VgIiu9lNOaHFfLpTjH4tOzktBpjIs5lvOfiNY1dwf+NuU6D38Mw==",
-            "dependencies": {
-                "component-emitter": "1.2.1",
-                "component-inherit": "0.0.3",
-                "debug": "~4.1.0",
-                "engine.io-parser": "~2.2.0",
-                "has-cors": "1.1.0",
-                "indexof": "0.0.1",
-                "parseqs": "0.0.5",
-                "parseuri": "0.0.5",
-                "ws": "~6.1.0",
-                "xmlhttprequest-ssl": "~1.5.4",
-                "yeast": "0.1.2"
-            }
-        },
-        "node_modules/engine.io-client/node_modules/component-emitter": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
-            "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
-        },
-        "node_modules/engine.io-client/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/engine.io-client/node_modules/ws": {
-            "version": "6.1.4",
-            "resolved": "https://registry.npmjs.org/ws/-/ws-6.1.4.tgz",
-            "integrity": "sha512-eqZfL+NE/YQc1/ZynhojeV8q+H050oR8AZ2uIev7RU10svA9ZnJUddHcOUZTJLinZ9yEfdA2kSATS2qZK5fhJA==",
-            "dependencies": {
-                "async-limiter": "~1.0.0"
-            }
-        },
-        "node_modules/engine.io-parser": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-2.2.0.tgz",
-            "integrity": "sha512-6I3qD9iUxotsC5HEMuuGsKA0cXerGz+4uGcXQEkfBidgKf0amsjrrtwcbwK/nzpZBxclXlV7gGl9dgWvu4LF6w==",
-            "dependencies": {
-                "after": "0.8.2",
-                "arraybuffer.slice": "~0.0.7",
-                "base64-arraybuffer": "0.1.5",
-                "blob": "0.0.5",
-                "has-binary2": "~1.0.2"
-            }
-        },
-        "node_modules/engine.io/node_modules/cookie": {
-            "version": "0.3.1",
-            "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz",
-            "integrity": "sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s=",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/engine.io/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/enhanced-resolve": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-4.1.1.tgz",
-            "integrity": "sha512-98p2zE+rL7/g/DzMHMTF4zZlCgeVdJ7yr6xzEpJRYwFYrGi9ANdn5DnJURg6RpBkyk60XYDnWIv51VfIhfNGuA==",
-            "dev": true,
-            "dependencies": {
-                "graceful-fs": "^4.1.2",
-                "memory-fs": "^0.5.0",
-                "tapable": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=6.9.0"
-            }
-        },
-        "node_modules/entities": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.2.tgz",
-            "integrity": "sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w=="
-        },
-        "node_modules/equation-editor-react": {
-            "resolved": "git+ssh://git@github.com/bobzel/equation-editor-react.git#75915e852b4b36a6a4cd3e1cbc80598da6b65227",
-            "dependencies": {
-                "jquery": "^3.4.1",
-                "mathquill": "^0.10.1-a"
-            }
-        },
-        "node_modules/errno": {
-            "version": "0.1.7",
-            "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.7.tgz",
-            "integrity": "sha512-MfrRBDWzIWifgq6tJj60gkAwtLNb6sQPlcFrSOflcP1aFmmruKQ2wRnze/8V6kgyz7H3FF8Npzv78mZ7XLLflg==",
-            "dev": true,
-            "dependencies": {
-                "prr": "~1.0.1"
-            },
-            "bin": {
-                "errno": "cli.js"
-            }
-        },
-        "node_modules/error-ex": {
-            "version": "1.3.2",
-            "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
-            "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==",
-            "dependencies": {
-                "is-arrayish": "^0.2.1"
-            }
-        },
-        "node_modules/es-abstract": {
-            "version": "1.17.5",
-            "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.17.5.tgz",
-            "integrity": "sha512-BR9auzDbySxOcfog0tLECW8l28eRGpDpU3Dm3Hp4q/N+VtLTmyj4EUN088XZWQDW/hzj6sYRDXeOFsaAODKvpg==",
-            "dependencies": {
-                "es-to-primitive": "^1.2.1",
-                "function-bind": "^1.1.1",
-                "has": "^1.0.3",
-                "has-symbols": "^1.0.1",
-                "is-callable": "^1.1.5",
-                "is-regex": "^1.0.5",
-                "object-inspect": "^1.7.0",
-                "object-keys": "^1.1.1",
-                "object.assign": "^4.1.0",
-                "string.prototype.trimleft": "^2.1.1",
-                "string.prototype.trimright": "^2.1.1"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/es-to-primitive": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.2.1.tgz",
-            "integrity": "sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==",
-            "dependencies": {
-                "is-callable": "^1.1.4",
-                "is-date-object": "^1.0.1",
-                "is-symbol": "^1.0.2"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/es5-ext": {
-            "version": "0.10.53",
-            "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.53.tgz",
-            "integrity": "sha512-Xs2Stw6NiNHWypzRTY1MtaG/uJlwCk8kH81920ma8mvN8Xq1gsfhZvpkImLQArw8AHnv8MT2I45J3c0R8slE+Q==",
-            "dev": true,
-            "dependencies": {
-                "es6-iterator": "~2.0.3",
-                "es6-symbol": "~3.1.3",
-                "next-tick": "~1.0.0"
-            }
-        },
-        "node_modules/es6-iterator": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.3.tgz",
-            "integrity": "sha1-p96IkUGgWpSwhUQDstCg+/qY87c=",
-            "dev": true,
-            "dependencies": {
-                "d": "1",
-                "es5-ext": "^0.10.35",
-                "es6-symbol": "^3.1.1"
-            }
-        },
-        "node_modules/es6-promise": {
-            "version": "3.2.1",
-            "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.2.1.tgz",
-            "integrity": "sha1-7FYjOGgDKQkgcXDDlEjiREndH8Q="
-        },
-        "node_modules/es6-symbol": {
-            "version": "3.1.3",
-            "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.3.tgz",
-            "integrity": "sha512-NJ6Yn3FuDinBaBRWl/q5X/s4koRHBrgKAu+yGI6JCBeiu3qrcbJhwT2GeR/EXVfylRk8dpQVJoLEFhK+Mu31NA==",
-            "dev": true,
-            "dependencies": {
-                "d": "^1.0.1",
-                "ext": "^1.1.2"
-            }
-        },
-        "node_modules/escape-html": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
-            "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
-        },
-        "node_modules/escape-string-regexp": {
-            "version": "1.0.5",
-            "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-            "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
-            "engines": {
-                "node": ">=0.8.0"
-            }
-        },
-        "node_modules/escodegen": {
-            "version": "1.14.1",
-            "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.14.1.tgz",
-            "integrity": "sha512-Bmt7NcRySdIfNPfU2ZoXDrrXsG9ZjvDxcAlMfDUgRBjLOWTuIACXPBFJH7Z+cLb40JeQco5toikyc9t9P8E9SQ==",
-            "dev": true,
-            "dependencies": {
-                "esprima": "^4.0.1",
-                "estraverse": "^4.2.0",
-                "esutils": "^2.0.2",
-                "optionator": "^0.8.1"
-            },
-            "bin": {
-                "escodegen": "bin/escodegen.js",
-                "esgenerate": "bin/esgenerate.js"
-            },
-            "engines": {
-                "node": ">=4.0"
-            },
-            "optionalDependencies": {
-                "source-map": "~0.6.1"
-            }
-        },
-        "node_modules/escodegen/node_modules/source-map": {
-            "version": "0.6.1",
-            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-            "dev": true,
-            "optional": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/eslint-scope": {
-            "version": "4.0.3",
-            "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-4.0.3.tgz",
-            "integrity": "sha512-p7VutNr1O/QrxysMo3E45FjYDTeXBy0iTltPFNSqKAIfjDSXC+4dj+qfyuD8bfAXrW/y6lW3O76VaYNPKfpKrg==",
-            "dev": true,
-            "dependencies": {
-                "esrecurse": "^4.1.0",
-                "estraverse": "^4.1.1"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/esprima": {
-            "version": "4.0.1",
-            "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz",
-            "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==",
-            "bin": {
-                "esparse": "bin/esparse.js",
-                "esvalidate": "bin/esvalidate.js"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/esrecurse": {
-            "version": "4.3.0",
-            "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
-            "integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
-            "dev": true,
-            "dependencies": {
-                "estraverse": "^5.2.0"
-            },
-            "engines": {
-                "node": ">=4.0"
-            }
-        },
-        "node_modules/esrecurse/node_modules/estraverse": {
-            "version": "5.2.0",
-            "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.2.0.tgz",
-            "integrity": "sha512-BxbNGGNm0RyRYvUdHpIwv9IWzeM9XClbOxwoATuFdOE7ZE6wHL+HQ5T8hoPM+zHvmKzzsEqhgy0GrQ5X13afiQ==",
-            "dev": true,
-            "engines": {
-                "node": ">=4.0"
-            }
-        },
-        "node_modules/estraverse": {
-            "version": "4.3.0",
-            "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.3.0.tgz",
-            "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==",
-            "dev": true,
-            "engines": {
-                "node": ">=4.0"
-            }
-        },
-        "node_modules/esutils": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
-            "integrity": "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/etag": {
-            "version": "1.8.1",
-            "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
-            "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc=",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/event-target-shim": {
-            "version": "5.0.1",
-            "resolved": "https://registry.npmjs.org/event-target-shim/-/event-target-shim-5.0.1.tgz",
-            "integrity": "sha512-i/2XbnSz/uxRCU6+NdVJgKWDTM427+MqYbkQzD321DuCQJUqOuJKIA0IM2+W2xtYHdKOmZ4dR6fExsd4SXL+WQ==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/eventemitter3": {
-            "version": "4.0.4",
-            "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.4.tgz",
-            "integrity": "sha512-rlaVLnVxtxvoyLsQQFBx53YmXHDxRIzzTLbdfxqi4yocpSjAxXwkU0cScM5JgSKMqEhrZpnvQ2D9gjylR0AimQ==",
-            "dev": true
-        },
-        "node_modules/events": {
-            "version": "3.3.0",
-            "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz",
-            "integrity": "sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.8.x"
-            }
-        },
-        "node_modules/eventsource": {
-            "version": "1.0.7",
-            "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-1.0.7.tgz",
-            "integrity": "sha512-4Ln17+vVT0k8aWq+t/bF5arcS3EpT9gYtW66EPacdj/mAFevznsnyoHLPy2BA8gbIQeIHoPsvwmfBftfcG//BQ==",
-            "dev": true,
-            "dependencies": {
-                "original": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.12.0"
-            }
-        },
-        "node_modules/evp_bytestokey": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.3.tgz",
-            "integrity": "sha512-/f2Go4TognH/KvCISP7OUsHn85hT9nUkxxA9BEWxFn+Oj9o8ZNLm/40hdlgSLyuOimsrTKLUMEorQexp/aPQeA==",
-            "dev": true,
-            "dependencies": {
-                "md5.js": "^1.3.4",
-                "safe-buffer": "^5.1.1"
-            }
-        },
-        "node_modules/execa": {
-            "version": "0.7.0",
-            "resolved": "https://registry.npmjs.org/execa/-/execa-0.7.0.tgz",
-            "integrity": "sha1-lEvs00zEHuMqY6n68nrVpl/Fl3c=",
-            "dependencies": {
-                "cross-spawn": "^5.0.1",
-                "get-stream": "^3.0.0",
-                "is-stream": "^1.1.0",
-                "npm-run-path": "^2.0.0",
-                "p-finally": "^1.0.0",
-                "signal-exit": "^3.0.0",
-                "strip-eof": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/execa/node_modules/cross-spawn": {
-            "version": "5.1.0",
-            "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
-            "integrity": "sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk=",
-            "dependencies": {
-                "lru-cache": "^4.0.1",
-                "shebang-command": "^1.2.0",
-                "which": "^1.2.9"
-            }
-        },
-        "node_modules/execa/node_modules/lru-cache": {
-            "version": "4.1.5",
-            "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.5.tgz",
-            "integrity": "sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==",
-            "dependencies": {
-                "pseudomap": "^1.0.2",
-                "yallist": "^2.1.2"
-            }
-        },
-        "node_modules/execa/node_modules/yallist": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz",
-            "integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI="
-        },
-        "node_modules/exenv": {
-            "version": "1.2.2",
-            "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz",
-            "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50="
-        },
-        "node_modules/exeq": {
-            "version": "2.4.0",
-            "resolved": "https://registry.npmjs.org/exeq/-/exeq-2.4.0.tgz",
-            "integrity": "sha1-Td8qaEZIxCeteZNJzzO9dTWPiEo=",
-            "dependencies": {
-                "bluebird": "^3.0.3",
-                "native-or-bluebird": "^1.2.0"
-            },
-            "engines": {
-                "node": ">= 0.10.0"
-            }
-        },
-        "node_modules/exif": {
-            "version": "0.6.0",
-            "resolved": "https://registry.npmjs.org/exif/-/exif-0.6.0.tgz",
-            "integrity": "sha1-YKYmaAdlQst+T1cZnUrG830sX0o=",
-            "dependencies": {
-                "debug": "^2.2"
-            }
-        },
-        "node_modules/exif/node_modules/debug": {
-            "version": "2.6.9",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/exif/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-        },
-        "node_modules/expand-brackets": {
-            "version": "2.1.4",
-            "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-2.1.4.tgz",
-            "integrity": "sha1-t3c14xXOMPa27/D4OwQVGiJEliI=",
-            "dependencies": {
-                "debug": "^2.3.3",
-                "define-property": "^0.2.5",
-                "extend-shallow": "^2.0.1",
-                "posix-character-classes": "^0.1.0",
-                "regex-not": "^1.0.0",
-                "snapdragon": "^0.8.1",
-                "to-regex": "^3.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/expand-brackets/node_modules/debug": {
-            "version": "2.6.9",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/expand-brackets/node_modules/define-property": {
-            "version": "0.2.5",
-            "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-            "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
-            "dependencies": {
-                "is-descriptor": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/expand-brackets/node_modules/extend-shallow": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
-            "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
-            "dependencies": {
-                "is-extendable": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/expand-brackets/node_modules/is-extendable": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
-            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/expand-brackets/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-        },
-        "node_modules/expand-template": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/expand-template/-/expand-template-2.0.3.tgz",
-            "integrity": "sha512-XYfuKMvj4O35f/pOXLObndIRvyQ+/+6AhODh+OKWj9S9498pHHn/IMszH+gt0fBCRWMNfk1ZSp5x3AifmnI2vg==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/expand-tilde": {
-            "version": "2.0.2",
-            "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-2.0.2.tgz",
-            "integrity": "sha1-l+gBqgUt8CRU3kawK/YhZCzchQI=",
-            "dev": true,
-            "dependencies": {
-                "homedir-polyfill": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/express": {
-            "version": "4.17.1",
-            "resolved": "https://registry.npmjs.org/express/-/express-4.17.1.tgz",
-            "integrity": "sha512-mHJ9O79RqluphRrcw2X/GTh3k9tVv8YcoyY4Kkh4WDMUYKRZUq0h1o0w2rrrxBqM7VoeUVqgb27xlEMXTnYt4g==",
-            "dependencies": {
-                "accepts": "~1.3.7",
-                "array-flatten": "1.1.1",
-                "body-parser": "1.19.0",
-                "content-disposition": "0.5.3",
-                "content-type": "~1.0.4",
-                "cookie": "0.4.0",
-                "cookie-signature": "1.0.6",
-                "debug": "2.6.9",
-                "depd": "~1.1.2",
-                "encodeurl": "~1.0.2",
-                "escape-html": "~1.0.3",
-                "etag": "~1.8.1",
-                "finalhandler": "~1.1.2",
-                "fresh": "0.5.2",
-                "merge-descriptors": "1.0.1",
-                "methods": "~1.1.2",
-                "on-finished": "~2.3.0",
-                "parseurl": "~1.3.3",
-                "path-to-regexp": "0.1.7",
-                "proxy-addr": "~2.0.5",
-                "qs": "6.7.0",
-                "range-parser": "~1.2.1",
-                "safe-buffer": "5.1.2",
-                "send": "0.17.1",
-                "serve-static": "1.14.1",
-                "setprototypeof": "1.1.1",
-                "statuses": "~1.5.0",
-                "type-is": "~1.6.18",
-                "utils-merge": "1.0.1",
-                "vary": "~1.1.2"
-            },
-            "engines": {
-                "node": ">= 0.10.0"
-            }
-        },
-        "node_modules/express-flash": {
-            "version": "0.0.2",
-            "resolved": "https://registry.npmjs.org/express-flash/-/express-flash-0.0.2.tgz",
-            "integrity": "sha1-I9GovPP5DXB5KOSJ+Whp7K0KzaI=",
-            "dependencies": {
-                "connect-flash": "0.1.x"
-            },
-            "engines": {
-                "node": ">= 0.8.0"
-            }
-        },
-        "node_modules/express-session": {
-            "version": "1.17.1",
-            "resolved": "https://registry.npmjs.org/express-session/-/express-session-1.17.1.tgz",
-            "integrity": "sha512-UbHwgqjxQZJiWRTMyhvWGvjBQduGCSBDhhZXYenziMFjxst5rMV+aJZ6hKPHZnPyHGsrqRICxtX8jtEbm/z36Q==",
-            "dependencies": {
-                "cookie": "0.4.0",
-                "cookie-signature": "1.0.6",
-                "debug": "2.6.9",
-                "depd": "~2.0.0",
-                "on-headers": "~1.0.2",
-                "parseurl": "~1.3.3",
-                "safe-buffer": "5.2.0",
-                "uid-safe": "~2.1.5"
-            },
-            "engines": {
-                "node": ">= 0.8.0"
-            }
-        },
-        "node_modules/express-session/node_modules/debug": {
-            "version": "2.6.9",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/express-session/node_modules/depd": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
-            "integrity": "sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==",
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/express-session/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-        },
-        "node_modules/express-session/node_modules/safe-buffer": {
-            "version": "5.2.0",
-            "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.0.tgz",
-            "integrity": "sha512-fZEwUGbVl7kouZs1jCdMLdt95hdIv0ZeHg6L7qPeciMZhZ+/gdesW4wgTARkrFWEpspjEATAzUGPG8N2jJiwbg=="
-        },
-        "node_modules/express-validator": {
-            "version": "5.3.1",
-            "resolved": "https://registry.npmjs.org/express-validator/-/express-validator-5.3.1.tgz",
-            "integrity": "sha512-g8xkipBF6VxHbO1+ksC7nxUU7+pWif0+OZXjZTybKJ/V0aTVhuCoHbyhIPgSYVldwQLocGExPtB2pE0DqK4jsw==",
-            "dependencies": {
-                "lodash": "^4.17.10",
-                "validator": "^10.4.0"
-            },
-            "engines": {
-                "node": ">= 6.0.0"
-            }
-        },
-        "node_modules/express/node_modules/debug": {
-            "version": "2.6.9",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/express/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-        },
-        "node_modules/express/node_modules/qs": {
-            "version": "6.7.0",
-            "resolved": "https://registry.npmjs.org/qs/-/qs-6.7.0.tgz",
-            "integrity": "sha512-VCdBRNFTX1fyE7Nb6FYoURo/SPe62QCaAyzJvUjwRaIsc+NePBEniHlvxFmmX56+HZphIGtV0XeCirBtpDrTyQ==",
-            "engines": {
-                "node": ">=0.6"
-            }
-        },
-        "node_modules/expressjs": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/expressjs/-/expressjs-1.0.1.tgz",
-            "integrity": "sha1-IgMoRpoY31rWFeK3oM6ZXxf7ru8="
-        },
-        "node_modules/ext": {
-            "version": "1.4.0",
-            "resolved": "https://registry.npmjs.org/ext/-/ext-1.4.0.tgz",
-            "integrity": "sha512-Key5NIsUxdqKg3vIsdw9dSuXpPCQ297y6wBjL30edxwPgt2E44WcWBZey/ZvUc6sERLTxKdyCu4gZFmUbk1Q7A==",
-            "dev": true,
-            "dependencies": {
-                "type": "^2.0.0"
-            }
-        },
-        "node_modules/ext/node_modules/type": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/type/-/type-2.0.0.tgz",
-            "integrity": "sha512-KBt58xCHry4Cejnc2ISQAF7QY+ORngsWfxezO68+12hKV6lQY8P/psIkcbjeHWn7MqcgciWJyCCevFMJdIXpow==",
-            "dev": true
-        },
-        "node_modules/extend": {
-            "version": "3.0.2",
-            "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
-            "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g=="
-        },
-        "node_modules/extend-shallow": {
-            "version": "3.0.2",
-            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-3.0.2.tgz",
-            "integrity": "sha1-Jqcarwc7OfshJxcnRhMcJwQCjbg=",
-            "dependencies": {
-                "assign-symbols": "^1.0.0",
-                "is-extendable": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/extglob": {
-            "version": "2.0.4",
-            "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.4.tgz",
-            "integrity": "sha512-Nmb6QXkELsuBr24CJSkilo6UHHgbekK5UiZgfE6UHD3Eb27YC6oD+bhcT+tJ6cl8dmsgdQxnWlcry8ksBIBLpw==",
-            "dependencies": {
-                "array-unique": "^0.3.2",
-                "define-property": "^1.0.0",
-                "expand-brackets": "^2.1.4",
-                "extend-shallow": "^2.0.1",
-                "fragment-cache": "^0.2.1",
-                "regex-not": "^1.0.0",
-                "snapdragon": "^0.8.1",
-                "to-regex": "^3.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/extglob/node_modules/define-property": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
-            "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
-            "dependencies": {
-                "is-descriptor": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/extglob/node_modules/extend-shallow": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
-            "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
-            "dependencies": {
-                "is-extendable": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/extglob/node_modules/is-accessor-descriptor": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-1.0.0.tgz",
-            "integrity": "sha512-m5hnHTkcVsPfqx3AKlyttIPb7J+XykHvJP2B9bZDjlhLIoEq4XoK64Vg7boZlVWYK6LUY94dYPEE7Lh0ZkZKcQ==",
-            "dependencies": {
-                "kind-of": "^6.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/extglob/node_modules/is-data-descriptor": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-1.0.0.tgz",
-            "integrity": "sha512-jbRXy1FmtAoCjQkVmIVYwuuqDFUbaOeDjmed1tOGPrsMhtJA4rD9tkgA0F1qJ3gRFRXcHYVkdeaP50Q5rE/jLQ==",
-            "dependencies": {
-                "kind-of": "^6.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/extglob/node_modules/is-descriptor": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.2.tgz",
-            "integrity": "sha512-2eis5WqQGV7peooDyLmNEPUrps9+SXX5c9pL3xEB+4e9HnGuDa7mB7kHxHw4CbqS9k1T2hOH3miL8n8WtiYVtg==",
-            "dependencies": {
-                "is-accessor-descriptor": "^1.0.0",
-                "is-data-descriptor": "^1.0.0",
-                "kind-of": "^6.0.2"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/extglob/node_modules/is-extendable": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
-            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/extract-zip": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-2.0.1.tgz",
-            "integrity": "sha512-GDhU9ntwuKyGXdZBUgTIe+vXnWj0fppUEtMDL0+idd5Sta8TGpHssn/eusA9mrPr9qNDym6SxAYZjNvCn/9RBg==",
-            "dependencies": {
-                "debug": "^4.1.1",
-                "get-stream": "^5.1.0",
-                "yauzl": "^2.10.0"
-            },
-            "bin": {
-                "extract-zip": "cli.js"
-            },
-            "engines": {
-                "node": ">= 10.17.0"
-            },
-            "optionalDependencies": {
-                "@types/yauzl": "^2.9.1"
-            }
-        },
-        "node_modules/extract-zip/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/extract-zip/node_modules/get-stream": {
-            "version": "5.1.0",
-            "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-5.1.0.tgz",
-            "integrity": "sha512-EXr1FOzrzTfGeL0gQdeFEvOMm2mzMOglyiOXSTpPC+iAjAKftbr3jpCMWynogwYnM+eSj9sHGc6wjIcDvYiygw==",
-            "dependencies": {
-                "pump": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/extsprintf": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
-            "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU=",
-            "engines": [
-                "node >=0.6.0"
-            ]
-        },
-        "node_modules/fast-deep-equal": {
-            "version": "3.1.1",
-            "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.1.tgz",
-            "integrity": "sha512-8UEa58QDLauDNfpbrX55Q9jrGHThw2ZMdOky5Gl1CDtVeJDPVrG4Jxx1N8jw2gkWaff5UUuX1KJd+9zGe2B+ZA=="
-        },
-        "node_modules/fast-json-stable-stringify": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
-            "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw=="
-        },
-        "node_modules/fast-levenshtein": {
-            "version": "2.0.6",
-            "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
-            "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=",
-            "dev": true
-        },
-        "node_modules/fast-text-encoding": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/fast-text-encoding/-/fast-text-encoding-1.0.2.tgz",
-            "integrity": "sha512-5rQdinSsycpzvAoHga2EDn+LRX1d5xLFsuNG0Kg61JrAT/tASXcLL0nf/33v+sAxlQcfYmWbTURa1mmAf55jGw=="
-        },
-        "node_modules/faye-websocket": {
-            "version": "0.10.0",
-            "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
-            "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ=",
-            "dev": true,
-            "dependencies": {
-                "websocket-driver": ">=0.5.1"
-            },
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/fbjs": {
-            "version": "0.8.17",
-            "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.17.tgz",
-            "integrity": "sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90=",
-            "dependencies": {
-                "core-js": "^1.0.0",
-                "isomorphic-fetch": "^2.1.1",
-                "loose-envify": "^1.0.0",
-                "object-assign": "^4.1.0",
-                "promise": "^7.1.1",
-                "setimmediate": "^1.0.5",
-                "ua-parser-js": "^0.7.18"
-            }
-        },
-        "node_modules/fd-slicer": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.1.0.tgz",
-            "integrity": "sha1-JcfInLH5B3+IkbvmHY85Dq4lbx4=",
-            "dependencies": {
-                "pend": "~1.2.0"
-            }
-        },
-        "node_modules/figgy-pudding": {
-            "version": "3.5.2",
-            "resolved": "https://registry.npmjs.org/figgy-pudding/-/figgy-pudding-3.5.2.tgz",
-            "integrity": "sha512-0btnI/H8f2pavGMN8w40mlSKOfTK2SVJmBfBeVIj3kNw0swwgzyRq0d5TJVOwodFmtvpPeWPN/MCcfuWF0Ezbw==",
-            "dev": true
-        },
-        "node_modules/file-loader": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-3.0.1.tgz",
-            "integrity": "sha512-4sNIOXgtH/9WZq4NvlfU3Opn5ynUsqBwSLyM+I7UOwdGigTBYfVVQEwe/msZNX/j4pCJTIM14Fsw66Svo1oVrw==",
-            "dev": true,
-            "dependencies": {
-                "loader-utils": "^1.0.2",
-                "schema-utils": "^1.0.0"
-            },
-            "engines": {
-                "node": ">= 6.9.0"
-            }
-        },
-        "node_modules/file-loader/node_modules/schema-utils": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
-            "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
-            "dev": true,
-            "dependencies": {
-                "ajv": "^6.1.0",
-                "ajv-errors": "^1.0.0",
-                "ajv-keywords": "^3.1.0"
-            },
-            "engines": {
-                "node": ">= 4"
-            }
-        },
-        "node_modules/file-saver": {
-            "version": "2.0.2",
-            "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.2.tgz",
-            "integrity": "sha512-Wz3c3XQ5xroCxd1G8b7yL0Ehkf0TC9oYC6buPFkNnU9EnaPlifeAFCyCh+iewXTyFRcg0a6j3J7FmJsIhlhBdw=="
-        },
-        "node_modules/file-uri-to-path": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
-            "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
-            "optional": true
-        },
-        "node_modules/fill-range": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
-            "integrity": "sha1-1USBHUKPmOsGpj3EAtJAPDKMOPc=",
-            "dependencies": {
-                "extend-shallow": "^2.0.1",
-                "is-number": "^3.0.0",
-                "repeat-string": "^1.6.1",
-                "to-regex-range": "^2.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/fill-range/node_modules/extend-shallow": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
-            "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
-            "dependencies": {
-                "is-extendable": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/fill-range/node_modules/is-extendable": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
-            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/finalhandler": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.2.tgz",
-            "integrity": "sha512-aAWcW57uxVNrQZqFXjITpW3sIUQmHGG3qSb9mUah9MgMC4NeWhNOlNjXEYq3HjRAvL6arUviZGGJsBg6z0zsWA==",
-            "dependencies": {
-                "debug": "2.6.9",
-                "encodeurl": "~1.0.2",
-                "escape-html": "~1.0.3",
-                "on-finished": "~2.3.0",
-                "parseurl": "~1.3.3",
-                "statuses": "~1.5.0",
-                "unpipe": "~1.0.0"
-            },
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/finalhandler/node_modules/debug": {
-            "version": "2.6.9",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/finalhandler/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-        },
-        "node_modules/find": {
-            "version": "0.1.7",
-            "resolved": "https://registry.npmjs.org/find/-/find-0.1.7.tgz",
-            "integrity": "sha1-yGyHrxqxjyIrvjjeyGy8dg0Wpvs=",
-            "dependencies": {
-                "traverse-chain": "~0.1.0"
-            }
-        },
-        "node_modules/find-cache-dir": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-1.0.0.tgz",
-            "integrity": "sha1-kojj6ePMN0hxfTnq3hfPcfww7m8=",
-            "dev": true,
-            "dependencies": {
-                "commondir": "^1.0.1",
-                "make-dir": "^1.0.0",
-                "pkg-dir": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/find-in-files": {
-            "version": "0.5.0",
-            "resolved": "https://registry.npmjs.org/find-in-files/-/find-in-files-0.5.0.tgz",
-            "integrity": "sha512-VraTc6HdtdSHmAp0yJpAy20yPttGKzyBWc7b7FPnnsX9TOgmKx0g9xajizpF/iuu4IvNK4TP0SpyBT9zAlwG+g==",
-            "dependencies": {
-                "find": "^0.1.5",
-                "q": "^1.0.1"
-            }
-        },
-        "node_modules/find-parent-dir": {
-            "version": "0.3.0",
-            "resolved": "https://registry.npmjs.org/find-parent-dir/-/find-parent-dir-0.3.0.tgz",
-            "integrity": "sha1-M8RLQpqysvBkYpnF+fcY83b/jVQ="
-        },
-        "node_modules/find-root": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
-            "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng=="
-        },
-        "node_modules/find-up": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/find-up/-/find-up-3.0.0.tgz",
-            "integrity": "sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg==",
-            "dependencies": {
-                "locate-path": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/findup-sync": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-3.0.0.tgz",
-            "integrity": "sha512-YbffarhcicEhOrm4CtrwdKBdCuz576RLdhJDsIfvNtxUuhdRet1qZcsMjqbePtAseKdAnDyM/IyXbu7PRPRLYg==",
-            "dev": true,
-            "dependencies": {
-                "detect-file": "^1.0.0",
-                "is-glob": "^4.0.0",
-                "micromatch": "^3.0.4",
-                "resolve-dir": "^1.0.1"
-            },
-            "engines": {
-                "node": ">= 0.10"
-            }
-        },
-        "node_modules/fit-curve": {
-            "version": "0.1.7",
-            "resolved": "https://registry.npmjs.org/fit-curve/-/fit-curve-0.1.7.tgz",
-            "integrity": "sha512-Md3b3ReA/qJwwYvKXeHpOV1fhPqwhJ9/29zc9lfi8ijyg00J0S9C7+5XMZDFhlDAKbwOvVgBxVIG1EHoMSC3vw=="
-        },
-        "node_modules/flat": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/flat/-/flat-4.1.0.tgz",
-            "integrity": "sha512-Px/TiLIznH7gEDlPXcUD4KnBusa6kR6ayRUVcnEAbreRIuhkqow/mun59BuRXwoYk7ZQOLW1ZM05ilIvK38hFw==",
-            "dependencies": {
-                "is-buffer": "~2.0.3"
-            },
-            "bin": {
-                "flat": "cli.js"
-            }
-        },
-        "node_modules/flexlayout-react": {
-            "version": "0.3.11",
-            "resolved": "https://registry.npmjs.org/flexlayout-react/-/flexlayout-react-0.3.11.tgz",
-            "integrity": "sha512-V+rEfyYJBqNk9oBgotPoXg8rmom4/ji9Mvr6f7T8sIJs83RuyK1D3oOrya2ydZIUCP2T6BIvj7rFTmRRkzpU8w=="
-        },
-        "node_modules/fluent-ffmpeg": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/fluent-ffmpeg/-/fluent-ffmpeg-2.1.2.tgz",
-            "integrity": "sha1-yVLeIkD4EuvaCqgAbXd27irPfXQ=",
-            "dependencies": {
-                "async": ">=0.2.9",
-                "which": "^1.1.1"
-            },
-            "engines": {
-                "node": ">=0.8.0"
-            }
-        },
-        "node_modules/flush-write-stream": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/flush-write-stream/-/flush-write-stream-1.1.1.tgz",
-            "integrity": "sha512-3Z4XhFZ3992uIq0XOqb9AreonueSYphE6oYbpt5+3u06JWklbsPkNv3ZKkP9Bz/r+1MWCaMoSQ28P85+1Yc77w==",
-            "dev": true,
-            "dependencies": {
-                "inherits": "^2.0.3",
-                "readable-stream": "^2.3.6"
-            }
-        },
-        "node_modules/flush-write-stream/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/follow-redirects": {
-            "version": "1.12.1",
-            "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.12.1.tgz",
-            "integrity": "sha512-tmRv0AVuR7ZyouUHLeNSiO6pqulF7dYa3s19c6t+wz9LD69/uSzdMxJ2S91nTI9U3rt/IldxpzMOFejp6f0hjg==",
-            "engines": {
-                "node": ">=4.0"
-            }
-        },
-        "node_modules/for-each-property": {
-            "version": "0.0.4",
-            "resolved": "https://registry.npmjs.org/for-each-property/-/for-each-property-0.0.4.tgz",
-            "integrity": "sha1-z6hXrsFCLh0Sb/CHhPz2Jim8g/Y=",
-            "dependencies": {
-                "get-prototype-chain": "^1.0.1"
-            }
-        },
-        "node_modules/for-each-property-deep": {
-            "version": "0.0.3",
-            "resolved": "https://registry.npmjs.org/for-each-property-deep/-/for-each-property-deep-0.0.3.tgz",
-            "integrity": "sha1-MTCaSvw4qcygbxsiP1PWSm0IP60=",
-            "dependencies": {
-                "for-each-property": "0.0.4"
-            }
-        },
-        "node_modules/for-in": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
-            "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/forever-agent": {
-            "version": "0.6.1",
-            "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
-            "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/fork-ts-checker-webpack-plugin": {
-            "version": "1.6.0",
-            "resolved": "https://registry.npmjs.org/fork-ts-checker-webpack-plugin/-/fork-ts-checker-webpack-plugin-1.6.0.tgz",
-            "integrity": "sha512-vqOY5gakcoon2s12V7MMe01OPwfgqulUWFzm+geQaPPOBKjW1I7aqqoBVlU0ECn97liMB0ECs16pRdIGe9qdRw==",
-            "dev": true,
-            "dependencies": {
-                "babel-code-frame": "^6.22.0",
-                "chalk": "^2.4.1",
-                "chokidar": "^2.0.4",
-                "micromatch": "^3.1.10",
-                "minimatch": "^3.0.4",
-                "semver": "^5.6.0",
-                "tapable": "^1.0.0",
-                "worker-rpc": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=6.11.5",
-                "yarn": ">=1.0.0"
-            }
-        },
-        "node_modules/form-data": {
-            "version": "2.5.1",
-            "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.5.1.tgz",
-            "integrity": "sha512-m21N3WOmEEURgk6B9GLOE4RuWOFf28Lhh9qGYeNlGq4VDXUlJy2th2slBNU8Gp8EzloYZOibZJ7t5ecIrFSjVA==",
-            "dev": true,
-            "dependencies": {
-                "asynckit": "^0.4.0",
-                "combined-stream": "^1.0.6",
-                "mime-types": "^2.1.12"
-            },
-            "engines": {
-                "node": ">= 0.12"
-            }
-        },
-        "node_modules/formidable": {
-            "version": "1.2.2",
-            "resolved": "https://registry.npmjs.org/formidable/-/formidable-1.2.2.tgz",
-            "integrity": "sha512-V8gLm+41I/8kguQ4/o1D3RIHRmhYFG4pnNyonvua+40rqcEmT4+V71yaZ3B457xbbgCsCfjSPi65u/W6vK1U5Q=="
-        },
-        "node_modules/forwarded": {
-            "version": "0.1.2",
-            "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
-            "integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ=",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/fragment-cache": {
-            "version": "0.2.1",
-            "resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz",
-            "integrity": "sha1-QpD60n8T6Jvn8zeZxrxaCr//DRk=",
-            "dependencies": {
-                "map-cache": "^0.2.2"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/fresh": {
-            "version": "0.5.2",
-            "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
-            "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac=",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/from2": {
-            "version": "2.3.0",
-            "resolved": "https://registry.npmjs.org/from2/-/from2-2.3.0.tgz",
-            "integrity": "sha1-i/tVAr3kpNNs/e6gB/zKIdfjgq8=",
-            "dev": true,
-            "dependencies": {
-                "inherits": "^2.0.1",
-                "readable-stream": "^2.0.0"
-            }
-        },
-        "node_modules/from2/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/fs-constants": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/fs-constants/-/fs-constants-1.0.0.tgz",
-            "integrity": "sha512-y6OAwoSIf7FyjMIv94u+b5rdheZEjzR63GTyZJm5qh4Bi+2YgwLCcI/fPFZkL5PSixOt6ZNKm+w+Hfp/Bciwow=="
-        },
-        "node_modules/fs-extra": {
-            "version": "0.26.7",
-            "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
-            "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k=",
-            "dependencies": {
-                "graceful-fs": "^4.1.2",
-                "jsonfile": "^2.1.0",
-                "klaw": "^1.0.0",
-                "path-is-absolute": "^1.0.0",
-                "rimraf": "^2.2.8"
-            }
-        },
-        "node_modules/fs-extra/node_modules/rimraf": {
-            "version": "2.7.1",
-            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/fs-minipass": {
-            "version": "1.2.7",
-            "resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-1.2.7.tgz",
-            "integrity": "sha512-GWSSJGFy4e9GUeCcbIkED+bgAoFyj7XF1mV8rma3QW4NIqX9Kyx79N/PF61H5udOV3aY1IaMLs6pGbH71nlCTA==",
-            "dependencies": {
-                "minipass": "^2.6.0"
-            }
-        },
-        "node_modules/fs-write-stream-atomic": {
-            "version": "1.0.10",
-            "resolved": "https://registry.npmjs.org/fs-write-stream-atomic/-/fs-write-stream-atomic-1.0.10.tgz",
-            "integrity": "sha1-tH31NJPvkR33VzHnCp3tAYnbQMk=",
-            "dev": true,
-            "dependencies": {
-                "graceful-fs": "^4.1.2",
-                "iferr": "^0.1.5",
-                "imurmurhash": "^0.1.4",
-                "readable-stream": "1 || 2"
-            }
-        },
-        "node_modules/fs-write-stream-atomic/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/fs.realpath": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-            "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
-        },
-        "node_modules/fsevents": {
-            "version": "2.1.3",
-            "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.1.3.tgz",
-            "integrity": "sha512-Auw9a4AxqWpa9GUfj370BMPzzyncfBABW8Mab7BGWBYDj4Isgq+cDKtx0i6u9jcX9pQDnswsaaOTgTmA5pEjuQ==",
-            "dev": true,
-            "optional": true,
-            "os": [
-                "darwin"
-            ],
-            "engines": {
-                "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
-            }
-        },
-        "node_modules/fstream": {
-            "version": "1.0.12",
-            "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.12.tgz",
-            "integrity": "sha512-WvJ193OHa0GHPEL+AycEJgxvBEwyfRkN1vhjca23OaPVMCaLCXTd5qAu82AjTcgP1UJmytkOKb63Ypde7raDIg==",
-            "dependencies": {
-                "graceful-fs": "^4.1.2",
-                "inherits": "~2.0.0",
-                "mkdirp": ">=0.5 0",
-                "rimraf": "2"
-            },
-            "engines": {
-                "node": ">=0.6"
-            }
-        },
-        "node_modules/fstream/node_modules/rimraf": {
-            "version": "2.7.1",
-            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/function-bind": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
-            "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
-        },
-        "node_modules/function-plot": {
-            "version": "1.22.7",
-            "resolved": "https://registry.npmjs.org/function-plot/-/function-plot-1.22.7.tgz",
-            "integrity": "sha512-rB6FeVqvgNECmt5PhIvFFEOyEjM9AWLIpMkj9Nzbzq9f81Irgn3ZrXAuv5+qnuzM99jPL7ZM4kK3+ImiKXcSHA==",
-            "dependencies": {
-                "built-in-math-eval": "^0.3.0",
-                "clamp": "^1.0.1",
-                "d3-axis": "^2.0.0",
-                "d3-color": "^2.0.0",
-                "d3-format": "^2.0.0",
-                "d3-interpolate": "^2.0.1",
-                "d3-scale": "^3.2.2",
-                "d3-selection": "^2.0.0",
-                "d3-shape": "^2.0.0",
-                "d3-zoom": "^2.0.0",
-                "interval-arithmetic-eval": "^0.4.7"
-            }
-        },
-        "node_modules/gauge": {
-            "version": "2.7.4",
-            "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
-            "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c=",
-            "dependencies": {
-                "aproba": "^1.0.3",
-                "console-control-strings": "^1.0.0",
-                "has-unicode": "^2.0.0",
-                "object-assign": "^4.1.0",
-                "signal-exit": "^3.0.0",
-                "string-width": "^1.0.1",
-                "strip-ansi": "^3.0.1",
-                "wide-align": "^1.1.0"
-            }
-        },
-        "node_modules/gauge/node_modules/ansi-regex": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-            "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/gauge/node_modules/is-fullwidth-code-point": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-            "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
-            "dependencies": {
-                "number-is-nan": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/gauge/node_modules/string-width": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-            "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
-            "dependencies": {
-                "code-point-at": "^1.0.0",
-                "is-fullwidth-code-point": "^1.0.0",
-                "strip-ansi": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/gauge/node_modules/strip-ansi": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-            "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
-            "dependencies": {
-                "ansi-regex": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/gaxios": {
-            "version": "2.3.4",
-            "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-2.3.4.tgz",
-            "integrity": "sha512-US8UMj8C5pRnao3Zykc4AAVr+cffoNKRTg9Rsf2GiuZCW69vgJj38VK2PzlPuQU73FZ/nTk9/Av6/JGcE1N9vA==",
-            "dependencies": {
-                "abort-controller": "^3.0.0",
-                "extend": "^3.0.2",
-                "https-proxy-agent": "^5.0.0",
-                "is-stream": "^2.0.0",
-                "node-fetch": "^2.3.0"
-            },
-            "engines": {
-                "node": ">=8.10.0"
-            }
-        },
-        "node_modules/gaxios/node_modules/is-stream": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.0.tgz",
-            "integrity": "sha512-XCoy+WlUr7d1+Z8GgSuXmpuUFC9fOhRXglJMx+dwLKTkL44Cjd4W1Z5P+BQZpr+cR93aGP4S/s7Ftw6Nd/kiEw==",
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/gaxios/node_modules/node-fetch": {
-            "version": "2.6.0",
-            "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.0.tgz",
-            "integrity": "sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA==",
-            "engines": {
-                "node": "4.x || >=6.0.0"
-            }
-        },
-        "node_modules/gaze": {
-            "version": "1.1.3",
-            "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.3.tgz",
-            "integrity": "sha512-BRdNm8hbWzFzWHERTrejLqwHDfS4GibPoq5wjTPIoJHoBtKGPg3xAFfxmM+9ztbXelxcf2hwQcaz1PtmFeue8g==",
-            "dependencies": {
-                "globule": "^1.0.0"
-            },
-            "engines": {
-                "node": ">= 4.0.0"
-            }
-        },
-        "node_modules/gcp-metadata": {
-            "version": "2.0.4",
-            "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-2.0.4.tgz",
-            "integrity": "sha512-p1lXhJvcKvJHWfQXhkd4Za1kyXRsGZA0JH7Cjs07W9hrg84d/j5tqQhbGewlSLx9gNyuQUid69uLux48YbggLg==",
-            "dependencies": {
-                "gaxios": "^2.0.1",
-                "json-bigint": "^0.3.0"
-            },
-            "engines": {
-                "node": ">=8.10.0"
-            }
-        },
-        "node_modules/get-caller-file": {
-            "version": "2.0.5",
-            "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
-            "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
-            "engines": {
-                "node": "6.* || 8.* || >= 10.*"
-            }
-        },
-        "node_modules/get-func-name": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/get-func-name/-/get-func-name-2.0.0.tgz",
-            "integrity": "sha1-6td0q+5y4gQJQzoGY2YCPdaIekE=",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/get-node-dimensions": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/get-node-dimensions/-/get-node-dimensions-1.2.1.tgz",
-            "integrity": "sha512-2MSPMu7S1iOTL+BOa6K1S62hB2zUAYNF/lV0gSVlOaacd087lc6nR1H1r0e3B1CerTo+RceOmi1iJW+vp21xcQ=="
-        },
-        "node_modules/get-prototype-chain": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/get-prototype-chain/-/get-prototype-chain-1.0.1.tgz",
-            "integrity": "sha1-oXGhFeoeSQbG7ThDofABwYUQQW8=",
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/get-stdin": {
-            "version": "5.0.1",
-            "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-5.0.1.tgz",
-            "integrity": "sha1-Ei4WFZHiH/TFJTAwVpPyDmOTo5g=",
-            "engines": {
-                "node": ">=0.12.0"
-            }
-        },
-        "node_modules/get-stream": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
-            "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/get-value": {
-            "version": "2.0.6",
-            "resolved": "https://registry.npmjs.org/get-value/-/get-value-2.0.6.tgz",
-            "integrity": "sha1-3BXKHGcjh8p2vTesCjlbogQqLCg=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/getpass": {
-            "version": "0.1.7",
-            "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
-            "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
-            "dependencies": {
-                "assert-plus": "^1.0.0"
-            }
-        },
-        "node_modules/github-from-package": {
-            "version": "0.0.0",
-            "resolved": "https://registry.npmjs.org/github-from-package/-/github-from-package-0.0.0.tgz",
-            "integrity": "sha1-l/tdlr/eiXMxPyDoKI75oWf6ZM4="
-        },
-        "node_modules/glob": {
-            "version": "7.1.6",
-            "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.6.tgz",
-            "integrity": "sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==",
-            "dependencies": {
-                "fs.realpath": "^1.0.0",
-                "inflight": "^1.0.4",
-                "inherits": "2",
-                "minimatch": "^3.0.4",
-                "once": "^1.3.0",
-                "path-is-absolute": "^1.0.0"
-            },
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/glob-parent": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
-            "integrity": "sha1-nmr2KZ2NO9K9QEMIMr0RPfkGxa4=",
-            "dependencies": {
-                "is-glob": "^3.1.0",
-                "path-dirname": "^1.0.0"
-            }
-        },
-        "node_modules/glob-parent/node_modules/is-glob": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
-            "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo=",
-            "dependencies": {
-                "is-extglob": "^2.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/global-dirs": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/global-dirs/-/global-dirs-0.1.1.tgz",
-            "integrity": "sha1-sxnA3UYH81PzvpzKTHL8FIxJ9EU=",
-            "dependencies": {
-                "ini": "^1.3.4"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/global-modules": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-2.0.0.tgz",
-            "integrity": "sha512-NGbfmJBp9x8IxyJSd1P+otYK8vonoJactOogrVfFRIAEY1ukil8RSKDz2Yo7wh1oihl51l/r6W4epkeKJHqL8A==",
-            "dev": true,
-            "dependencies": {
-                "global-prefix": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/global-modules/node_modules/global-prefix": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-3.0.0.tgz",
-            "integrity": "sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==",
-            "dev": true,
-            "dependencies": {
-                "ini": "^1.3.5",
-                "kind-of": "^6.0.2",
-                "which": "^1.3.1"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/global-prefix": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-1.0.2.tgz",
-            "integrity": "sha1-2/dDxsFJklk8ZVVoy2btMsASLr4=",
-            "dev": true,
-            "dependencies": {
-                "expand-tilde": "^2.0.2",
-                "homedir-polyfill": "^1.0.1",
-                "ini": "^1.3.4",
-                "is-windows": "^1.0.1",
-                "which": "^1.2.14"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/globals": {
-            "version": "11.12.0",
-            "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
-            "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/globby": {
-            "version": "7.1.1",
-            "resolved": "https://registry.npmjs.org/globby/-/globby-7.1.1.tgz",
-            "integrity": "sha1-+yzP+UAfhgCUXfral0QMypcrhoA=",
-            "dev": true,
-            "dependencies": {
-                "array-union": "^1.0.1",
-                "dir-glob": "^2.0.0",
-                "glob": "^7.1.2",
-                "ignore": "^3.3.5",
-                "pify": "^3.0.0",
-                "slash": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/globby/node_modules/pify": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
-            "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=",
-            "dev": true,
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/globule": {
-            "version": "1.3.1",
-            "resolved": "https://registry.npmjs.org/globule/-/globule-1.3.1.tgz",
-            "integrity": "sha512-OVyWOHgw29yosRHCHo7NncwR1hW5ew0W/UrvtwvjefVJeQ26q4/8r8FmPsSF1hJ93IgWkyv16pCTz6WblMzm/g==",
-            "dependencies": {
-                "glob": "~7.1.1",
-                "lodash": "~4.17.12",
-                "minimatch": "~3.0.2"
-            },
-            "engines": {
-                "node": ">= 0.10"
-            }
-        },
-        "node_modules/golden-layout": {
-            "version": "1.5.9",
-            "resolved": "https://registry.npmjs.org/golden-layout/-/golden-layout-1.5.9.tgz",
-            "integrity": "sha1-o5vB9qZ+b4hreXwBbdkk6UJrp38=",
-            "dependencies": {
-                "jquery": "*"
-            }
-        },
-        "node_modules/google-auth-library": {
-            "version": "4.2.6",
-            "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-4.2.6.tgz",
-            "integrity": "sha512-oJ6tCA9rbsYeIVY+mcLPFHa2hatz3XO6idYIrlI/KhhlMxZrO3tKyU8O2Pxu5KnSBBP7Wj4HtbM1LLKngNFaFw==",
-            "dependencies": {
-                "arrify": "^2.0.0",
-                "base64-js": "^1.3.0",
-                "fast-text-encoding": "^1.0.0",
-                "gaxios": "^2.0.0",
-                "gcp-metadata": "^2.0.0",
-                "gtoken": "^3.0.0",
-                "jws": "^3.1.5",
-                "lru-cache": "^5.0.0"
-            },
-            "engines": {
-                "node": ">=8.10.0"
-            }
-        },
-        "node_modules/google-maps-react": {
-            "version": "2.0.6",
-            "resolved": "https://registry.npmjs.org/google-maps-react/-/google-maps-react-2.0.6.tgz",
-            "integrity": "sha512-M8Eo9WndfQEfxcmm6yRq03qdJgw1x6rQmJ9DN+a+xPQ3K7yNDGkVDbinrf4/8vcox7nELbeopbm4bpefKewWfQ=="
-        },
-        "node_modules/google-p12-pem": {
-            "version": "2.0.4",
-            "resolved": "https://registry.npmjs.org/google-p12-pem/-/google-p12-pem-2.0.4.tgz",
-            "integrity": "sha512-S4blHBQWZRnEW44OcR7TL9WR+QCqByRvhNDZ/uuQfpxywfupikf/miba8js1jZi6ZOGv5slgSuoshCWh6EMDzg==",
-            "dependencies": {
-                "node-forge": "^0.9.0"
-            },
-            "bin": {
-                "gp12-pem": "build/src/bin/gp12-pem.js"
-            },
-            "engines": {
-                "node": ">=8.10.0"
-            }
-        },
-        "node_modules/googleapis": {
-            "version": "40.0.1",
-            "resolved": "https://registry.npmjs.org/googleapis/-/googleapis-40.0.1.tgz",
-            "integrity": "sha512-B6qZVCautOOspEhru9GZ814I+ztkGWyA4ZEUfaXwXHBruX/HAWqedbsuUEx1w3nCECywK/FLTNUdcbH9zpaMaw==",
-            "dependencies": {
-                "google-auth-library": "^4.0.0",
-                "googleapis-common": "^2.0.2"
-            },
-            "engines": {
-                "node": ">=8.10.0"
-            }
-        },
-        "node_modules/googleapis-common": {
-            "version": "2.0.4",
-            "resolved": "https://registry.npmjs.org/googleapis-common/-/googleapis-common-2.0.4.tgz",
-            "integrity": "sha512-8RRkxr24v1jIKCC1onFWA8RGnwFV55m3Qpil9DLX1yLc9e5qvOJsRoDOhhD2e7jFRONYEhT/BzT8vJZANqSr9w==",
-            "dependencies": {
-                "extend": "^3.0.2",
-                "gaxios": "^2.0.1",
-                "google-auth-library": "^4.2.5",
-                "qs": "^6.7.0",
-                "url-template": "^2.0.8",
-                "uuid": "^3.3.2"
-            },
-            "engines": {
-                "node": ">=8.10.0"
-            }
-        },
-        "node_modules/googleapis-common/node_modules/qs": {
-            "version": "6.9.3",
-            "resolved": "https://registry.npmjs.org/qs/-/qs-6.9.3.tgz",
-            "integrity": "sha512-EbZYNarm6138UKKq46tdx08Yo/q9ZhFoAXAI1meAFd2GtbRDhbZY2WQSICskT0c5q99aFzLG1D4nvTk9tqfXIw==",
-            "engines": {
-                "node": ">=0.6"
-            }
-        },
-        "node_modules/googlephotos": {
-            "version": "0.2.5",
-            "resolved": "https://registry.npmjs.org/googlephotos/-/googlephotos-0.2.5.tgz",
-            "integrity": "sha512-XPmD3gu8aMVuwauKVzzahD2Vn8Cn8WtBRGgSF5J9A85Fn6N2GM0OToxWbEoTfyKahK+ryGHGcIYzDX98ndxE9g==",
-            "dependencies": {
-                "lodash.chunk": "^4.2.0",
-                "request": "^2.86.0",
-                "request-promise": "^4.2.2"
-            },
-            "engines": {
-                "node": ">=6.0.0"
-            }
-        },
-        "node_modules/got": {
-            "version": "6.7.1",
-            "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz",
-            "integrity": "sha1-JAzQV4WpoY5WHcG0S0HHY+8ejbA=",
-            "dependencies": {
-                "create-error-class": "^3.0.0",
-                "duplexer3": "^0.1.4",
-                "get-stream": "^3.0.0",
-                "is-redirect": "^1.0.0",
-                "is-retry-allowed": "^1.0.0",
-                "is-stream": "^1.0.0",
-                "lowercase-keys": "^1.0.0",
-                "safe-buffer": "^5.0.1",
-                "timed-out": "^4.0.0",
-                "unzip-response": "^2.0.1",
-                "url-parse-lax": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/graceful-fs": {
-            "version": "4.2.4",
-            "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.4.tgz",
-            "integrity": "sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw=="
-        },
-        "node_modules/growl": {
-            "version": "1.10.5",
-            "resolved": "https://registry.npmjs.org/growl/-/growl-1.10.5.tgz",
-            "integrity": "sha512-qBr4OuELkhPenW6goKVXiv47US3clb3/IbuWF9KNKEijAy9oeHxU9IgzjvJhHkUzhaj7rOUD7+YGWqUjLp5oSA==",
-            "engines": {
-                "node": ">=4.x"
-            }
-        },
-        "node_modules/growly": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
-            "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE=",
-            "dev": true
-        },
-        "node_modules/gtoken": {
-            "version": "3.0.2",
-            "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-3.0.2.tgz",
-            "integrity": "sha512-BOBi6Zz31JfxhSHRZBIDdbwIbOPyux10WxJHdx8wz/FMP1zyN1xFrsAWsgcLe5ww5v/OZu/MePUEZAjgJXSauA==",
-            "dependencies": {
-                "gaxios": "^2.0.0",
-                "google-p12-pem": "^2.0.0",
-                "jws": "^3.1.5",
-                "mime": "^2.2.0"
-            },
-            "engines": {
-                "node": ">=8.10.0"
-            }
-        },
-        "node_modules/gtoken/node_modules/mime": {
-            "version": "2.4.4",
-            "resolved": "https://registry.npmjs.org/mime/-/mime-2.4.4.tgz",
-            "integrity": "sha512-LRxmNwziLPT828z+4YkNzloCFC2YM4wrB99k+AV5ZbEyfGNWfG8SO1FUXLmLDBSo89NrJZ4DIWeLjy1CHGhMGA==",
-            "bin": {
-                "mime": "cli.js"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/gud": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/gud/-/gud-1.0.0.tgz",
-            "integrity": "sha512-zGEOVKFM5sVPPrYs7J5/hYEw2Pof8KCyOwyhG8sAF26mCAeUFAcYPu1mwB7hhpIP29zOIBaDqwuHdLp0jvZXjw=="
-        },
-        "node_modules/handle-thing": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-2.0.1.tgz",
-            "integrity": "sha512-9Qn4yBxelxoh2Ow62nP+Ka/kMnOXRi8BXnRaUwezLNhqelnN49xKz4F/dPP8OYLxLxq6JDtZb2i9XznUQbNPTg==",
-            "dev": true
-        },
-        "node_modules/har-schema": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-2.0.0.tgz",
-            "integrity": "sha1-qUwiJOvKwEeCoNkDVSHyRzW37JI=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/har-validator": {
-            "version": "5.1.3",
-            "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-5.1.3.tgz",
-            "integrity": "sha512-sNvOCzEQNr/qrvJgc3UG/kD4QtlHycrzwS+6mfTrrSq97BvaYcPZZI1ZSqGSPR73Cxn4LKTD4PttRwfU7jWq5g==",
-            "dependencies": {
-                "ajv": "^6.5.5",
-                "har-schema": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/has": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz",
-            "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==",
-            "dependencies": {
-                "function-bind": "^1.1.1"
-            },
-            "engines": {
-                "node": ">= 0.4.0"
-            }
-        },
-        "node_modules/has-ansi": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
-            "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
-            "dependencies": {
-                "ansi-regex": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/has-ansi/node_modules/ansi-regex": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-            "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/has-binary2": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/has-binary2/-/has-binary2-1.0.3.tgz",
-            "integrity": "sha512-G1LWKhDSvhGeAQ8mPVQlqNcOB2sJdwATtZKl2pDKKHfpf/rYj24lkinxf69blJbnsvtqqNU+L3SL50vzZhXOnw==",
-            "dependencies": {
-                "isarray": "2.0.1"
-            }
-        },
-        "node_modules/has-binary2/node_modules/isarray": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.1.tgz",
-            "integrity": "sha1-o32U7ZzaLVmGXJ92/llu4fM4dB4="
-        },
-        "node_modules/has-cors": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz",
-            "integrity": "sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk="
-        },
-        "node_modules/has-flag": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
-            "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/has-symbols": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.1.tgz",
-            "integrity": "sha512-PLcsoqu++dmEIZB+6totNFKq/7Do+Z0u4oT0zKOJNl3lYK6vGwwu2hjHs+68OEZbTjiUE9bgOABXbP/GvrS0Kg==",
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/has-unicode": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
-            "integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk="
-        },
-        "node_modules/has-value": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/has-value/-/has-value-1.0.0.tgz",
-            "integrity": "sha1-GLKB2lhbHFxR3vJMkw7SmgvmsXc=",
-            "dependencies": {
-                "get-value": "^2.0.6",
-                "has-values": "^1.0.0",
-                "isobject": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/has-values": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/has-values/-/has-values-1.0.0.tgz",
-            "integrity": "sha1-lbC2P+whRmGab+V/51Yo1aOe/k8=",
-            "dependencies": {
-                "is-number": "^3.0.0",
-                "kind-of": "^4.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/has-values/node_modules/is-buffer": {
-            "version": "1.1.6",
-            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
-            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
-        },
-        "node_modules/has-values/node_modules/kind-of": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
-            "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc=",
-            "dependencies": {
-                "is-buffer": "^1.1.5"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/hash-base": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-3.1.0.tgz",
-            "integrity": "sha512-1nmYp/rhMDiE7AYkDw+lLwlAzz0AntGIe51F3RfFfEqyQ3feY2eI/NcwC6umIQVOASPMsWJLJScWKSSvzL9IVA==",
-            "dev": true,
-            "dependencies": {
-                "inherits": "^2.0.4",
-                "readable-stream": "^3.6.0",
-                "safe-buffer": "^5.2.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/hash-base/node_modules/safe-buffer": {
-            "version": "5.2.1",
-            "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
-            "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
-            "dev": true
-        },
-        "node_modules/hash.js": {
-            "version": "1.1.7",
-            "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.1.7.tgz",
-            "integrity": "sha512-taOaskGt4z4SOANNseOviYDvjEJinIkRgmp7LbKP2YTTmVxWBl87s/uzK9r+44BclBSp2X7K1hqeNfz9JbBeXA==",
-            "dev": true,
-            "dependencies": {
-                "inherits": "^2.0.3",
-                "minimalistic-assert": "^1.0.1"
-            }
-        },
-        "node_modules/he": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz",
-            "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==",
-            "bin": {
-                "he": "bin/he"
-            }
-        },
-        "node_modules/hmac-drbg": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
-            "integrity": "sha1-0nRXAQJabHdabFRXk+1QL8DGSaE=",
-            "dev": true,
-            "dependencies": {
-                "hash.js": "^1.0.3",
-                "minimalistic-assert": "^1.0.0",
-                "minimalistic-crypto-utils": "^1.0.1"
-            }
-        },
-        "node_modules/hoist-non-react-statics": {
-            "version": "3.3.2",
-            "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
-            "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
-            "dependencies": {
-                "react-is": "^16.7.0"
-            }
-        },
-        "node_modules/homedir-polyfill": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.3.tgz",
-            "integrity": "sha512-eSmmWE5bZTK2Nou4g0AI3zZ9rswp7GRKoKXS1BLUkvPviOqs4YTN1djQIqrXy9k5gEtdLPy86JjRwsNM9tnDcA==",
-            "dev": true,
-            "dependencies": {
-                "parse-passwd": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/hosted-git-info": {
-            "version": "2.8.8",
-            "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.8.tgz",
-            "integrity": "sha512-f/wzC2QaWBs7t9IYqB4T3sR1xviIViXJRJTWBlx2Gf3g0Xi5vI7Yy4koXQ1c9OYDGHN9sBy1DQ2AB8fqZBWhUg=="
-        },
-        "node_modules/howler": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/howler/-/howler-2.2.0.tgz",
-            "integrity": "sha512-sGPkrAQy7jh5mNDbkRNG0F82R2HFDYNsQXBcX4smXQT0y0F4UMsa/+jXaGwWvcrajWr2tDB7JUkH7G5qSnuIyQ=="
-        },
-        "node_modules/hpack.js": {
-            "version": "2.1.6",
-            "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
-            "integrity": "sha1-h3dMCUnlE/QuhFdbPEVoH63ioLI=",
-            "dev": true,
-            "dependencies": {
-                "inherits": "^2.0.1",
-                "obuf": "^1.0.0",
-                "readable-stream": "^2.0.1",
-                "wbuf": "^1.1.0"
-            }
-        },
-        "node_modules/hpack.js/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/html": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/html/-/html-1.0.0.tgz",
-            "integrity": "sha1-pUT6nqVJK/s6LMqCEKEL57WvH2E=",
-            "dependencies": {
-                "concat-stream": "^1.4.7"
-            },
-            "bin": {
-                "html": "bin/html.js"
-            }
-        },
-        "node_modules/html-encoding-sniffer": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-1.0.2.tgz",
-            "integrity": "sha512-71lZziiDnsuabfdYiUeWdCVyKuqwWi23L8YeIgV9jSSZHCtb6wB1BKWooH7L3tn4/FuZJMVWyNaIDr4RGmaSYw==",
-            "dev": true,
-            "dependencies": {
-                "whatwg-encoding": "^1.0.1"
-            }
-        },
-        "node_modules/html-entities": {
-            "version": "1.3.1",
-            "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.3.1.tgz",
-            "integrity": "sha512-rhE/4Z3hIhzHAUKbW8jVcCyuT5oJCXXqhN/6mXXVCpzTmvJnoH2HL/bt3EZ6p55jbFJBeAe1ZNpL5BugLujxNA==",
-            "dev": true
-        },
-        "node_modules/html-to-image": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/html-to-image/-/html-to-image-0.1.1.tgz",
-            "integrity": "sha512-UAjpXmokENeOyzfLwL0+zQ502lXyg6pkzVUmRjtljOH9dR/YdEYQhWrQ/O14hmH5/1L7jv1aOupU4Zi3Y8+iow=="
-        },
-        "node_modules/html-to-text": {
-            "version": "5.1.1",
-            "resolved": "https://registry.npmjs.org/html-to-text/-/html-to-text-5.1.1.tgz",
-            "integrity": "sha512-Bci6bD/JIfZSvG4s0gW/9mMKwBRoe/1RWLxUME/d6WUSZCdY7T60bssf/jFf7EYXRyqU4P5xdClVqiYU0/ypdA==",
-            "dependencies": {
-                "he": "^1.2.0",
-                "htmlparser2": "^3.10.1",
-                "lodash": "^4.17.11",
-                "minimist": "^1.2.0"
-            },
-            "bin": {
-                "html-to-text": "bin/cli.js"
-            },
-            "engines": {
-                "node": ">= 4.0.0"
-            }
-        },
-        "node_modules/htmlparser2": {
-            "version": "3.10.1",
-            "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.10.1.tgz",
-            "integrity": "sha512-IgieNijUMbkDovyoKObU1DUhm1iwNYE/fuifEoEHfd1oZKZDaONBSkal7Y01shxsM49R4XaMdGez3WnF9UfiCQ==",
-            "dependencies": {
-                "domelementtype": "^1.3.1",
-                "domhandler": "^2.3.0",
-                "domutils": "^1.5.1",
-                "entities": "^1.1.1",
-                "inherits": "^2.0.1",
-                "readable-stream": "^3.1.1"
-            }
-        },
-        "node_modules/http-deceiver": {
-            "version": "1.2.7",
-            "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz",
-            "integrity": "sha1-+nFolEq5pRnTN8sL7HKE3D5yPYc=",
-            "dev": true
-        },
-        "node_modules/http-errors": {
-            "version": "1.7.2",
-            "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.7.2.tgz",
-            "integrity": "sha512-uUQBt3H/cSIVfch6i1EuPNy/YsRSOUBXTVfZ+yR7Zjez3qjBz6i9+i4zjNaoqcoFVI4lQJ5plg63TvGfRSDCRg==",
-            "dependencies": {
-                "depd": "~1.1.2",
-                "inherits": "2.0.3",
-                "setprototypeof": "1.1.1",
-                "statuses": ">= 1.5.0 < 2",
-                "toidentifier": "1.0.0"
-            },
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/http-errors/node_modules/inherits": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
-            "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
-        },
-        "node_modules/http-proxy": {
-            "version": "1.18.1",
-            "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.1.tgz",
-            "integrity": "sha512-7mz/721AbnJwIVbnaSv1Cz3Am0ZLT/UBwkC92VlxhXv/k/BBQfM2fXElQNC27BVGr0uwUpplYPQM9LnaBMR5NQ==",
-            "dev": true,
-            "dependencies": {
-                "eventemitter3": "^4.0.0",
-                "follow-redirects": "^1.0.0",
-                "requires-port": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=8.0.0"
-            }
-        },
-        "node_modules/http-proxy-middleware": {
-            "version": "0.19.1",
-            "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.19.1.tgz",
-            "integrity": "sha512-yHYTgWMQO8VvwNS22eLLloAkvungsKdKTLO8AJlftYIKNfJr3GK3zK0ZCfzDDGUBttdGc8xFy1mCitvNKQtC3Q==",
-            "dev": true,
-            "dependencies": {
-                "http-proxy": "^1.17.0",
-                "is-glob": "^4.0.0",
-                "lodash": "^4.17.11",
-                "micromatch": "^3.1.10"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/http-signature": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.2.0.tgz",
-            "integrity": "sha1-muzZJRFHcvPZW2WmCruPfBj7rOE=",
-            "dependencies": {
-                "assert-plus": "^1.0.0",
-                "jsprim": "^1.2.2",
-                "sshpk": "^1.7.0"
-            },
-            "engines": {
-                "node": ">=0.8",
-                "npm": ">=1.3.7"
-            }
-        },
-        "node_modules/https-browserify": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz",
-            "integrity": "sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM=",
-            "dev": true
-        },
-        "node_modules/https-proxy-agent": {
-            "version": "5.0.0",
-            "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-5.0.0.tgz",
-            "integrity": "sha512-EkYm5BcKUGiduxzSt3Eppko+PiNWNEpa4ySk9vTC6wDsQJW9rHSa+UhGNJoRYp7bz6Ht1eaRIa6QaJqO5rCFbA==",
-            "dependencies": {
-                "agent-base": "6",
-                "debug": "4"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/https-proxy-agent/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/hyphenate-style-name": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.3.tgz",
-            "integrity": "sha512-EcuixamT82oplpoJ2XU4pDtKGWQ7b00CD9f1ug9IaQ3p1bkHMiKCZ9ut9QDI6qsa6cpUuB+A/I+zLtdNK4n2DQ=="
-        },
-        "node_modules/i": {
-            "version": "0.3.6",
-            "resolved": "https://registry.npmjs.org/i/-/i-0.3.6.tgz",
-            "integrity": "sha1-2WyScyB28HJxG2sQ/X1PZa2O4j0=",
-            "engines": {
-                "node": ">=0.4"
-            }
-        },
-        "node_modules/iconv-lite": {
-            "version": "0.4.24",
-            "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
-            "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
-            "dependencies": {
-                "safer-buffer": ">= 2.1.2 < 3"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/icss-replace-symbols": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz",
-            "integrity": "sha1-Bupvg2ead0njhs/h/oEq5dsiPe0=",
-            "dev": true
-        },
-        "node_modules/icss-utils": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-4.1.1.tgz",
-            "integrity": "sha512-4aFq7wvWyMHKgxsH8QQtGpvbASCf+eM3wPRLI6R+MgAnTCZ6STYsRvttLvRWK0Nfif5piF394St3HeJDaljGPA==",
-            "dev": true,
-            "dependencies": {
-                "postcss": "^7.0.14"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/ieee754": {
-            "version": "1.1.13",
-            "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.13.tgz",
-            "integrity": "sha512-4vf7I2LYV/HaWerSo3XmlMkp5eZ83i+/CDluXi/IGTs/O1sejBNhTtnxzmRZfvOUqj7lZjqHkeTvpgSFDlWZTg=="
-        },
-        "node_modules/iferr": {
-            "version": "0.1.5",
-            "resolved": "https://registry.npmjs.org/iferr/-/iferr-0.1.5.tgz",
-            "integrity": "sha1-xg7taebY/bazEEofy8ocGS3FtQE=",
-            "dev": true
-        },
-        "node_modules/ignore": {
-            "version": "3.3.10",
-            "resolved": "https://registry.npmjs.org/ignore/-/ignore-3.3.10.tgz",
-            "integrity": "sha512-Pgs951kaMm5GXP7MOvxERINe3gsaVjUWFm+UZPSq9xYriQAksyhg0csnS0KXSNRD5NmNdapXEpjxG49+AKh/ug==",
-            "dev": true
-        },
-        "node_modules/ignore-by-default": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/ignore-by-default/-/ignore-by-default-1.0.1.tgz",
-            "integrity": "sha1-SMptcvbGo68Aqa1K5odr44ieKwk="
-        },
-        "node_modules/ignore-walk": {
-            "version": "3.0.3",
-            "resolved": "https://registry.npmjs.org/ignore-walk/-/ignore-walk-3.0.3.tgz",
-            "integrity": "sha512-m7o6xuOaT1aqheYHKf8W6J5pYH85ZI9w077erOzLje3JsB1gkafkAhHHY19dqjulgIZHFm32Cp5uNZgcQqdJKw==",
-            "dependencies": {
-                "minimatch": "^3.0.4"
-            }
-        },
-        "node_modules/image-data-uri": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/image-data-uri/-/image-data-uri-2.0.1.tgz",
-            "integrity": "sha512-BZh721F2Q5TwBdwpiqrBrHEdj8daj8KuMZK/DOCyqQlz1CqFhhuZWbK5ZCUnAvFJr8LaKHTaWl9ja3/a3DC2Ew==",
-            "dependencies": {
-                "fs-extra": "^0.26.7",
-                "magicli": "0.0.8",
-                "mime-types": "^2.1.18",
-                "request": "^2.88.0"
-            },
-            "bin": {
-                "image-data-uri": "bin/magicli.js"
-            }
-        },
-        "node_modules/image-size": {
-            "version": "0.7.5",
-            "resolved": "https://registry.npmjs.org/image-size/-/image-size-0.7.5.tgz",
-            "integrity": "sha512-Hiyv+mXHfFEP7LzUL/llg9RwFxxY+o9N3JVLIeG5E7iFIFAalxvRU9UZthBdYDEVnzHMgjnKJPPpay5BWf1g9g==",
-            "bin": {
-                "image-size": "bin/image-size.js"
-            },
-            "engines": {
-                "node": ">=6.9.0"
-            }
-        },
-        "node_modules/image-size-stream": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/image-size-stream/-/image-size-stream-1.1.0.tgz",
-            "integrity": "sha1-Ivou2mbG31AQh0bacUkmSy0l+Gs=",
-            "dependencies": {
-                "image-size": "github:netroy/image-size#da2c863807a3e9602617bdd357b0de3ab4a064c1",
-                "readable-stream": "^1.0.33",
-                "tryit": "^1.0.1"
-            }
-        },
-        "node_modules/image-size-stream/node_modules/image-size": {
-            "resolved": "git+ssh://git@github.com/netroy/image-size.git#da2c863807a3e9602617bdd357b0de3ab4a064c1",
-            "bin": {
-                "image-size": "bin/image-size"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/image-size-stream/node_modules/isarray": {
-            "version": "0.0.1",
-            "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-            "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
-        },
-        "node_modules/image-size-stream/node_modules/readable-stream": {
-            "version": "1.1.14",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
-            "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.1",
-                "isarray": "0.0.1",
-                "string_decoder": "~0.10.x"
-            }
-        },
-        "node_modules/image-size-stream/node_modules/string_decoder": {
-            "version": "0.10.31",
-            "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-            "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
-        },
-        "node_modules/immediate": {
-            "version": "3.0.6",
-            "resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz",
-            "integrity": "sha1-nbHb0Pr43m++D13V5Wu2BigN5ps="
-        },
-        "node_modules/import-fresh": {
-            "version": "3.2.1",
-            "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.2.1.tgz",
-            "integrity": "sha512-6e1q1cnWP2RXD9/keSkxHScg508CdXqXWgWBaETNhyuBFz+kUZlKboh+ISK+bU++DmbHimVBrOz/zzPe0sZ3sQ==",
-            "dependencies": {
-                "parent-module": "^1.0.0",
-                "resolve-from": "^4.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/import-lazy": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/import-lazy/-/import-lazy-2.1.0.tgz",
-            "integrity": "sha1-BWmOPUXIjo1+nZLLBYTnfwlvPkM=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/import-local": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/import-local/-/import-local-2.0.0.tgz",
-            "integrity": "sha512-b6s04m3O+s3CGSbqDIyP4R6aAwAeYlVq9+WUWep6iHa8ETRf9yei1U48C5MmfJmV9AiLYYBKPMq/W+/WRpQmCQ==",
-            "dev": true,
-            "dependencies": {
-                "pkg-dir": "^3.0.0",
-                "resolve-cwd": "^2.0.0"
-            },
-            "bin": {
-                "import-local-fixture": "fixtures/cli.js"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/import-local/node_modules/pkg-dir": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-3.0.0.tgz",
-            "integrity": "sha512-/E57AYkoeQ25qkxMj5PBOVgF8Kiu/h7cYS30Z5+R7WaiCCBfLq58ZI/dSeaEKb9WVJV5n/03QwrN3IeWIFllvw==",
-            "dev": true,
-            "dependencies": {
-                "find-up": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/imurmurhash": {
-            "version": "0.1.4",
-            "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
-            "integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o=",
-            "engines": {
-                "node": ">=0.8.19"
-            }
-        },
-        "node_modules/in-publish": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.1.tgz",
-            "integrity": "sha512-oDM0kUSNFC31ShNxHKUyfZKy8ZeXZBWMjMdZHKLOk13uvT27VTL/QzRGfRUcevJhpkZAvlhPYuXkF7eNWrtyxQ==",
-            "bin": {
-                "in-install": "in-install.js",
-                "in-publish": "in-publish.js",
-                "not-in-install": "not-in-install.js",
-                "not-in-publish": "not-in-publish.js"
-            }
-        },
-        "node_modules/indent-string": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz",
-            "integrity": "sha1-ji1INIdCEhtKghi3oTfppSBJ3IA=",
-            "dependencies": {
-                "repeating": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/indexes-of": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz",
-            "integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc=",
-            "dev": true
-        },
-        "node_modules/indexof": {
-            "version": "0.0.1",
-            "resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz",
-            "integrity": "sha1-gtwzbSMrkGIXnQWrMpOmYFn9Q10="
-        },
-        "node_modules/infer-owner": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/infer-owner/-/infer-owner-1.0.4.tgz",
-            "integrity": "sha512-IClj+Xz94+d7irH5qRyfJonOdfTzuDaifE6ZPWfx0N0+/ATZCbuTPq2prFl526urkQd90WyUKIh1DfBQ2hMz9A==",
-            "dev": true
-        },
-        "node_modules/inflight": {
-            "version": "1.0.6",
-            "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
-            "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
-            "dependencies": {
-                "once": "^1.3.0",
-                "wrappy": "1"
-            }
-        },
-        "node_modules/infobox-parser": {
-            "version": "3.3.1",
-            "resolved": "https://registry.npmjs.org/infobox-parser/-/infobox-parser-3.3.1.tgz",
-            "integrity": "sha512-Aj1uF/taawGhet8cazhXz2uEDFMOqH8hnuw720wvi7Zw6bJWmA45Ta2FI9xMG5wvvo4CB6GR9S1/RUFtC6EtAg==",
-            "dependencies": {
-                "camelcase": "^4.1.0"
-            }
-        },
-        "node_modules/infobox-parser/node_modules/camelcase": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
-            "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/inherits": {
-            "version": "2.0.4",
-            "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
-            "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
-        },
-        "node_modules/ini": {
-            "version": "1.3.5",
-            "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz",
-            "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/inline-style-prefixer": {
-            "version": "3.0.8",
-            "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.8.tgz",
-            "integrity": "sha1-hVG45bTVcyROZqNLBPfTIHaitTQ=",
-            "dependencies": {
-                "bowser": "^1.7.3",
-                "css-in-js-utils": "^2.0.0"
-            }
-        },
-        "node_modules/inspect-function": {
-            "version": "0.2.2",
-            "resolved": "https://registry.npmjs.org/inspect-function/-/inspect-function-0.2.2.tgz",
-            "integrity": "sha1-hdoMUli8TDMK4yg7Z0fgdZ2QpjU=",
-            "dependencies": {
-                "split-skip": "0.0.1",
-                "unpack-string": "0.0.2"
-            }
-        },
-        "node_modules/inspect-function/node_modules/split-skip": {
-            "version": "0.0.1",
-            "resolved": "https://registry.npmjs.org/split-skip/-/split-skip-0.0.1.tgz",
-            "integrity": "sha1-gK2ONumOV2RUzDtmfB3SXYZejwA="
-        },
-        "node_modules/inspect-parameters-declaration": {
-            "version": "0.0.9",
-            "resolved": "https://registry.npmjs.org/inspect-parameters-declaration/-/inspect-parameters-declaration-0.0.9.tgz",
-            "integrity": "sha512-c3jrKKA1rwwrsjdGMAo2hFWV0vNe3/RKHxpE/OBt41LP3ynOVI1qmgxpZYK5SQu3jtWCyaho8L7AZzCjJ4mEUw==",
-            "dependencies": {
-                "magicli": "0.0.5",
-                "split-skip": "0.0.2",
-                "stringify-parameters": "0.0.4",
-                "unpack-string": "0.0.2"
-            },
-            "bin": {
-                "inspect-parameters-declaration": "bin/cli.js"
-            }
-        },
-        "node_modules/inspect-parameters-declaration/node_modules/magicli": {
-            "version": "0.0.5",
-            "resolved": "https://registry.npmjs.org/magicli/-/magicli-0.0.5.tgz",
-            "integrity": "sha1-zufQ+7THBRiqyxHsPrfiX/SaSSE=",
-            "dependencies": {
-                "commander": "^2.9.0",
-                "get-stdin": "^5.0.1",
-                "inspect-function": "^0.2.1",
-                "pipe-functions": "^1.2.0"
-            }
-        },
-        "node_modules/inspect-property": {
-            "version": "0.0.6",
-            "resolved": "https://registry.npmjs.org/inspect-property/-/inspect-property-0.0.6.tgz",
-            "integrity": "sha512-LgjHkRl9W6bj2n+kWrAOgvCYPTYt+LanE4rtd/vKNq6yEb+SvVV7UTLzoSPpDX6/U1cAz7VfqPr+lPAIz7wHaQ==",
-            "dependencies": {
-                "for-each-property": "0.0.4",
-                "for-each-property-deep": "0.0.3",
-                "inspect-function": "^0.3.1"
-            }
-        },
-        "node_modules/inspect-property/node_modules/inspect-function": {
-            "version": "0.3.4",
-            "resolved": "https://registry.npmjs.org/inspect-function/-/inspect-function-0.3.4.tgz",
-            "integrity": "sha512-s0RsbJqK/sNZ+U1mykGoTickog3ea1A9Qk4mXniogOBu4PgkkZ56elScO7QC/r8D94lhGmJ2NyDI1ipOA/uq/g==",
-            "dependencies": {
-                "inspect-parameters-declaration": "0.0.8",
-                "magicli": "0.0.8",
-                "split-skip": "0.0.1",
-                "stringify-parameters": "0.0.4",
-                "unpack-string": "0.0.2"
-            },
-            "bin": {
-                "inspect-function": "bin/magicli.js"
-            }
-        },
-        "node_modules/inspect-property/node_modules/inspect-parameters-declaration": {
-            "version": "0.0.8",
-            "resolved": "https://registry.npmjs.org/inspect-parameters-declaration/-/inspect-parameters-declaration-0.0.8.tgz",
-            "integrity": "sha512-W4QzN1LgFmasKOM+NoLlDd2OAZM3enNZlVUOXoGQKmYBDFgxoPDOyebF55ALaf8avyM9TavNwibXxg347RrzCg==",
-            "dependencies": {
-                "magicli": "0.0.5",
-                "split-skip": "0.0.2",
-                "stringify-parameters": "0.0.4",
-                "unpack-string": "0.0.2"
-            },
-            "bin": {
-                "inspect-parameters-declaration": "bin/cli.js"
-            }
-        },
-        "node_modules/inspect-property/node_modules/inspect-parameters-declaration/node_modules/inspect-function": {
-            "version": "0.2.2",
-            "resolved": "https://registry.npmjs.org/inspect-function/-/inspect-function-0.2.2.tgz",
-            "integrity": "sha1-hdoMUli8TDMK4yg7Z0fgdZ2QpjU=",
-            "dependencies": {
-                "split-skip": "0.0.1",
-                "unpack-string": "0.0.2"
-            }
-        },
-        "node_modules/inspect-property/node_modules/inspect-parameters-declaration/node_modules/inspect-function/node_modules/split-skip": {
-            "version": "0.0.1",
-            "resolved": "https://registry.npmjs.org/split-skip/-/split-skip-0.0.1.tgz",
-            "integrity": "sha1-gK2ONumOV2RUzDtmfB3SXYZejwA="
-        },
-        "node_modules/inspect-property/node_modules/inspect-parameters-declaration/node_modules/magicli": {
-            "version": "0.0.5",
-            "resolved": "https://registry.npmjs.org/magicli/-/magicli-0.0.5.tgz",
-            "integrity": "sha1-zufQ+7THBRiqyxHsPrfiX/SaSSE=",
-            "dependencies": {
-                "commander": "^2.9.0",
-                "get-stdin": "^5.0.1",
-                "inspect-function": "^0.2.1",
-                "pipe-functions": "^1.2.0"
-            }
-        },
-        "node_modules/inspect-property/node_modules/inspect-parameters-declaration/node_modules/split-skip": {
-            "version": "0.0.2",
-            "resolved": "https://registry.npmjs.org/split-skip/-/split-skip-0.0.2.tgz",
-            "integrity": "sha1-2J2Iu9L3Pka1FYqjcKVhIk6A1GE="
-        },
-        "node_modules/inspect-property/node_modules/split-skip": {
-            "version": "0.0.1",
-            "resolved": "https://registry.npmjs.org/split-skip/-/split-skip-0.0.1.tgz",
-            "integrity": "sha1-gK2ONumOV2RUzDtmfB3SXYZejwA="
-        },
-        "node_modules/internal-ip": {
-            "version": "4.3.0",
-            "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-4.3.0.tgz",
-            "integrity": "sha512-S1zBo1D6zcsyuC6PMmY5+55YMILQ9av8lotMx447Bq6SAgo/sDK6y6uUKmuYhW7eacnIhFfsPmCNYdDzsnnDCg==",
-            "dev": true,
-            "dependencies": {
-                "default-gateway": "^4.2.0",
-                "ipaddr.js": "^1.9.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/internmap": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/internmap/-/internmap-1.0.0.tgz",
-            "integrity": "sha512-SdoDWwNOTE2n4JWUsLn4KXZGuZPjPF9yyOGc8bnfWnBQh7BD/l80rzSznKc/r4Y0aQ7z3RTk9X+tV4tHBpu+dA=="
-        },
-        "node_modules/interpret": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.2.0.tgz",
-            "integrity": "sha512-mT34yGKMNceBQUoVn7iCDKDntA7SC6gycMAWzGx1z/CMCTV7b2AAtXlo3nRyHZ1FelRkQbQjprHSYGwzLtkVbw==",
-            "engines": {
-                "node": ">= 0.10"
-            }
-        },
-        "node_modules/interval-arithmetic": {
-            "version": "1.0.6",
-            "resolved": "https://registry.npmjs.org/interval-arithmetic/-/interval-arithmetic-1.0.6.tgz",
-            "integrity": "sha512-eVotDGYPNiEaJ63oa4CeEHgOczZJ3gNHqG5wfVQ2o8sN2CEczQyR82Sjey/Bp36x8e7PtBcBvitcMnw6VUpjgQ==",
-            "dependencies": {
-                "@types/assert": "^1.4.6",
-                "is-safe-integer": "^2.0.0",
-                "nextafter": "^1.0.0",
-                "typedarray": "0.0.6"
-            }
-        },
-        "node_modules/interval-arithmetic-eval": {
-            "version": "0.4.7",
-            "resolved": "https://registry.npmjs.org/interval-arithmetic-eval/-/interval-arithmetic-eval-0.4.7.tgz",
-            "integrity": "sha512-ClK+N4efbsgjlZR8h0qd0LQbyzUzJ9IkrjmTnD5MVb4Ytebd0lesoVP4AxLclcsEI+nIieskQ8cepHIWUPaRhQ==",
-            "dependencies": {
-                "interval-arithmetic": "^1.0.6",
-                "math-codegen": "^0.3.5"
-            }
-        },
-        "node_modules/ip": {
-            "version": "1.1.5",
-            "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
-            "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo=",
-            "dev": true
-        },
-        "node_modules/ip-regex": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/ip-regex/-/ip-regex-2.1.0.tgz",
-            "integrity": "sha1-+ni/XS5pE8kRzp+BnuUUa7bYROk=",
-            "dev": true,
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/ipaddr.js": {
-            "version": "1.9.1",
-            "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz",
-            "integrity": "sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==",
-            "engines": {
-                "node": ">= 0.10"
-            }
-        },
-        "node_modules/is-absolute-url": {
-            "version": "3.0.3",
-            "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-3.0.3.tgz",
-            "integrity": "sha512-opmNIX7uFnS96NtPmhWQgQx6/NYFgsUXYMllcfzwWKUMwfo8kku1TvE6hkNcH+Q1ts5cMVrsY7j0bxXQDciu9Q==",
-            "dev": true,
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/is-accessor-descriptor": {
-            "version": "0.1.6",
-            "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
-            "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
-            "dependencies": {
-                "kind-of": "^3.0.2"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-accessor-descriptor/node_modules/is-buffer": {
-            "version": "1.1.6",
-            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
-            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
-        },
-        "node_modules/is-accessor-descriptor/node_modules/kind-of": {
-            "version": "3.2.2",
-            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-            "dependencies": {
-                "is-buffer": "^1.1.5"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-arguments": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.0.4.tgz",
-            "integrity": "sha512-xPh0Rmt8NE65sNzvyUmWgI1tz3mKq74lGA0mL8LYZcoIzKOzDh6HmrYm3d18k60nHerC8A9Km8kYu87zfSFnLA==",
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/is-arrayish": {
-            "version": "0.2.1",
-            "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
-            "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0="
-        },
-        "node_modules/is-binary-path": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz",
-            "integrity": "sha1-dfFmQrSA8YenEcgUFh/TpKdlWJg=",
-            "dependencies": {
-                "binary-extensions": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-buffer": {
-            "version": "2.0.4",
-            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.4.tgz",
-            "integrity": "sha512-Kq1rokWXOPXWuaMAqZiJW4XxsmD9zGx9q4aePabbn3qCRGedtH7Cm+zV8WETitMfu1wdh+Rvd6w5egwSngUX2A==",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/is-callable": {
-            "version": "1.1.5",
-            "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.5.tgz",
-            "integrity": "sha512-ESKv5sMCJB2jnHTWZ3O5itG+O128Hsus4K4Qh1h2/cgn2vbgnLSVqfV46AeJA9D5EeeLa9w81KUXMtn34zhX+Q==",
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/is-ci": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/is-ci/-/is-ci-1.2.1.tgz",
-            "integrity": "sha512-s6tfsaQaQi3JNciBH6shVqEDvhGut0SUXr31ag8Pd8BBbVVlcGfWhpPmEOoM6RJ5TFhbypvf5yyRw/VXW1IiWg==",
-            "dependencies": {
-                "ci-info": "^1.5.0"
-            },
-            "bin": {
-                "is-ci": "bin.js"
-            }
-        },
-        "node_modules/is-data-descriptor": {
-            "version": "0.1.4",
-            "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
-            "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
-            "dependencies": {
-                "kind-of": "^3.0.2"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-data-descriptor/node_modules/is-buffer": {
-            "version": "1.1.6",
-            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
-            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
-        },
-        "node_modules/is-data-descriptor/node_modules/kind-of": {
-            "version": "3.2.2",
-            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-            "dependencies": {
-                "is-buffer": "^1.1.5"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-date-object": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.2.tgz",
-            "integrity": "sha512-USlDT524woQ08aoZFzh3/Z6ch9Y/EWXEHQ/AaRN0SkKq4t2Jw2R2339tSXmwuVoY7LLlBCbOIlx2myP/L5zk0g==",
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/is-descriptor": {
-            "version": "0.1.6",
-            "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
-            "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==",
-            "dependencies": {
-                "is-accessor-descriptor": "^0.1.6",
-                "is-data-descriptor": "^0.1.4",
-                "kind-of": "^5.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-descriptor/node_modules/kind-of": {
-            "version": "5.1.0",
-            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
-            "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-directory": {
-            "version": "0.3.1",
-            "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz",
-            "integrity": "sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-expression": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/is-expression/-/is-expression-3.0.0.tgz",
-            "integrity": "sha1-Oayqa+f9HzRx3ELHQW5hwkMXrJ8=",
-            "dependencies": {
-                "acorn": "~4.0.2",
-                "object-assign": "^4.0.1"
-            }
-        },
-        "node_modules/is-expression/node_modules/acorn": {
-            "version": "4.0.13",
-            "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
-            "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c=",
-            "bin": {
-                "acorn": "bin/acorn"
-            },
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/is-extendable": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-1.0.1.tgz",
-            "integrity": "sha512-arnXMxT1hhoKo9k1LZdmlNyJdDDfy2v0fXjFlmok4+i8ul/6WlbVge9bhM74OpNPQPMGUToDtz+KXa1PneJxOA==",
-            "dependencies": {
-                "is-plain-object": "^2.0.4"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-extglob": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
-            "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-finite": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.1.0.tgz",
-            "integrity": "sha512-cdyMtqX/BOqqNBBiKlIVkytNHm49MtMlYyn1zxzvJKWmFMlGzm+ry5BBfYyeY9YmNKbRSo/o7OX9w9ale0wg3w==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-fullwidth-code-point": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
-            "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/is-glob": {
-            "version": "4.0.1",
-            "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.1.tgz",
-            "integrity": "sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg==",
-            "dependencies": {
-                "is-extglob": "^2.1.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-in-browser": {
-            "version": "1.1.3",
-            "resolved": "https://registry.npmjs.org/is-in-browser/-/is-in-browser-1.1.3.tgz",
-            "integrity": "sha1-Vv9NtoOgeMYILrldrX3GLh0E+DU="
-        },
-        "node_modules/is-installed-globally": {
-            "version": "0.1.0",
-            "resolved": "https://registry.npmjs.org/is-installed-globally/-/is-installed-globally-0.1.0.tgz",
-            "integrity": "sha1-Df2Y9akRFxbdU13aZJL2e/PSWoA=",
-            "dependencies": {
-                "global-dirs": "^0.1.0",
-                "is-path-inside": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/is-npm": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/is-npm/-/is-npm-1.0.0.tgz",
-            "integrity": "sha1-8vtjpl5JBbQGyGBydloaTceTufQ=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-number": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
-            "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
-            "dependencies": {
-                "kind-of": "^3.0.2"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-number/node_modules/is-buffer": {
-            "version": "1.1.6",
-            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
-            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
-        },
-        "node_modules/is-number/node_modules/kind-of": {
-            "version": "3.2.2",
-            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-            "dependencies": {
-                "is-buffer": "^1.1.5"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-obj": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
-            "integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-path-cwd": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-2.2.0.tgz",
-            "integrity": "sha512-w942bTcih8fdJPJmQHFzkS76NEP8Kzzvmw92cXsazb8intwLqPibPPdXf4ANdKV3rYMuuQYGIWtvz9JilB3NFQ==",
-            "dev": true,
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/is-path-in-cwd": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-2.1.0.tgz",
-            "integrity": "sha512-rNocXHgipO+rvnP6dk3zI20RpOtrAM/kzbB258Uw5BWr3TpXi861yzjo16Dn4hUox07iw5AyeMLHWsujkjzvRQ==",
-            "dev": true,
-            "dependencies": {
-                "is-path-inside": "^2.1.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/is-path-in-cwd/node_modules/is-path-inside": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-2.1.0.tgz",
-            "integrity": "sha512-wiyhTzfDWsvwAW53OBWF5zuvaOGlZ6PwYxAbPVDhpm+gM09xKQGjBq/8uYN12aDvMxnAnq3dxTyoSoRNmg5YFg==",
-            "dev": true,
-            "dependencies": {
-                "path-is-inside": "^1.0.2"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/is-path-inside": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.1.tgz",
-            "integrity": "sha1-jvW33lBDej/cprToZe96pVy0gDY=",
-            "dependencies": {
-                "path-is-inside": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-plain-object": {
-            "version": "2.0.4",
-            "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
-            "integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==",
-            "dependencies": {
-                "isobject": "^3.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-promise": {
-            "version": "2.2.2",
-            "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-2.2.2.tgz",
-            "integrity": "sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ=="
-        },
-        "node_modules/is-redirect": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/is-redirect/-/is-redirect-1.0.0.tgz",
-            "integrity": "sha1-HQPd7VO9jbDzDCbk+V02/HyH3CQ=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-regex": {
-            "version": "1.0.5",
-            "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.5.tgz",
-            "integrity": "sha512-vlKW17SNq44owv5AQR3Cq0bQPEb8+kF3UKZ2fiZNOWtztYE5i0CzCZxFDwO58qAOWtxdBRVO/V5Qin1wjCqFYQ==",
-            "dependencies": {
-                "has": "^1.0.3"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/is-retry-allowed": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.2.0.tgz",
-            "integrity": "sha512-RUbUeKwvm3XG2VYamhJL1xFktgjvPzL0Hq8C+6yrWIswDy3BIXGqCxhxkc30N9jqK311gVU137K8Ei55/zVJRg==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-safe-integer": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/is-safe-integer/-/is-safe-integer-2.0.0.tgz",
-            "integrity": "sha512-eDaA39/1+3SNtYTRP28lRYOHMwiB1gfqXQaXcf/+f4mLwKgm8TTDkwJldsdtbgrK1R5CoDbf6AQ0KqP7BKoGtQ==",
-            "dependencies": {
-                "max-safe-integer": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-stream": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
-            "integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-symbol": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.3.tgz",
-            "integrity": "sha512-OwijhaRSgqvhm/0ZdAcXNZt9lYdKFpcRDT5ULUuYXPoT794UNOdU+gpT6Rzo7b4V2HUl/op6GqY894AZwv9faQ==",
-            "dependencies": {
-                "has-symbols": "^1.0.1"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/is-typedarray": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
-            "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo="
-        },
-        "node_modules/is-utf8": {
-            "version": "0.2.1",
-            "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
-            "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI="
-        },
-        "node_modules/is-what": {
-            "version": "3.10.0",
-            "resolved": "https://registry.npmjs.org/is-what/-/is-what-3.10.0.tgz",
-            "integrity": "sha512-U4RYCXNOmATQHlOPlOCHCfXyKEFIPqvyaKDqYRuLbD6EYKcTTfc3YXkAYjzOVxO3zt34L+Wh2feIyWrYiZ7kng=="
-        },
-        "node_modules/is-windows": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-1.0.2.tgz",
-            "integrity": "sha512-eXK1UInq2bPmjyX6e3VHIzMLobc4J94i4AWn+Hpq3OU5KkrRC96OAcR3PRJ/pGu6m8TRnBHP9dkXQVsT/COVIA==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/is-wsl": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-1.1.0.tgz",
-            "integrity": "sha1-HxbkqiKwTRM2tmGIpmrzxgDDpm0=",
-            "dev": true,
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/isarray": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-            "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "node_modules/isexe": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-            "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA="
-        },
-        "node_modules/isobject": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
-            "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/isomorphic-fetch": {
-            "version": "2.2.1",
-            "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
-            "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=",
-            "dependencies": {
-                "node-fetch": "^1.0.1",
-                "whatwg-fetch": ">=0.10.0"
-            }
-        },
-        "node_modules/isstream": {
-            "version": "0.1.2",
-            "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
-            "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo="
-        },
-        "node_modules/its-set": {
-            "version": "1.2.3",
-            "resolved": "https://registry.npmjs.org/its-set/-/its-set-1.2.3.tgz",
-            "integrity": "sha512-UQc+xLLn+0a8KKRXRj3OS2kERK8G7zcayPpPULqZnPwuJ1hGWEO8+j0T5eycu7DKXYjezw3pyF8oV1fJkJxV5w==",
-            "dependencies": {
-                "babel-runtime": "6.x.x",
-                "lodash.get": "^4.4.2"
-            }
-        },
-        "node_modules/jquery": {
-            "version": "3.5.1",
-            "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.5.1.tgz",
-            "integrity": "sha512-XwIBPqcMn57FxfT+Go5pzySnm4KWkT1Tv7gjrpT1srtf8Weynl6R273VJ5GjkRb51IzMp5nbaPjJXMWeju2MKg=="
-        },
-        "node_modules/js-base64": {
-            "version": "2.5.2",
-            "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.5.2.tgz",
-            "integrity": "sha512-Vg8czh0Q7sFBSUMWWArX/miJeBWYBPpdU/3M/DKSaekLMqrqVPaedp+5mZhie/r0lgrcaYBfwXatEew6gwgiQQ=="
-        },
-        "node_modules/js-datepicker": {
-            "version": "4.6.6",
-            "resolved": "https://registry.npmjs.org/js-datepicker/-/js-datepicker-4.6.6.tgz",
-            "integrity": "sha512-kLsE2oHfQM6pzdWNA7Y8HwCHaZIVURItPds7YVJnbe1z1OmQFzN7lfg6yFbDDWOyNjdHZGzWDy3jSDN2W0pNZQ=="
-        },
-        "node_modules/js-stringify": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/js-stringify/-/js-stringify-1.0.2.tgz",
-            "integrity": "sha1-Fzb939lyTyijaCrcYjCufk6Weds="
-        },
-        "node_modules/js-tokens": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
-            "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
-        },
-        "node_modules/js-yaml": {
-            "version": "3.13.1",
-            "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.13.1.tgz",
-            "integrity": "sha512-YfbcO7jXDdyj0DGxYVSlSeQNHbD7XPWvrVWeVUujrQEoZzWJIRrCPoyk6kL6IAjAG2IolMK4T0hNUe0HOUs5Jw==",
-            "dependencies": {
-                "argparse": "^1.0.7",
-                "esprima": "^4.0.0"
-            },
-            "bin": {
-                "js-yaml": "bin/js-yaml.js"
-            }
-        },
-        "node_modules/jsbn": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
-            "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM="
-        },
-        "node_modules/jsdom": {
-            "version": "15.2.1",
-            "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-15.2.1.tgz",
-            "integrity": "sha512-fAl1W0/7T2G5vURSyxBzrJ1LSdQn6Tr5UX/xD4PXDx/PDgwygedfW6El/KIj3xJ7FU61TTYnc/l/B7P49Eqt6g==",
-            "dev": true,
-            "dependencies": {
-                "abab": "^2.0.0",
-                "acorn": "^7.1.0",
-                "acorn-globals": "^4.3.2",
-                "array-equal": "^1.0.0",
-                "cssom": "^0.4.1",
-                "cssstyle": "^2.0.0",
-                "data-urls": "^1.1.0",
-                "domexception": "^1.0.1",
-                "escodegen": "^1.11.1",
-                "html-encoding-sniffer": "^1.0.2",
-                "nwsapi": "^2.2.0",
-                "parse5": "5.1.0",
-                "pn": "^1.1.0",
-                "request": "^2.88.0",
-                "request-promise-native": "^1.0.7",
-                "saxes": "^3.1.9",
-                "symbol-tree": "^3.2.2",
-                "tough-cookie": "^3.0.1",
-                "w3c-hr-time": "^1.0.1",
-                "w3c-xmlserializer": "^1.1.2",
-                "webidl-conversions": "^4.0.2",
-                "whatwg-encoding": "^1.0.5",
-                "whatwg-mimetype": "^2.3.0",
-                "whatwg-url": "^7.0.0",
-                "ws": "^7.0.0",
-                "xml-name-validator": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/jsdom/node_modules/acorn": {
-            "version": "7.1.1",
-            "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.1.1.tgz",
-            "integrity": "sha512-add7dgA5ppRPxCFJoAGfMDi7PIBXq1RtGo7BhbLaxwrXPOmw8gq48Y9ozT01hUKy9byMjlR20EJhu5zlkErEkg==",
-            "dev": true,
-            "bin": {
-                "acorn": "bin/acorn"
-            },
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/jsdom/node_modules/acorn-globals": {
-            "version": "4.3.4",
-            "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-4.3.4.tgz",
-            "integrity": "sha512-clfQEh21R+D0leSbUdWf3OcfqyaCSAQ8Ryq00bofSekfr9W8u1jyYZo6ir0xu9Gtcf7BjcHJpnbZH7JOCpP60A==",
-            "dev": true,
-            "dependencies": {
-                "acorn": "^6.0.1",
-                "acorn-walk": "^6.0.1"
-            }
-        },
-        "node_modules/jsdom/node_modules/acorn-globals/node_modules/acorn": {
-            "version": "6.4.1",
-            "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.1.tgz",
-            "integrity": "sha512-ZVA9k326Nwrj3Cj9jlh3wGFutC2ZornPNARZwsNYqQYgN0EsV2d53w5RN/co65Ohn4sUAUtb1rSUAOD6XN9idA==",
-            "dev": true,
-            "bin": {
-                "acorn": "bin/acorn"
-            },
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/jsdom/node_modules/parse5": {
-            "version": "5.1.0",
-            "resolved": "https://registry.npmjs.org/parse5/-/parse5-5.1.0.tgz",
-            "integrity": "sha512-fxNG2sQjHvlVAYmzBZS9YlDp6PTSSDwa98vkD4QgVDDCAo84z5X1t5XyJQ62ImdLXx5NdIIfihey6xpum9/gRQ==",
-            "dev": true
-        },
-        "node_modules/jsdom/node_modules/tough-cookie": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-3.0.1.tgz",
-            "integrity": "sha512-yQyJ0u4pZsv9D4clxO69OEjLWYw+jbgspjTue4lTQZLfV0c5l1VmK2y1JK8E9ahdpltPOaAThPcp5nKPUgSnsg==",
-            "dev": true,
-            "dependencies": {
-                "ip-regex": "^2.1.0",
-                "psl": "^1.1.28",
-                "punycode": "^2.1.1"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/jsesc": {
-            "version": "2.5.2",
-            "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz",
-            "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==",
-            "bin": {
-                "jsesc": "bin/jsesc"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/json-bigint": {
-            "version": "0.3.0",
-            "resolved": "https://registry.npmjs.org/json-bigint/-/json-bigint-0.3.0.tgz",
-            "integrity": "sha1-DM2RLEuCcNBfBW+9E4FLU9OCWx4=",
-            "dependencies": {
-                "bignumber.js": "^7.0.0"
-            }
-        },
-        "node_modules/json-parse-better-errors": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz",
-            "integrity": "sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw=="
-        },
-        "node_modules/json-schema": {
-            "version": "0.2.3",
-            "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
-            "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM="
-        },
-        "node_modules/json-schema-traverse": {
-            "version": "0.4.1",
-            "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
-            "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg=="
-        },
-        "node_modules/json-stringify-safe": {
-            "version": "5.0.1",
-            "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
-            "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus="
-        },
-        "node_modules/json3": {
-            "version": "3.3.3",
-            "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.3.tgz",
-            "integrity": "sha512-c7/8mbUsKigAbLkD5B010BK4D9LZm7A1pNItkEwiUZRpIN66exu/e7YQWysGun+TRKaJp8MhemM+VkfWv42aCA==",
-            "dev": true
-        },
-        "node_modules/jsondiffpatch": {
-            "version": "0.4.1",
-            "resolved": "https://registry.npmjs.org/jsondiffpatch/-/jsondiffpatch-0.4.1.tgz",
-            "integrity": "sha512-t0etAxTUk1w5MYdNOkZBZ8rvYYN5iL+2dHCCx/DpkFm/bW28M6y5nUS83D4XdZiHy35Fpaw6LBb+F88fHZnVCw==",
-            "dependencies": {
-                "chalk": "^2.3.0",
-                "diff-match-patch": "^1.0.0"
-            },
-            "bin": {
-                "jsondiffpatch": "bin/jsondiffpatch"
-            },
-            "engines": {
-                "node": ">=8.17.0"
-            }
-        },
-        "node_modules/jsonfile": {
-            "version": "2.4.0",
-            "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
-            "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=",
-            "dependencies": {
-                "graceful-fs": "^4.1.6"
-            }
-        },
-        "node_modules/jsonschema": {
-            "version": "1.2.6",
-            "resolved": "https://registry.npmjs.org/jsonschema/-/jsonschema-1.2.6.tgz",
-            "integrity": "sha512-SqhURKZG07JyKKeo/ir24QnS4/BV7a6gQy93bUSe4lUdNp0QNpIz2c9elWJQ9dpc5cQYY6cvCzgRwy0MQCLyqA==",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/jsprim": {
-            "version": "1.4.1",
-            "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
-            "integrity": "sha1-MT5mvB5cwG5Di8G3SZwuXFastqI=",
-            "engines": [
-                "node >=0.6.0"
-            ],
-            "dependencies": {
-                "assert-plus": "1.0.0",
-                "extsprintf": "1.3.0",
-                "json-schema": "0.2.3",
-                "verror": "1.10.0"
-            }
-        },
-        "node_modules/jss": {
-            "version": "10.3.0",
-            "resolved": "https://registry.npmjs.org/jss/-/jss-10.3.0.tgz",
-            "integrity": "sha512-B5sTRW9B6uHaUVzSo9YiMEOEp3UX8lWevU0Fsv+xtRnsShmgCfIYX44bTH8bPJe6LQKqEXku3ulKuHLbxBS97Q==",
-            "dependencies": {
-                "@babel/runtime": "^7.3.1",
-                "csstype": "^2.6.5",
-                "is-in-browser": "^1.1.3",
-                "tiny-warning": "^1.0.2"
-            }
-        },
-        "node_modules/jss-plugin-camel-case": {
-            "version": "10.3.0",
-            "resolved": "https://registry.npmjs.org/jss-plugin-camel-case/-/jss-plugin-camel-case-10.3.0.tgz",
-            "integrity": "sha512-tadWRi/SLWqLK3EUZEdDNJL71F3ST93Zrl9JYMjV0QDqKPAl0Liue81q7m/nFUpnSTXczbKDy4wq8rI8o7WFqA==",
-            "dependencies": {
-                "@babel/runtime": "^7.3.1",
-                "hyphenate-style-name": "^1.0.3",
-                "jss": "^10.3.0"
-            }
-        },
-        "node_modules/jss-plugin-default-unit": {
-            "version": "10.3.0",
-            "resolved": "https://registry.npmjs.org/jss-plugin-default-unit/-/jss-plugin-default-unit-10.3.0.tgz",
-            "integrity": "sha512-tT5KkIXAsZOSS9WDSe8m8lEHIjoEOj4Pr0WrG0WZZsMXZ1mVLFCSsD2jdWarQWDaRNyMj/I4d7czRRObhOxSuw==",
-            "dependencies": {
-                "@babel/runtime": "^7.3.1",
-                "jss": "^10.3.0"
-            }
-        },
-        "node_modules/jss-plugin-global": {
-            "version": "10.3.0",
-            "resolved": "https://registry.npmjs.org/jss-plugin-global/-/jss-plugin-global-10.3.0.tgz",
-            "integrity": "sha512-etYTG/y3qIR/vxZnKY+J3wXwObyBDNhBiB3l/EW9/pE3WHE//BZdK8LFvQcrCO48sZW1Z6paHo6klxUPP7WbzA==",
-            "dependencies": {
-                "@babel/runtime": "^7.3.1",
-                "jss": "^10.3.0"
-            }
-        },
-        "node_modules/jss-plugin-nested": {
-            "version": "10.3.0",
-            "resolved": "https://registry.npmjs.org/jss-plugin-nested/-/jss-plugin-nested-10.3.0.tgz",
-            "integrity": "sha512-qWiEkoXNEkkZ+FZrWmUGpf+zBsnEOmKXhkjNX85/ZfWhH9dfGxUCKuJFuOWFM+rjQfxV4csfesq4hY0jk8Qt0w==",
-            "dependencies": {
-                "@babel/runtime": "^7.3.1",
-                "jss": "^10.3.0",
-                "tiny-warning": "^1.0.2"
-            }
-        },
-        "node_modules/jss-plugin-props-sort": {
-            "version": "10.3.0",
-            "resolved": "https://registry.npmjs.org/jss-plugin-props-sort/-/jss-plugin-props-sort-10.3.0.tgz",
-            "integrity": "sha512-boetORqL/lfd7BWeFD3K+IyPqyIC+l3CRrdZr+NPq7Noqp+xyg/0MR7QisgzpxCEulk+j2CRcEUoZsvgPC4nTg==",
-            "dependencies": {
-                "@babel/runtime": "^7.3.1",
-                "jss": "^10.3.0"
-            }
-        },
-        "node_modules/jss-plugin-rule-value-function": {
-            "version": "10.3.0",
-            "resolved": "https://registry.npmjs.org/jss-plugin-rule-value-function/-/jss-plugin-rule-value-function-10.3.0.tgz",
-            "integrity": "sha512-7WiMrKIHH3rwxTuJki9+7nY11r1UXqaUZRhHvqTD4/ZE+SVhvtD5Tx21ivNxotwUSleucA/8boX+NF21oXzr5Q==",
-            "dependencies": {
-                "@babel/runtime": "^7.3.1",
-                "jss": "^10.3.0",
-                "tiny-warning": "^1.0.2"
-            }
-        },
-        "node_modules/jss-plugin-vendor-prefixer": {
-            "version": "10.3.0",
-            "resolved": "https://registry.npmjs.org/jss-plugin-vendor-prefixer/-/jss-plugin-vendor-prefixer-10.3.0.tgz",
-            "integrity": "sha512-sZQbrcZyP5V0ADjCLwUA1spVWoaZvM7XZ+2fSeieZFBj31cRsnV7X70FFDerMHeiHAXKWzYek+67nMDjhrZAVQ==",
-            "dependencies": {
-                "@babel/runtime": "^7.3.1",
-                "css-vendor": "^2.0.8",
-                "jss": "^10.3.0"
-            }
-        },
-        "node_modules/jstransformer": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/jstransformer/-/jstransformer-1.0.0.tgz",
-            "integrity": "sha1-7Yvwkh4vPx7U1cGkT2hwntJHIsM=",
-            "dependencies": {
-                "is-promise": "^2.0.0",
-                "promise": "^7.0.1"
-            }
-        },
-        "node_modules/jszip": {
-            "version": "3.5.0",
-            "resolved": "https://registry.npmjs.org/jszip/-/jszip-3.5.0.tgz",
-            "integrity": "sha512-WRtu7TPCmYePR1nazfrtuF216cIVon/3GWOvHS9QR5bIwSbnxtdpma6un3jyGGNhHsKCSzn5Ypk+EkDRvTGiFA==",
-            "dependencies": {
-                "lie": "~3.3.0",
-                "pako": "~1.0.2",
-                "readable-stream": "~2.3.6",
-                "set-immediate-shim": "~1.0.1"
-            }
-        },
-        "node_modules/jszip/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/jwa": {
-            "version": "1.4.1",
-            "resolved": "https://registry.npmjs.org/jwa/-/jwa-1.4.1.tgz",
-            "integrity": "sha512-qiLX/xhEEFKUAJ6FiBMbes3w9ATzyk5W7Hvzpa/SLYdxNtng+gcurvrI7TbACjIXlsJyr05/S1oUhZrc63evQA==",
-            "dependencies": {
-                "buffer-equal-constant-time": "1.0.1",
-                "ecdsa-sig-formatter": "1.0.11",
-                "safe-buffer": "^5.0.1"
-            }
-        },
-        "node_modules/jws": {
-            "version": "3.2.2",
-            "resolved": "https://registry.npmjs.org/jws/-/jws-3.2.2.tgz",
-            "integrity": "sha512-YHlZCB6lMTllWDtSPHz/ZXTsi8S00usEV6v1tjq8tOUZzw7DpSDWVXjXDre6ed1w/pd495ODpHZYSdkRTsa0HA==",
-            "dependencies": {
-                "jwa": "^1.4.1",
-                "safe-buffer": "^5.0.1"
-            }
-        },
-        "node_modules/kareem": {
-            "version": "2.3.1",
-            "resolved": "https://registry.npmjs.org/kareem/-/kareem-2.3.1.tgz",
-            "integrity": "sha512-l3hLhffs9zqoDe8zjmb/mAN4B8VT3L56EUvKNqLFVs9YlFA+zx7ke1DO8STAdDyYNkeSo1nKmjuvQeI12So8Xw=="
-        },
-        "node_modules/keycode": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.2.0.tgz",
-            "integrity": "sha1-PQr1bce4uOXLqNCpfxByBO7CKwQ="
-        },
-        "node_modules/keygrip": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/keygrip/-/keygrip-1.1.0.tgz",
-            "integrity": "sha512-iYSchDJ+liQ8iwbSI2QqsQOvqv58eJCEanyJPJi+Khyu8smkcKSFUCbPwzFcL7YVtZ6eONjqRX/38caJ7QjRAQ==",
-            "dependencies": {
-                "tsscmp": "1.0.6"
-            },
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/killable": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/killable/-/killable-1.0.1.tgz",
-            "integrity": "sha512-LzqtLKlUwirEUyl/nicirVmNiPvYs7l5n8wOPP7fyJVpUPkvCnW/vuiXGpylGUlnPDnB7311rARzAt3Mhswpjg==",
-            "dev": true
-        },
-        "node_modules/kind-of": {
-            "version": "6.0.3",
-            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz",
-            "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/klaw": {
-            "version": "1.3.1",
-            "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
-            "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk=",
-            "dependencies": {
-                "graceful-fs": "^4.1.9"
-            }
-        },
-        "node_modules/latest-version": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz",
-            "integrity": "sha1-ogU4P+oyKzO1rjsYq+4NwvNW7hU=",
-            "dependencies": {
-                "package-json": "^4.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/lazy-cache": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
-            "integrity": "sha1-odePw6UEdMuAhF07O24dpJpEbo4=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/lazystream": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/lazystream/-/lazystream-1.0.0.tgz",
-            "integrity": "sha1-9plf4PggOS9hOWvolGJAe7dxaOQ=",
-            "dependencies": {
-                "readable-stream": "^2.0.5"
-            },
-            "engines": {
-                "node": ">= 0.6.3"
-            }
-        },
-        "node_modules/lazystream/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/levn": {
-            "version": "0.3.0",
-            "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
-            "integrity": "sha1-OwmSTt+fCDwEkP3UwLxEIeBHZO4=",
-            "dev": true,
-            "dependencies": {
-                "prelude-ls": "~1.1.2",
-                "type-check": "~0.3.2"
-            },
-            "engines": {
-                "node": ">= 0.8.0"
-            }
-        },
-        "node_modules/libxmljs": {
-            "version": "0.19.7",
-            "resolved": "https://registry.npmjs.org/libxmljs/-/libxmljs-0.19.7.tgz",
-            "integrity": "sha512-lFJyG9T1mVwTzNTw6ZkvIt0O+NsIR+FTE+RcC2QDFGU8YMnQrnyEOGrj6HWSe1AdwQK7s37BOp4NL+pcAqfK2g==",
-            "hasInstallScript": true,
-            "dependencies": {
-                "bindings": "~1.3.0",
-                "nan": "~2.14.0",
-                "node-pre-gyp": "~0.11.0"
-            },
-            "engines": {
-                "node": ">=0.8.0"
-            }
-        },
-        "node_modules/libxmljs/node_modules/node-pre-gyp": {
-            "version": "0.11.0",
-            "resolved": "https://registry.npmjs.org/node-pre-gyp/-/node-pre-gyp-0.11.0.tgz",
-            "integrity": "sha512-TwWAOZb0j7e9eGaf9esRx3ZcLaE5tQ2lvYy1pb5IAaG1a2e2Kv5Lms1Y4hpj+ciXJRofIxxlt5haeQ/2ANeE0Q==",
-            "dependencies": {
-                "detect-libc": "^1.0.2",
-                "mkdirp": "^0.5.1",
-                "needle": "^2.2.1",
-                "nopt": "^4.0.1",
-                "npm-packlist": "^1.1.6",
-                "npmlog": "^4.0.2",
-                "rc": "^1.2.7",
-                "rimraf": "^2.6.1",
-                "semver": "^5.3.0",
-                "tar": "^4"
-            },
-            "bin": {
-                "node-pre-gyp": "bin/node-pre-gyp"
-            }
-        },
-        "node_modules/libxmljs/node_modules/rimraf": {
-            "version": "2.7.1",
-            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/lie": {
-            "version": "3.3.0",
-            "resolved": "https://registry.npmjs.org/lie/-/lie-3.3.0.tgz",
-            "integrity": "sha512-UaiMJzeWRlEujzAuw5LokY1L5ecNQYZKfmyZ9L7wDHb/p5etKaxXhohBcrw0EYby+G/NA52vRSN4N39dxHAIwQ==",
-            "dependencies": {
-                "immediate": "~3.0.5"
-            }
-        },
-        "node_modules/lines-and-columns": {
-            "version": "1.1.6",
-            "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.1.6.tgz",
-            "integrity": "sha1-HADHQ7QzzQpOgHWPe2SldEDZ/wA="
-        },
-        "node_modules/load-json-file": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
-            "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
-            "dependencies": {
-                "graceful-fs": "^4.1.2",
-                "parse-json": "^2.2.0",
-                "pify": "^2.0.0",
-                "pinkie-promise": "^2.0.0",
-                "strip-bom": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/load-json-file/node_modules/parse-json": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
-            "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck=",
-            "dependencies": {
-                "error-ex": "^1.2.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/load-json-file/node_modules/pify": {
-            "version": "2.3.0",
-            "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-            "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/loader-runner": {
-            "version": "2.4.0",
-            "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-2.4.0.tgz",
-            "integrity": "sha512-Jsmr89RcXGIwivFY21FcRrisYZfvLMTWx5kOLc+JTxtpBOG6xML0vzbc6SEQG2FO9/4Fc3wW4LVcB5DmGflaRw==",
-            "dev": true,
-            "engines": {
-                "node": ">=4.3.0 <5.0.0 || >=5.10"
-            }
-        },
-        "node_modules/loader-utils": {
-            "version": "1.4.0",
-            "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.4.0.tgz",
-            "integrity": "sha512-qH0WSMBtn/oHuwjy/NucEgbx5dbxxnxup9s4PVXJUDHZBQY+s0NWA9rJf53RBnQZxfch7euUui7hpoAPvALZdA==",
-            "dependencies": {
-                "big.js": "^5.2.2",
-                "emojis-list": "^3.0.0",
-                "json5": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/loader-utils/node_modules/json5": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.1.tgz",
-            "integrity": "sha512-aKS4WQjPenRxiQsC93MNfjx+nbF4PAdYzmd/1JIj8HYzqfbu86beTuNgXDzPknWk0n0uARlyewZo4s++ES36Ow==",
-            "dependencies": {
-                "minimist": "^1.2.0"
-            },
-            "bin": {
-                "json5": "lib/cli.js"
-            }
-        },
-        "node_modules/locate-path": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz",
-            "integrity": "sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A==",
-            "dependencies": {
-                "p-locate": "^3.0.0",
-                "path-exists": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/lodash": {
-            "version": "4.17.15",
-            "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.15.tgz",
-            "integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A=="
-        },
-        "node_modules/lodash._getnative": {
-            "version": "3.9.1",
-            "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
-            "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U="
-        },
-        "node_modules/lodash.chunk": {
-            "version": "4.2.0",
-            "resolved": "https://registry.npmjs.org/lodash.chunk/-/lodash.chunk-4.2.0.tgz",
-            "integrity": "sha1-ZuXOH3btJ7QwPYxlEujRIW6BBrw="
-        },
-        "node_modules/lodash.curry": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/lodash.curry/-/lodash.curry-4.1.1.tgz",
-            "integrity": "sha1-JI42By7ekGUB11lmIAqG2riyMXA="
-        },
-        "node_modules/lodash.debounce": {
-            "version": "3.1.1",
-            "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-3.1.1.tgz",
-            "integrity": "sha1-gSIRw3ipTMKdWqTjNGzwv846ffU=",
-            "dependencies": {
-                "lodash._getnative": "^3.0.0"
-            }
-        },
-        "node_modules/lodash.defaults": {
-            "version": "4.2.0",
-            "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
-            "integrity": "sha1-0JF4cW/+pN3p5ft7N/bwgCJ0WAw="
-        },
-        "node_modules/lodash.difference": {
-            "version": "4.5.0",
-            "resolved": "https://registry.npmjs.org/lodash.difference/-/lodash.difference-4.5.0.tgz",
-            "integrity": "sha1-nMtOUF1Ia5FlE0V3KIWi3yf9AXw="
-        },
-        "node_modules/lodash.flatten": {
-            "version": "4.4.0",
-            "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
-            "integrity": "sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8="
-        },
-        "node_modules/lodash.flow": {
-            "version": "3.5.0",
-            "resolved": "https://registry.npmjs.org/lodash.flow/-/lodash.flow-3.5.0.tgz",
-            "integrity": "sha1-h79AKSuM+D5OjOGjrkIJ4gBxZ1o="
-        },
-        "node_modules/lodash.get": {
-            "version": "4.4.2",
-            "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
-            "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
-        },
-        "node_modules/lodash.isequal": {
-            "version": "4.5.0",
-            "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
-            "integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA="
-        },
-        "node_modules/lodash.isplainobject": {
-            "version": "4.0.6",
-            "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
-            "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
-        },
-        "node_modules/lodash.memoize": {
-            "version": "4.1.2",
-            "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
-            "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4="
-        },
-        "node_modules/lodash.merge": {
-            "version": "4.6.2",
-            "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
-            "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ=="
-        },
-        "node_modules/lodash.padend": {
-            "version": "4.6.1",
-            "resolved": "https://registry.npmjs.org/lodash.padend/-/lodash.padend-4.6.1.tgz",
-            "integrity": "sha1-U8y6BH0G4VjTEfRdpiX05J5vFm4="
-        },
-        "node_modules/lodash.sortby": {
-            "version": "4.7.0",
-            "resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz",
-            "integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg=",
-            "dev": true
-        },
-        "node_modules/lodash.throttle": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz",
-            "integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ="
-        },
-        "node_modules/lodash.union": {
-            "version": "4.6.0",
-            "resolved": "https://registry.npmjs.org/lodash.union/-/lodash.union-4.6.0.tgz",
-            "integrity": "sha1-SLtQiECfFvGCFmZkHETdGqrjzYg="
-        },
-        "node_modules/log-symbols": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-2.2.0.tgz",
-            "integrity": "sha512-VeIAFslyIerEJLXHziedo2basKbMKtTw3vfn5IzG0XTjhAVEJyNHnL2p7vc+wBDSdQuUpNw3M2u6xb9QsAY5Eg==",
-            "dependencies": {
-                "chalk": "^2.0.1"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/loglevel": {
-            "version": "1.6.8",
-            "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.6.8.tgz",
-            "integrity": "sha512-bsU7+gc9AJ2SqpzxwU3+1fedl8zAntbtC5XYlt3s2j1hJcn2PsXSmgN8TaLG/J1/2mod4+cE/3vNL70/c1RNCA==",
-            "dev": true,
-            "engines": {
-                "node": ">= 0.6.0"
-            }
-        },
-        "node_modules/loglevelnext": {
-            "version": "1.0.5",
-            "resolved": "https://registry.npmjs.org/loglevelnext/-/loglevelnext-1.0.5.tgz",
-            "integrity": "sha512-V/73qkPuJmx4BcBF19xPBr+0ZRVBhc4POxvZTZdMeXpJ4NItXSJ/MSwuFT0kQJlCbXvdlZoQQ/418bS1y9Jh6A==",
-            "dev": true,
-            "dependencies": {
-                "es6-symbol": "^3.1.1",
-                "object.assign": "^4.1.0"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/longest": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/longest/-/longest-1.0.1.tgz",
-            "integrity": "sha1-MKCy2jj3N3DoKUoNIuZiXtd9AJc=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/loose-envify": {
-            "version": "1.4.0",
-            "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
-            "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
-            "dependencies": {
-                "js-tokens": "^3.0.0 || ^4.0.0"
-            },
-            "bin": {
-                "loose-envify": "cli.js"
-            }
-        },
-        "node_modules/loud-rejection": {
-            "version": "1.6.0",
-            "resolved": "https://registry.npmjs.org/loud-rejection/-/loud-rejection-1.6.0.tgz",
-            "integrity": "sha1-W0b4AUft7leIcPCG0Eghz5mOVR8=",
-            "dependencies": {
-                "currently-unhandled": "^0.4.1",
-                "signal-exit": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/lowercase-keys": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.1.tgz",
-            "integrity": "sha512-G2Lj61tXDnVFFOi8VZds+SoQjtQC3dgokKdDG2mTm1tx4m50NUHBOZSBwQQHyy0V12A0JTG4icfZQH+xPyh8VA==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/lru-cache": {
-            "version": "5.1.1",
-            "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
-            "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
-            "dependencies": {
-                "yallist": "^3.0.2"
-            }
-        },
-        "node_modules/magicli": {
-            "version": "0.0.8",
-            "resolved": "https://registry.npmjs.org/magicli/-/magicli-0.0.8.tgz",
-            "integrity": "sha512-x/eBenweAHF+DsYy172sK4doRxZl0yrJnfxhLJiN7H6hPM3Ya0PfI6uBZshZ3ScFFSQD7HXgBqMdbnXKEZsO1g==",
-            "dependencies": {
-                "cliss": "0.0.2",
-                "find-up": "^2.1.0",
-                "for-each-property": "0.0.4",
-                "inspect-property": "0.0.6"
-            }
-        },
-        "node_modules/magicli/node_modules/find-up": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
-            "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c=",
-            "dependencies": {
-                "locate-path": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/magicli/node_modules/locate-path": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",
-            "integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4=",
-            "dependencies": {
-                "p-locate": "^2.0.0",
-                "path-exists": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/magicli/node_modules/p-limit": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.3.0.tgz",
-            "integrity": "sha512-vvcXsLAJ9Dr5rQOPk7toZQZJApBl2K4J6dANSsEuh6QI41JYcsS/qhTGa9ErIUUgK3WNQoJYvylxvjqmiqEA9Q==",
-            "dependencies": {
-                "p-try": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/magicli/node_modules/p-locate": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-2.0.0.tgz",
-            "integrity": "sha1-IKAQOyIqcMj9OcwuWAaA893l7EM=",
-            "dependencies": {
-                "p-limit": "^1.1.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/magicli/node_modules/p-try": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/p-try/-/p-try-1.0.0.tgz",
-            "integrity": "sha1-y8ec26+P1CKOE/Yh8rGiN8GyB7M=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/make-dir": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.3.0.tgz",
-            "integrity": "sha512-2w31R7SJtieJJnQtGc7RVL2StM2vGYVfqUOvUDxH6bC6aJTxPxTF0GnIgCyu7tjockiUWAYQRbxa7vKn34s5sQ==",
-            "dependencies": {
-                "pify": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/make-dir/node_modules/pify": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
-            "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/make-error": {
-            "version": "1.3.6",
-            "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
-            "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==",
-            "dev": true
-        },
-        "node_modules/map-cache": {
-            "version": "0.2.2",
-            "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
-            "integrity": "sha1-wyq9C9ZSXZsFFkW7TyasXcmKDb8=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/map-obj": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz",
-            "integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/map-visit": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/map-visit/-/map-visit-1.0.0.tgz",
-            "integrity": "sha1-7Nyo8TFE5mDxtb1B8S80edmN+48=",
-            "dependencies": {
-                "object-visit": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/material-colors": {
-            "version": "1.2.6",
-            "resolved": "https://registry.npmjs.org/material-colors/-/material-colors-1.2.6.tgz",
-            "integrity": "sha512-6qE4B9deFBIa9YSpOc9O0Sgc43zTeVYbgDT5veRKSlB2+ZuHNoVVxA1L/ckMUayV9Ay9y7Z/SZCLcGteW9i7bg=="
-        },
-        "node_modules/material-ui": {
-            "version": "0.20.2",
-            "resolved": "https://registry.npmjs.org/material-ui/-/material-ui-0.20.2.tgz",
-            "integrity": "sha512-VeqgQkdvtK193w+FFvXDEwlVxI4rWk83eWbpYLeOIHDPWr3rbB9B075JRnJt/8IsI2X8q5Aia5W3+7m4KkleDg==",
-            "dependencies": {
-                "babel-runtime": "^6.23.0",
-                "inline-style-prefixer": "^3.0.8",
-                "keycode": "^2.1.8",
-                "lodash.merge": "^4.6.0",
-                "lodash.throttle": "^4.1.1",
-                "prop-types": "^15.5.7",
-                "react-event-listener": "^0.6.2",
-                "react-transition-group": "^1.2.1",
-                "recompose": "^0.26.0",
-                "simple-assign": "^0.1.0",
-                "warning": "^3.0.0"
-            }
-        },
-        "node_modules/material-ui/node_modules/react-transition-group": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-1.2.1.tgz",
-            "integrity": "sha512-CWaL3laCmgAFdxdKbhhps+c0HRGF4c+hdM4H23+FI1QBNUyx/AMeIJGWorehPNSaKnQNOAxL7PQmqMu78CDj3Q==",
-            "dependencies": {
-                "chain-function": "^1.0.0",
-                "dom-helpers": "^3.2.0",
-                "loose-envify": "^1.3.1",
-                "prop-types": "^15.5.6",
-                "warning": "^3.0.0"
-            }
-        },
-        "node_modules/math-codegen": {
-            "version": "0.3.5",
-            "resolved": "https://registry.npmjs.org/math-codegen/-/math-codegen-0.3.5.tgz",
-            "integrity": "sha1-R5nuRnfe0Ud2bQA8ykt4ee3UDMo=",
-            "dependencies": {
-                "extend": "^3.0.0",
-                "mr-parser": "^0.2.1"
-            }
-        },
-        "node_modules/mathquill": {
-            "version": "0.10.1-a",
-            "resolved": "https://registry.npmjs.org/mathquill/-/mathquill-0.10.1-a.tgz",
-            "integrity": "sha1-vyylaQEAY6w0vNXVKa3Ag3zVPD8=",
-            "dependencies": {
-                "jquery": "^1.12.3"
-            }
-        },
-        "node_modules/mathquill/node_modules/jquery": {
-            "version": "1.12.4",
-            "resolved": "https://registry.npmjs.org/jquery/-/jquery-1.12.4.tgz",
-            "integrity": "sha1-AeHfuikP5z3rp3zurLD5ui/sngw="
-        },
-        "node_modules/max-safe-integer": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/max-safe-integer/-/max-safe-integer-1.0.1.tgz",
-            "integrity": "sha1-84BgvixWPYwC5tSK85Ei/YO29BA=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/md5.js": {
-            "version": "1.3.5",
-            "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
-            "integrity": "sha512-xitP+WxNPcTTOgnTJcrhM0xvdPepipPSf3I8EIpGKeFLjt3PlJLIDG3u8EX53ZIubkb+5U2+3rELYpEhHhzdkg==",
-            "dev": true,
-            "dependencies": {
-                "hash-base": "^3.0.0",
-                "inherits": "^2.0.1",
-                "safe-buffer": "^5.1.2"
-            }
-        },
-        "node_modules/media-typer": {
-            "version": "0.3.0",
-            "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
-            "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g=",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/memoize-one": {
-            "version": "5.1.1",
-            "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-5.1.1.tgz",
-            "integrity": "sha512-HKeeBpWvqiVJD57ZUAsJNm71eHTykffzcLZVYWiVfQeI1rJtuEaS7hQiEpWfVVk18donPwJEcFKIkCmPJNOhHA=="
-        },
-        "node_modules/memory-fs": {
-            "version": "0.5.0",
-            "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.5.0.tgz",
-            "integrity": "sha512-jA0rdU5KoQMC0e6ppoNRtpp6vjFq6+NY7r8hywnC7V+1Xj/MtHwGIbB1QaK/dunyjWteJzmkpd7ooeWg10T7GA==",
-            "dev": true,
-            "dependencies": {
-                "errno": "^0.1.3",
-                "readable-stream": "^2.0.1"
-            },
-            "engines": {
-                "node": ">=4.3.0 <5.0.0 || >=5.10"
-            }
-        },
-        "node_modules/memory-fs/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/memory-pager": {
-            "version": "1.5.0",
-            "resolved": "https://registry.npmjs.org/memory-pager/-/memory-pager-1.5.0.tgz",
-            "integrity": "sha512-ZS4Bp4r/Zoeq6+NLJpP+0Zzm0pR8whtGPf1XExKLJBAczGMnSi3It14OiNCStjQjM6NU1okjQGSxgEZN8eBYKg==",
-            "optional": true
-        },
-        "node_modules/meow": {
-            "version": "3.7.0",
-            "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz",
-            "integrity": "sha1-cstmi0JSKCkKu/qFaJJYcwioAfs=",
-            "dependencies": {
-                "camelcase-keys": "^2.0.0",
-                "decamelize": "^1.1.2",
-                "loud-rejection": "^1.0.0",
-                "map-obj": "^1.0.1",
-                "minimist": "^1.1.3",
-                "normalize-package-data": "^2.3.4",
-                "object-assign": "^4.0.1",
-                "read-pkg-up": "^1.0.1",
-                "redent": "^1.0.0",
-                "trim-newlines": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/merge-anything": {
-            "version": "2.4.4",
-            "resolved": "https://registry.npmjs.org/merge-anything/-/merge-anything-2.4.4.tgz",
-            "integrity": "sha512-l5XlriUDJKQT12bH+rVhAHjwIuXWdAIecGwsYjv2LJo+dA1AeRTmeQS+3QBpO6lEthBMDi2IUMpLC1yyRvGlwQ==",
-            "dependencies": {
-                "is-what": "^3.3.1"
-            }
-        },
-        "node_modules/merge-descriptors": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz",
-            "integrity": "sha1-sAqqVW3YtEVoFQ7J0blT8/kMu2E="
-        },
-        "node_modules/methods": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
-            "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4=",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/microevent.ts": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/microevent.ts/-/microevent.ts-0.1.1.tgz",
-            "integrity": "sha512-jo1OfR4TaEwd5HOrt5+tAZ9mqT4jmpNAusXtyfNzqVm9uiSYFZlKM1wYL4oU7azZW/PxQW53wM0S6OR1JHNa2g==",
-            "dev": true
-        },
-        "node_modules/micromatch": {
-            "version": "3.1.10",
-            "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.10.tgz",
-            "integrity": "sha512-MWikgl9n9M3w+bpsY3He8L+w9eF9338xRl8IAO5viDizwSzziFEyUzo2xrrloB64ADbTf8uA8vRqqttDTOmccg==",
-            "dependencies": {
-                "arr-diff": "^4.0.0",
-                "array-unique": "^0.3.2",
-                "braces": "^2.3.1",
-                "define-property": "^2.0.2",
-                "extend-shallow": "^3.0.2",
-                "extglob": "^2.0.4",
-                "fragment-cache": "^0.2.1",
-                "kind-of": "^6.0.2",
-                "nanomatch": "^1.2.9",
-                "object.pick": "^1.3.0",
-                "regex-not": "^1.0.0",
-                "snapdragon": "^0.8.1",
-                "to-regex": "^3.0.2"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/miller-rabin": {
-            "version": "4.0.1",
-            "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.1.tgz",
-            "integrity": "sha512-115fLhvZVqWwHPbClyntxEVfVDfl9DLLTuJvq3g2O/Oxi8AiNouAHvDSzHS0viUJc+V5vm3eq91Xwqn9dp4jRA==",
-            "dev": true,
-            "dependencies": {
-                "bn.js": "^4.0.0",
-                "brorand": "^1.0.1"
-            },
-            "bin": {
-                "miller-rabin": "bin/miller-rabin"
-            }
-        },
-        "node_modules/miller-rabin/node_modules/bn.js": {
-            "version": "4.12.0",
-            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
-            "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==",
-            "dev": true
-        },
-        "node_modules/mime": {
-            "version": "1.6.0",
-            "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
-            "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
-            "bin": {
-                "mime": "cli.js"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/mime-db": {
-            "version": "1.44.0",
-            "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.44.0.tgz",
-            "integrity": "sha512-/NOTfLrsPBVeH7YtFPgsVWveuL+4SjjYxaQ1xtM1KMFj7HdxlBlxeyNLzhyJVx7r4rZGJAZ/6lkKCitSc/Nmpg==",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/mime-types": {
-            "version": "2.1.27",
-            "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.27.tgz",
-            "integrity": "sha512-JIhqnCasI9yD+SsmkquHBxTSEuZdQX5BuQnS2Vc7puQQQ+8yiP5AY5uWhpdv4YL4VM5c6iliiYWPgJ/nJQLp7w==",
-            "dependencies": {
-                "mime-db": "1.44.0"
-            },
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/mimic-response": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-2.1.0.tgz",
-            "integrity": "sha512-wXqjST+SLt7R009ySCglWBCFpjUygmCIfD790/kVbiGmUgfYGuB14PiTd5DwVxSV4NcYHjzMkoj5LjQZwTQLEA==",
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/minimalistic-assert": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",
-            "integrity": "sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A==",
-            "dev": true
-        },
-        "node_modules/minimalistic-crypto-utils": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz",
-            "integrity": "sha1-9sAMHAsIIkblxNmd+4x8CDsrWCo=",
-            "dev": true
-        },
-        "node_modules/minimatch": {
-            "version": "3.0.4",
-            "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
-            "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
-            "dependencies": {
-                "brace-expansion": "^1.1.7"
-            },
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/minimist": {
-            "version": "1.2.5",
-            "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz",
-            "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw=="
-        },
-        "node_modules/minipass": {
-            "version": "2.9.0",
-            "resolved": "https://registry.npmjs.org/minipass/-/minipass-2.9.0.tgz",
-            "integrity": "sha512-wxfUjg9WebH+CUDX/CdbRlh5SmfZiy/hpkxaRI16Y9W56Pa75sWgd/rvFilSgrauD9NyFymP/+JFV3KwzIsJeg==",
-            "dependencies": {
-                "safe-buffer": "^5.1.2",
-                "yallist": "^3.0.0"
-            }
-        },
-        "node_modules/minizlib": {
-            "version": "1.3.3",
-            "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-1.3.3.tgz",
-            "integrity": "sha512-6ZYMOEnmVsdCeTJVE0W9ZD+pVnE8h9Hma/iOwwRDsdQoePpoX56/8B6z3P9VNwppJuBKNRuFDRNRqRWexT9G9Q==",
-            "dependencies": {
-                "minipass": "^2.9.0"
-            }
-        },
-        "node_modules/mississippi": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/mississippi/-/mississippi-2.0.0.tgz",
-            "integrity": "sha512-zHo8v+otD1J10j/tC+VNoGK9keCuByhKovAvdn74dmxJl9+mWHnx6EMsDN4lgRoMI/eYo2nchAxniIbUPb5onw==",
-            "dev": true,
-            "dependencies": {
-                "concat-stream": "^1.5.0",
-                "duplexify": "^3.4.2",
-                "end-of-stream": "^1.1.0",
-                "flush-write-stream": "^1.0.0",
-                "from2": "^2.1.0",
-                "parallel-transform": "^1.1.0",
-                "pump": "^2.0.1",
-                "pumpify": "^1.3.3",
-                "stream-each": "^1.1.0",
-                "through2": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/mississippi/node_modules/pump": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/pump/-/pump-2.0.1.tgz",
-            "integrity": "sha512-ruPMNRkN3MHP1cWJc9OWr+T/xDP0jhXYCLfJcBuX54hhfIBnaQmAUMfDcG4DM5UMWByBbJY69QSphm3jtDKIkA==",
-            "dev": true,
-            "dependencies": {
-                "end-of-stream": "^1.1.0",
-                "once": "^1.3.1"
-            }
-        },
-        "node_modules/mixin-deep": {
-            "version": "1.3.2",
-            "resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.3.2.tgz",
-            "integrity": "sha512-WRoDn//mXBiJ1H40rqa3vH0toePwSsGb45iInWlTySa+Uu4k3tYUSxa2v1KqAiLtvlrSzaExqS1gtk96A9zvEA==",
-            "dependencies": {
-                "for-in": "^1.0.2",
-                "is-extendable": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/mkdirp": {
-            "version": "0.5.4",
-            "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.4.tgz",
-            "integrity": "sha512-iG9AK/dJLtJ0XNgTuDbSyNS3zECqDlAhnQW4CsNxBG3LQJBbHmRX1egw39DmtOdCAqY+dKXV+sgPgilNWUKMVw==",
-            "dependencies": {
-                "minimist": "^1.2.5"
-            },
-            "bin": {
-                "mkdirp": "bin/cmd.js"
-            }
-        },
-        "node_modules/mkdirp-classic": {
-            "version": "0.5.2",
-            "resolved": "https://registry.npmjs.org/mkdirp-classic/-/mkdirp-classic-0.5.2.tgz",
-            "integrity": "sha512-ejdnDQcR75gwknmMw/tx02AuRs8jCtqFoFqDZMjiNxsu85sRIJVXDKHuLYvUUPRBUtV2FpSZa9bL1BUa3BdR2g=="
-        },
-        "node_modules/mobile-detect": {
-            "version": "1.4.4",
-            "resolved": "https://registry.npmjs.org/mobile-detect/-/mobile-detect-1.4.4.tgz",
-            "integrity": "sha512-vTgEjKjS89C5yHL5qWPpT6BzKuOVqABp+A3Szpbx34pIy3sngxlGaFpgHhfj6fKze1w0QKeOSDbU7SKu7wDvRQ=="
-        },
-        "node_modules/mobx": {
-            "version": "5.15.7",
-            "resolved": "https://registry.npmjs.org/mobx/-/mobx-5.15.7.tgz",
-            "integrity": "sha512-wyM3FghTkhmC+hQjyPGGFdpehrcX1KOXsDuERhfK2YbJemkUhEB+6wzEN639T21onxlfYBmriA1PFnvxTUhcKw=="
-        },
-        "node_modules/mobx-react": {
-            "version": "5.4.4",
-            "resolved": "https://registry.npmjs.org/mobx-react/-/mobx-react-5.4.4.tgz",
-            "integrity": "sha512-2mTzpyEjVB/RGk2i6KbcmP4HWcAUFox5ZRCrGvSyz49w20I4C4qql63grPpYrS9E9GKwgydBHQlA4y665LuRCQ==",
-            "dependencies": {
-                "hoist-non-react-statics": "^3.0.0",
-                "react-lifecycles-compat": "^3.0.2"
-            }
-        },
-        "node_modules/mobx-react-devtools": {
-            "version": "6.1.1",
-            "resolved": "https://registry.npmjs.org/mobx-react-devtools/-/mobx-react-devtools-6.1.1.tgz",
-            "integrity": "sha512-nc5IXLdEUFLn3wZal65KF3/JFEFd+mbH4KTz/IG5BOPyw7jo8z29w/8qm7+wiCyqVfUIgJ1gL4+HVKmcXIOgqA=="
-        },
-        "node_modules/mobx-utils": {
-            "version": "5.6.1",
-            "resolved": "https://registry.npmjs.org/mobx-utils/-/mobx-utils-5.6.1.tgz",
-            "integrity": "sha512-bpTJzM8MXniGnXCZY+ImjPDqBKQ3+G3g/QFSPtNkH6HM3x14DAPqKH7No7NDyhbXBMv3FaVetsgnoEPozbi45Q=="
-        },
-        "node_modules/mocha": {
-            "version": "5.2.0",
-            "resolved": "https://registry.npmjs.org/mocha/-/mocha-5.2.0.tgz",
-            "integrity": "sha512-2IUgKDhc3J7Uug+FxMXuqIyYzH7gJjXECKe/w43IGgQHTSj3InJi+yAA7T24L9bQMRKiUEHxEX37G5JpVUGLcQ==",
-            "dev": true,
-            "dependencies": {
-                "browser-stdout": "1.3.1",
-                "commander": "2.15.1",
-                "debug": "3.1.0",
-                "diff": "3.5.0",
-                "escape-string-regexp": "1.0.5",
-                "glob": "7.1.2",
-                "growl": "1.10.5",
-                "he": "1.1.1",
-                "minimatch": "3.0.4",
-                "mkdirp": "0.5.1",
-                "supports-color": "5.4.0"
-            },
-            "bin": {
-                "_mocha": "bin/_mocha",
-                "mocha": "bin/mocha"
-            },
-            "engines": {
-                "node": ">= 4.0.0"
-            }
-        },
-        "node_modules/mocha/node_modules/commander": {
-            "version": "2.15.1",
-            "resolved": "https://registry.npmjs.org/commander/-/commander-2.15.1.tgz",
-            "integrity": "sha512-VlfT9F3V0v+jr4yxPc5gg9s62/fIVWsd2Bk2iD435um1NlGMYdVCq+MjcXnhYq2icNOizHr1kK+5TI6H0Hy0ag==",
-            "dev": true
-        },
-        "node_modules/mocha/node_modules/debug": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
-            "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
-            "dev": true,
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/mocha/node_modules/glob": {
-            "version": "7.1.2",
-            "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
-            "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
-            "dev": true,
-            "dependencies": {
-                "fs.realpath": "^1.0.0",
-                "inflight": "^1.0.4",
-                "inherits": "2",
-                "minimatch": "^3.0.4",
-                "once": "^1.3.0",
-                "path-is-absolute": "^1.0.0"
-            },
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/mocha/node_modules/he": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz",
-            "integrity": "sha1-k0EP0hsAlzUVH4howvJx80J+I/0=",
-            "dev": true,
-            "bin": {
-                "he": "bin/he"
-            }
-        },
-        "node_modules/mocha/node_modules/minimist": {
-            "version": "0.0.8",
-            "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
-            "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=",
-            "dev": true
-        },
-        "node_modules/mocha/node_modules/mkdirp": {
-            "version": "0.5.1",
-            "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
-            "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
-            "dev": true,
-            "dependencies": {
-                "minimist": "0.0.8"
-            },
-            "bin": {
-                "mkdirp": "bin/cmd.js"
-            }
-        },
-        "node_modules/mocha/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
-            "dev": true
-        },
-        "node_modules/mocha/node_modules/supports-color": {
-            "version": "5.4.0",
-            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.4.0.tgz",
-            "integrity": "sha512-zjaXglF5nnWpsq470jSv6P9DwPvgLkuapYmfDm3JWOm0vkNTVF2tI4UrN2r6jH1qM/uc/WtxYY1hYoA2dOKj5w==",
-            "dev": true,
-            "dependencies": {
-                "has-flag": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/mongodb": {
-            "version": "3.5.9",
-            "resolved": "https://registry.npmjs.org/mongodb/-/mongodb-3.5.9.tgz",
-            "integrity": "sha512-vXHBY1CsGYcEPoVWhwgxIBeWqP3dSu9RuRDsoLRPTITrcrgm1f0Ubu1xqF9ozMwv53agmEiZm0YGo+7WL3Nbug==",
-            "dependencies": {
-                "bl": "^2.2.0",
-                "bson": "^1.1.4",
-                "denque": "^1.4.1",
-                "require_optional": "^1.0.1",
-                "safe-buffer": "^5.1.2"
-            },
-            "engines": {
-                "node": ">=4"
-            },
-            "optionalDependencies": {
-                "saslprep": "^1.0.0"
-            }
-        },
-        "node_modules/mongodb-core": {
-            "version": "2.1.20",
-            "resolved": "https://registry.npmjs.org/mongodb-core/-/mongodb-core-2.1.20.tgz",
-            "integrity": "sha512-IN57CX5/Q1bhDq6ShAR6gIv4koFsZP7L8WOK1S0lR0pVDQaScffSMV5jxubLsmZ7J+UdqmykKw4r9hG3XQEGgQ==",
-            "dependencies": {
-                "bson": "~1.0.4",
-                "require_optional": "~1.0.0"
-            }
-        },
-        "node_modules/mongodb/node_modules/bl": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/bl/-/bl-2.2.0.tgz",
-            "integrity": "sha512-wbgvOpqopSr7uq6fJrLH8EsvYMJf9gzfo2jCsL2eTy75qXPukA4pCgHamOQkZtY5vmfVtjB+P3LNlMHW5CEZXA==",
-            "dependencies": {
-                "readable-stream": "^2.3.5",
-                "safe-buffer": "^5.1.1"
-            }
-        },
-        "node_modules/mongodb/node_modules/bson": {
-            "version": "1.1.4",
-            "resolved": "https://registry.npmjs.org/bson/-/bson-1.1.4.tgz",
-            "integrity": "sha512-S/yKGU1syOMzO86+dGpg2qGoDL0zvzcb262G+gqEy6TgP6rt6z6qxSFX/8X6vLC91P7G7C3nLs0+bvDzmvBA3Q==",
-            "engines": {
-                "node": ">=0.6.19"
-            }
-        },
-        "node_modules/mongodb/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/mongoose": {
-            "version": "5.9.20",
-            "resolved": "https://registry.npmjs.org/mongoose/-/mongoose-5.9.20.tgz",
-            "integrity": "sha512-vRP6Csu2obzSl3ed7kTQMrolBNgweiRJ/eBU1PSe/rJfjqWS1oqDE2D1ZPGxkVOsKXs7Gyd84GAXerj8IB2UWg==",
-            "dependencies": {
-                "bson": "^1.1.4",
-                "kareem": "2.3.1",
-                "mongodb": "3.5.9",
-                "mongoose-legacy-pluralize": "1.0.2",
-                "mpath": "0.7.0",
-                "mquery": "3.2.2",
-                "ms": "2.1.2",
-                "regexp-clone": "1.0.0",
-                "safe-buffer": "5.1.2",
-                "sift": "7.0.1",
-                "sliced": "1.0.1"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/mongoose-legacy-pluralize": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/mongoose-legacy-pluralize/-/mongoose-legacy-pluralize-1.0.2.tgz",
-            "integrity": "sha512-Yo/7qQU4/EyIS8YDFSeenIvXxZN+ld7YdV9LqFVQJzTLye8unujAWPZ4NWKfFA+RNjh+wvTWKY9Z3E5XM6ZZiQ=="
-        },
-        "node_modules/mongoose/node_modules/bson": {
-            "version": "1.1.4",
-            "resolved": "https://registry.npmjs.org/bson/-/bson-1.1.4.tgz",
-            "integrity": "sha512-S/yKGU1syOMzO86+dGpg2qGoDL0zvzcb262G+gqEy6TgP6rt6z6qxSFX/8X6vLC91P7G7C3nLs0+bvDzmvBA3Q==",
-            "engines": {
-                "node": ">=0.6.19"
-            }
-        },
-        "node_modules/mongoose/node_modules/ms": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
-            "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
-        },
-        "node_modules/move-concurrently": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz",
-            "integrity": "sha1-viwAX9oy4LKa8fBdfEszIUxwH5I=",
-            "dev": true,
-            "dependencies": {
-                "aproba": "^1.1.1",
-                "copy-concurrently": "^1.0.0",
-                "fs-write-stream-atomic": "^1.0.8",
-                "mkdirp": "^0.5.1",
-                "rimraf": "^2.5.4",
-                "run-queue": "^1.0.3"
-            }
-        },
-        "node_modules/move-concurrently/node_modules/rimraf": {
-            "version": "2.7.1",
-            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-            "dev": true,
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/mpath": {
-            "version": "0.7.0",
-            "resolved": "https://registry.npmjs.org/mpath/-/mpath-0.7.0.tgz",
-            "integrity": "sha512-Aiq04hILxhz1L+f7sjGyn7IxYzWm1zLNNXcfhDtx04kZ2Gk7uvFdgZ8ts1cWa/6d0TQmag2yR8zSGZUmp0tFNg==",
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/mquery": {
-            "version": "3.2.2",
-            "resolved": "https://registry.npmjs.org/mquery/-/mquery-3.2.2.tgz",
-            "integrity": "sha512-XB52992COp0KP230I3qloVUbkLUxJIu328HBP2t2EsxSFtf4W1HPSOBWOXf1bqxK4Xbb66lfMJ+Bpfd9/yZE1Q==",
-            "dependencies": {
-                "bluebird": "3.5.1",
-                "debug": "3.1.0",
-                "regexp-clone": "^1.0.0",
-                "safe-buffer": "5.1.2",
-                "sliced": "1.0.1"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/mquery/node_modules/bluebird": {
-            "version": "3.5.1",
-            "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.1.tgz",
-            "integrity": "sha512-MKiLiV+I1AA596t9w1sQJ8jkiSr5+ZKi0WKrYGUn6d1Fx+Ij4tIj+m2WMQSGczs5jZVxV339chE8iwk6F64wjA=="
-        },
-        "node_modules/mquery/node_modules/debug": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
-            "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/mquery/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-        },
-        "node_modules/mr-parser": {
-            "version": "0.2.1",
-            "resolved": "https://registry.npmjs.org/mr-parser/-/mr-parser-0.2.1.tgz",
-            "integrity": "sha1-hhi5ukF+KOn0OaQcaVtVTq/u2Sc="
-        },
-        "node_modules/ms": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz",
-            "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg=="
-        },
-        "node_modules/multicast-dns": {
-            "version": "6.2.3",
-            "resolved": "https://registry.npmjs.org/multicast-dns/-/multicast-dns-6.2.3.tgz",
-            "integrity": "sha512-ji6J5enbMyGRHIAkAOu3WdV8nggqviKCEKtXcOqfphZZtQrmHKycfynJ2V7eVPUA4NhJ6V7Wf4TmGbTwKE9B6g==",
-            "dev": true,
-            "dependencies": {
-                "dns-packet": "^1.3.1",
-                "thunky": "^1.0.2"
-            },
-            "bin": {
-                "multicast-dns": "cli.js"
-            }
-        },
-        "node_modules/multicast-dns-service-types": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/multicast-dns-service-types/-/multicast-dns-service-types-1.1.0.tgz",
-            "integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE=",
-            "dev": true
-        },
-        "node_modules/nan": {
-            "version": "2.14.1",
-            "resolved": "https://registry.npmjs.org/nan/-/nan-2.14.1.tgz",
-            "integrity": "sha512-isWHgVjnFjh2x2yuJ/tj3JbwoHu3UC2dX5G/88Cm24yB6YopVgxvBObDY7n5xW6ExmFhJpSEQqFPvq9zaXc8Jw=="
-        },
-        "node_modules/nanoid": {
-            "version": "3.1.10",
-            "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.10.tgz",
-            "integrity": "sha512-iZFMXKeXWkxzlfmMfM91gw7YhN2sdJtixY+eZh9V6QWJWTOiurhpKhBMgr82pfzgSqglQgqYSCowEYsz8D++6w==",
-            "bin": {
-                "nanoid": "bin/nanoid.cjs"
-            },
-            "engines": {
-                "node": "^10 || ^12 || >=13.7"
-            }
-        },
-        "node_modules/nanomatch": {
-            "version": "1.2.13",
-            "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.13.tgz",
-            "integrity": "sha512-fpoe2T0RbHwBTBUOftAfBPaDEi06ufaUai0mE6Yn1kacc3SnTErfb/h+X94VXzI64rKFHYImXSvdwGGCmwOqCA==",
-            "dependencies": {
-                "arr-diff": "^4.0.0",
-                "array-unique": "^0.3.2",
-                "define-property": "^2.0.2",
-                "extend-shallow": "^3.0.2",
-                "fragment-cache": "^0.2.1",
-                "is-windows": "^1.0.2",
-                "kind-of": "^6.0.2",
-                "object.pick": "^1.3.0",
-                "regex-not": "^1.0.0",
-                "snapdragon": "^0.8.1",
-                "to-regex": "^3.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/napi-build-utils": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/napi-build-utils/-/napi-build-utils-1.0.2.tgz",
-            "integrity": "sha512-ONmRUqK7zj7DWX0D9ADe03wbwOBZxNAfF20PlGfCWQcD3+/MakShIHrMqx9YwPTfxDdF1zLeL+RGZiR9kGMLdg=="
-        },
-        "node_modules/native-or-bluebird": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/native-or-bluebird/-/native-or-bluebird-1.2.0.tgz",
-            "integrity": "sha1-OcR7/Xgl0fuf+tMiEK4l2q3xAck="
-        },
-        "node_modules/needle": {
-            "version": "2.4.1",
-            "resolved": "https://registry.npmjs.org/needle/-/needle-2.4.1.tgz",
-            "integrity": "sha512-x/gi6ijr4B7fwl6WYL9FwlCvRQKGlUNvnceho8wxkwXqN8jvVmmmATTmZPRRG7b/yC1eode26C2HO9jl78Du9g==",
-            "dependencies": {
-                "debug": "^3.2.6",
-                "iconv-lite": "^0.4.4",
-                "sax": "^1.2.4"
-            },
-            "bin": {
-                "needle": "bin/needle"
-            },
-            "engines": {
-                "node": ">= 4.4.x"
-            }
-        },
-        "node_modules/negotiator": {
-            "version": "0.6.2",
-            "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.2.tgz",
-            "integrity": "sha512-hZXc7K2e+PgeI1eDBe/10Ard4ekbfrrqG8Ep+8Jmf4JID2bNg7NvCPOZN+kfF574pFQI7mum2AUqDidoKqcTOw==",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/neo-async": {
-            "version": "2.6.1",
-            "resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.6.1.tgz",
-            "integrity": "sha512-iyam8fBuCUpWeKPGpaNMetEocMt364qkCsfL9JuhjXX6dRnguRVOfk2GZaDpPjcOKiiXCPINZC1GczQ7iTq3Zw==",
-            "dev": true
-        },
-        "node_modules/next-tick": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/next-tick/-/next-tick-1.0.0.tgz",
-            "integrity": "sha1-yobR/ogoFpsBICCOPchCS524NCw="
-        },
-        "node_modules/nextafter": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/nextafter/-/nextafter-1.0.0.tgz",
-            "integrity": "sha1-t9d7U1MQ4+CX5gJauwqQNHfsGjo=",
-            "dependencies": {
-                "double-bits": "^1.1.0"
-            }
-        },
-        "node_modules/nice-try": {
-            "version": "1.0.5",
-            "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
-            "integrity": "sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==",
-            "dev": true
-        },
-        "node_modules/node-abi": {
-            "version": "2.16.0",
-            "resolved": "https://registry.npmjs.org/node-abi/-/node-abi-2.16.0.tgz",
-            "integrity": "sha512-+sa0XNlWDA6T+bDLmkCUYn6W5k5W6BPRL6mqzSCs6H/xUgtl4D5x2fORKDzopKiU6wsyn/+wXlRXwXeSp+mtoA==",
-            "dependencies": {
-                "semver": "^5.4.1"
-            }
-        },
-        "node_modules/node-ensure": {
-            "version": "0.0.0",
-            "resolved": "https://registry.npmjs.org/node-ensure/-/node-ensure-0.0.0.tgz",
-            "integrity": "sha1-7K52QVDemYYexcgQ/V0Jaxg5Mqc="
-        },
-        "node_modules/node-environment-flags": {
-            "version": "1.0.5",
-            "resolved": "https://registry.npmjs.org/node-environment-flags/-/node-environment-flags-1.0.5.tgz",
-            "integrity": "sha512-VNYPRfGfmZLx0Ye20jWzHUjyTW/c+6Wq+iLhDzUI4XmhrDd9l/FozXV3F2xOaXjvp0co0+v1YSR3CMP6g+VvLQ==",
-            "dependencies": {
-                "object.getownpropertydescriptors": "^2.0.3",
-                "semver": "^5.7.0"
-            }
-        },
-        "node_modules/node-fetch": {
-            "version": "1.7.3",
-            "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.3.tgz",
-            "integrity": "sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==",
-            "dependencies": {
-                "encoding": "^0.1.11",
-                "is-stream": "^1.0.1"
-            }
-        },
-        "node_modules/node-forge": {
-            "version": "0.9.1",
-            "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.9.1.tgz",
-            "integrity": "sha512-G6RlQt5Sb4GMBzXvhfkeFmbqR6MzhtnT7VTHuLadjkii3rdYHNdw0m8zA4BTxVIh68FicCQ2NSUANpsqkr9jvQ==",
-            "engines": {
-                "node": ">= 4.5.0"
-            }
-        },
-        "node_modules/node-gyp": {
-            "version": "3.8.0",
-            "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.8.0.tgz",
-            "integrity": "sha512-3g8lYefrRRzvGeSowdJKAKyks8oUpLEd/DyPV4eMhVlhJ0aNaZqIrNUIPuEWWTAoPqyFkfGrM67MC69baqn6vA==",
-            "dependencies": {
-                "fstream": "^1.0.0",
-                "glob": "^7.0.3",
-                "graceful-fs": "^4.1.2",
-                "mkdirp": "^0.5.0",
-                "nopt": "2 || 3",
-                "npmlog": "0 || 1 || 2 || 3 || 4",
-                "osenv": "0",
-                "request": "^2.87.0",
-                "rimraf": "2",
-                "semver": "~5.3.0",
-                "tar": "^2.0.0",
-                "which": "1"
-            },
-            "bin": {
-                "node-gyp": "bin/node-gyp.js"
-            },
-            "engines": {
-                "node": ">= 0.8.0"
-            }
-        },
-        "node_modules/node-gyp/node_modules/nopt": {
-            "version": "3.0.6",
-            "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz",
-            "integrity": "sha1-xkZdvwirzU2zWTF/eaxopkayj/k=",
-            "dependencies": {
-                "abbrev": "1"
-            },
-            "bin": {
-                "nopt": "bin/nopt.js"
-            }
-        },
-        "node_modules/node-gyp/node_modules/rimraf": {
-            "version": "2.7.1",
-            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/node-gyp/node_modules/semver": {
-            "version": "5.3.0",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
-            "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=",
-            "bin": {
-                "semver": "bin/semver"
-            }
-        },
-        "node_modules/node-gyp/node_modules/tar": {
-            "version": "2.2.2",
-            "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.2.tgz",
-            "integrity": "sha512-FCEhQ/4rE1zYv9rYXJw/msRqsnmlje5jHP6huWeBZ704jUTy02c5AZyWujpMR1ax6mVw9NyJMfuK2CMDWVIfgA==",
-            "dependencies": {
-                "block-stream": "*",
-                "fstream": "^1.0.12",
-                "inherits": "2"
-            }
-        },
-        "node_modules/node-libs-browser": {
-            "version": "2.2.1",
-            "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.2.1.tgz",
-            "integrity": "sha512-h/zcD8H9kaDZ9ALUWwlBUDo6TKF8a7qBSCSEGfjTVIYeqsioSKaAX+BN7NgiMGp6iSIXZ3PxgCu8KS3b71YK5Q==",
-            "dev": true,
-            "dependencies": {
-                "assert": "^1.1.1",
-                "browserify-zlib": "^0.2.0",
-                "buffer": "^4.3.0",
-                "console-browserify": "^1.1.0",
-                "constants-browserify": "^1.0.0",
-                "crypto-browserify": "^3.11.0",
-                "domain-browser": "^1.1.1",
-                "events": "^3.0.0",
-                "https-browserify": "^1.0.0",
-                "os-browserify": "^0.3.0",
-                "path-browserify": "0.0.1",
-                "process": "^0.11.10",
-                "punycode": "^1.2.4",
-                "querystring-es3": "^0.2.0",
-                "readable-stream": "^2.3.3",
-                "stream-browserify": "^2.0.1",
-                "stream-http": "^2.7.2",
-                "string_decoder": "^1.0.0",
-                "timers-browserify": "^2.0.4",
-                "tty-browserify": "0.0.0",
-                "url": "^0.11.0",
-                "util": "^0.11.0",
-                "vm-browserify": "^1.0.1"
-            }
-        },
-        "node_modules/node-libs-browser/node_modules/buffer": {
-            "version": "4.9.2",
-            "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.2.tgz",
-            "integrity": "sha512-xq+q3SRMOxGivLhBNaUdC64hDTQwejJ+H0T/NB1XMtTVEwNTrfFF3gAxiyW0Bu/xWEGhjVKgUcMhCrUy2+uCWg==",
-            "dev": true,
-            "dependencies": {
-                "base64-js": "^1.0.2",
-                "ieee754": "^1.1.4",
-                "isarray": "^1.0.0"
-            }
-        },
-        "node_modules/node-libs-browser/node_modules/punycode": {
-            "version": "1.4.1",
-            "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
-            "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
-            "dev": true
-        },
-        "node_modules/node-libs-browser/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/node-notifier": {
-            "version": "5.4.3",
-            "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.4.3.tgz",
-            "integrity": "sha512-M4UBGcs4jeOK9CjTsYwkvH6/MzuUmGCyTW+kCY7uO+1ZVr0+FHGdPdIf5CCLqAaxnRrWidyoQlNkMIIVwbKB8Q==",
-            "dev": true,
-            "dependencies": {
-                "growly": "^1.3.0",
-                "is-wsl": "^1.1.0",
-                "semver": "^5.5.0",
-                "shellwords": "^0.1.1",
-                "which": "^1.3.0"
-            }
-        },
-        "node_modules/node-sass": {
-            "version": "4.14.1",
-            "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.14.1.tgz",
-            "integrity": "sha512-sjCuOlvGyCJS40R8BscF5vhVlQjNN069NtQ1gSxyK1u9iqvn6tf7O1R4GNowVZfiZUCRt5MmMs1xd+4V/7Yr0g==",
-            "hasInstallScript": true,
-            "dependencies": {
-                "async-foreach": "^0.1.3",
-                "chalk": "^1.1.1",
-                "cross-spawn": "^3.0.0",
-                "gaze": "^1.0.0",
-                "get-stdin": "^4.0.1",
-                "glob": "^7.0.3",
-                "in-publish": "^2.0.0",
-                "lodash": "^4.17.15",
-                "meow": "^3.7.0",
-                "mkdirp": "^0.5.1",
-                "nan": "^2.13.2",
-                "node-gyp": "^3.8.0",
-                "npmlog": "^4.0.0",
-                "request": "^2.88.0",
-                "sass-graph": "2.2.5",
-                "stdout-stream": "^1.4.0",
-                "true-case-path": "^1.0.2"
-            },
-            "bin": {
-                "node-sass": "bin/node-sass"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/node-sass-tilde-importer": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/node-sass-tilde-importer/-/node-sass-tilde-importer-1.0.2.tgz",
-            "integrity": "sha512-Swcmr38Y7uB78itQeBm3mThjxBy9/Ah/ykPIaURY/L6Nec9AyRoL/jJ7ECfMR+oZeCTVQNxVMu/aHU+TLRVbdg==",
-            "dependencies": {
-                "find-parent-dir": "^0.3.0"
-            }
-        },
-        "node_modules/node-sass/node_modules/ansi-regex": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-            "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/node-sass/node_modules/ansi-styles": {
-            "version": "2.2.1",
-            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-            "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/node-sass/node_modules/chalk": {
-            "version": "1.1.3",
-            "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-            "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-            "dependencies": {
-                "ansi-styles": "^2.2.1",
-                "escape-string-regexp": "^1.0.2",
-                "has-ansi": "^2.0.0",
-                "strip-ansi": "^3.0.0",
-                "supports-color": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/node-sass/node_modules/get-stdin": {
-            "version": "4.0.1",
-            "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
-            "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/node-sass/node_modules/strip-ansi": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-            "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
-            "dependencies": {
-                "ansi-regex": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/node-sass/node_modules/supports-color": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-            "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
-            "engines": {
-                "node": ">=0.8.0"
-            }
-        },
-        "node_modules/node-stream-zip": {
-            "version": "1.11.2",
-            "resolved": "https://registry.npmjs.org/node-stream-zip/-/node-stream-zip-1.11.2.tgz",
-            "integrity": "sha512-cowCX+OyzS3tN2i4BMMFxCr/pE6cQlEMTbVCugmos0TNEJQNtcG04tR41CY8lumO1I7F5GFiLaU4WavomJthaA==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/nodemailer": {
-            "version": "5.1.1",
-            "resolved": "https://registry.npmjs.org/nodemailer/-/nodemailer-5.1.1.tgz",
-            "integrity": "sha512-hKGCoeNdFL2W7S76J/Oucbw0/qRlfG815tENdhzcqTpSjKgAN91mFOqU2lQUflRRxFM7iZvCyaFcAR9noc/CqQ==",
-            "engines": {
-                "node": ">=6.0.0"
-            }
-        },
-        "node_modules/nodemon": {
-            "version": "1.19.4",
-            "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-1.19.4.tgz",
-            "integrity": "sha512-VGPaqQBNk193lrJFotBU8nvWZPqEZY2eIzymy2jjY0fJ9qIsxA0sxQ8ATPl0gZC645gijYEc1jtZvpS8QWzJGQ==",
-            "hasInstallScript": true,
-            "dependencies": {
-                "chokidar": "^2.1.8",
-                "debug": "^3.2.6",
-                "ignore-by-default": "^1.0.1",
-                "minimatch": "^3.0.4",
-                "pstree.remy": "^1.1.7",
-                "semver": "^5.7.1",
-                "supports-color": "^5.5.0",
-                "touch": "^3.1.0",
-                "undefsafe": "^2.0.2",
-                "update-notifier": "^2.5.0"
-            },
-            "bin": {
-                "nodemon": "bin/nodemon.js"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/noop-logger": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/noop-logger/-/noop-logger-0.1.1.tgz",
-            "integrity": "sha1-lKKxYzxPExdVMAfYlm/Q6EG2pMI="
-        },
-        "node_modules/nopt": {
-            "version": "4.0.3",
-            "resolved": "https://registry.npmjs.org/nopt/-/nopt-4.0.3.tgz",
-            "integrity": "sha512-CvaGwVMztSMJLOeXPrez7fyfObdZqNUK1cPAEzLHrTybIua9pMdmmPR5YwtfNftIOMv3DPUhFaxsZMNTQO20Kg==",
-            "dependencies": {
-                "abbrev": "1",
-                "osenv": "^0.1.4"
-            },
-            "bin": {
-                "nopt": "bin/nopt.js"
-            }
-        },
-        "node_modules/normalize-package-data": {
-            "version": "2.5.0",
-            "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.5.0.tgz",
-            "integrity": "sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==",
-            "dependencies": {
-                "hosted-git-info": "^2.1.4",
-                "resolve": "^1.10.0",
-                "semver": "2 || 3 || 4 || 5",
-                "validate-npm-package-license": "^3.0.1"
-            }
-        },
-        "node_modules/normalize-path": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
-            "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/normalize.css": {
-            "version": "8.0.1",
-            "resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz",
-            "integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg=="
-        },
-        "node_modules/npm": {
-            "version": "6.14.5",
-            "resolved": "https://registry.npmjs.org/npm/-/npm-6.14.5.tgz",
-            "integrity": "sha512-CDwa3FJd0XJpKDbWCST484H+mCNjF26dPrU+xnREW+upR0UODjMEfXPl3bxWuAwZIX6c2ASg1plLO7jP8ehWeA==",
-            "bundleDependencies": [
-                "JSONStream",
-                "abbrev",
-                "ansicolors",
-                "ansistyles",
-                "aproba",
-                "archy",
-                "bin-links",
-                "bluebird",
-                "byte-size",
-                "cacache",
-                "call-limit",
-                "chownr",
-                "ci-info",
-                "cli-columns",
-                "cli-table3",
-                "cmd-shim",
-                "columnify",
-                "config-chain",
-                "debuglog",
-                "detect-indent",
-                "detect-newline",
-                "dezalgo",
-                "editor",
-                "figgy-pudding",
-                "find-npm-prefix",
-                "fs-vacuum",
-                "fs-write-stream-atomic",
-                "gentle-fs",
-                "glob",
-                "graceful-fs",
-                "has-unicode",
-                "hosted-git-info",
-                "iferr",
-                "imurmurhash",
-                "infer-owner",
-                "inflight",
-                "inherits",
-                "ini",
-                "init-package-json",
-                "is-cidr",
-                "json-parse-better-errors",
-                "lazy-property",
-                "libcipm",
-                "libnpm",
-                "libnpmaccess",
-                "libnpmhook",
-                "libnpmorg",
-                "libnpmsearch",
-                "libnpmteam",
-                "libnpx",
-                "lock-verify",
-                "lockfile",
-                "lodash._baseindexof",
-                "lodash._baseuniq",
-                "lodash._bindcallback",
-                "lodash._cacheindexof",
-                "lodash._createcache",
-                "lodash._getnative",
-                "lodash.clonedeep",
-                "lodash.restparam",
-                "lodash.union",
-                "lodash.uniq",
-                "lodash.without",
-                "lru-cache",
-                "meant",
-                "mississippi",
-                "mkdirp",
-                "move-concurrently",
-                "node-gyp",
-                "nopt",
-                "normalize-package-data",
-                "npm-audit-report",
-                "npm-cache-filename",
-                "npm-install-checks",
-                "npm-lifecycle",
-                "npm-package-arg",
-                "npm-packlist",
-                "npm-pick-manifest",
-                "npm-profile",
-                "npm-registry-fetch",
-                "npm-user-validate",
-                "npmlog",
-                "once",
-                "opener",
-                "osenv",
-                "pacote",
-                "path-is-inside",
-                "promise-inflight",
-                "qrcode-terminal",
-                "query-string",
-                "qw",
-                "read",
-                "read-cmd-shim",
-                "read-installed",
-                "read-package-json",
-                "read-package-tree",
-                "readable-stream",
-                "readdir-scoped-modules",
-                "request",
-                "retry",
-                "rimraf",
-                "safe-buffer",
-                "semver",
-                "sha",
-                "slide",
-                "sorted-object",
-                "sorted-union-stream",
-                "ssri",
-                "stringify-package",
-                "tar",
-                "text-table",
-                "tiny-relative-date",
-                "uid-number",
-                "umask",
-                "unique-filename",
-                "unpipe",
-                "update-notifier",
-                "uuid",
-                "validate-npm-package-license",
-                "validate-npm-package-name",
-                "which",
-                "worker-farm",
-                "write-file-atomic"
-            ],
-            "dependencies": {
-                "abbrev": "~1.1.1",
-                "ansicolors": "~0.3.2",
-                "ansistyles": "~0.1.3",
-                "aproba": "^2.0.0",
-                "archy": "~1.0.0",
-                "bin-links": "^1.1.7",
-                "bluebird": "^3.5.5",
-                "byte-size": "^5.0.1",
-                "cacache": "^12.0.3",
-                "call-limit": "^1.1.1",
-                "chownr": "^1.1.4",
-                "ci-info": "^2.0.0",
-                "cli-columns": "^3.1.2",
-                "cli-table3": "^0.5.1",
-                "cmd-shim": "^3.0.3",
-                "columnify": "~1.5.4",
-                "config-chain": "^1.1.12",
-                "debuglog": "*",
-                "detect-indent": "~5.0.0",
-                "detect-newline": "^2.1.0",
-                "dezalgo": "~1.0.3",
-                "editor": "~1.0.0",
-                "figgy-pudding": "^3.5.1",
-                "find-npm-prefix": "^1.0.2",
-                "fs-vacuum": "~1.2.10",
-                "fs-write-stream-atomic": "~1.0.10",
-                "gentle-fs": "^2.3.0",
-                "glob": "^7.1.6",
-                "graceful-fs": "^4.2.4",
-                "has-unicode": "~2.0.1",
-                "hosted-git-info": "^2.8.8",
-                "iferr": "^1.0.2",
-                "imurmurhash": "*",
-                "infer-owner": "^1.0.4",
-                "inflight": "~1.0.6",
-                "inherits": "^2.0.4",
-                "ini": "^1.3.5",
-                "init-package-json": "^1.10.3",
-                "is-cidr": "^3.0.0",
-                "json-parse-better-errors": "^1.0.2",
-                "JSONStream": "^1.3.5",
-                "lazy-property": "~1.0.0",
-                "libcipm": "^4.0.7",
-                "libnpm": "^3.0.1",
-                "libnpmaccess": "^3.0.2",
-                "libnpmhook": "^5.0.3",
-                "libnpmorg": "^1.0.1",
-                "libnpmsearch": "^2.0.2",
-                "libnpmteam": "^1.0.2",
-                "libnpx": "^10.2.2",
-                "lock-verify": "^2.1.0",
-                "lockfile": "^1.0.4",
-                "lodash._baseindexof": "*",
-                "lodash._baseuniq": "~4.6.0",
-                "lodash._bindcallback": "*",
-                "lodash._cacheindexof": "*",
-                "lodash._createcache": "*",
-                "lodash._getnative": "*",
-                "lodash.clonedeep": "~4.5.0",
-                "lodash.restparam": "*",
-                "lodash.union": "~4.6.0",
-                "lodash.uniq": "~4.5.0",
-                "lodash.without": "~4.4.0",
-                "lru-cache": "^5.1.1",
-                "meant": "~1.0.1",
-                "mississippi": "^3.0.0",
-                "mkdirp": "^0.5.5",
-                "move-concurrently": "^1.0.1",
-                "node-gyp": "^5.1.0",
-                "nopt": "^4.0.3",
-                "normalize-package-data": "^2.5.0",
-                "npm-audit-report": "^1.3.2",
-                "npm-cache-filename": "~1.0.2",
-                "npm-install-checks": "^3.0.2",
-                "npm-lifecycle": "^3.1.4",
-                "npm-package-arg": "^6.1.1",
-                "npm-packlist": "^1.4.8",
-                "npm-pick-manifest": "^3.0.2",
-                "npm-profile": "^4.0.4",
-                "npm-registry-fetch": "^4.0.4",
-                "npm-user-validate": "~1.0.0",
-                "npmlog": "~4.1.2",
-                "once": "~1.4.0",
-                "opener": "^1.5.1",
-                "osenv": "^0.1.5",
-                "pacote": "^9.5.12",
-                "path-is-inside": "~1.0.2",
-                "promise-inflight": "~1.0.1",
-                "qrcode-terminal": "^0.12.0",
-                "query-string": "^6.8.2",
-                "qw": "~1.0.1",
-                "read": "~1.0.7",
-                "read-cmd-shim": "^1.0.5",
-                "read-installed": "~4.0.3",
-                "read-package-json": "^2.1.1",
-                "read-package-tree": "^5.3.1",
-                "readable-stream": "^3.6.0",
-                "readdir-scoped-modules": "^1.1.0",
-                "request": "^2.88.0",
-                "retry": "^0.12.0",
-                "rimraf": "^2.7.1",
-                "safe-buffer": "^5.1.2",
-                "semver": "^5.7.1",
-                "sha": "^3.0.0",
-                "slide": "~1.1.6",
-                "sorted-object": "~2.0.1",
-                "sorted-union-stream": "~2.1.3",
-                "ssri": "^6.0.1",
-                "stringify-package": "^1.0.1",
-                "tar": "^4.4.13",
-                "text-table": "~0.2.0",
-                "tiny-relative-date": "^1.3.0",
-                "uid-number": "0.0.6",
-                "umask": "~1.1.0",
-                "unique-filename": "^1.1.1",
-                "unpipe": "~1.0.0",
-                "update-notifier": "^2.5.0",
-                "uuid": "^3.3.3",
-                "validate-npm-package-license": "^3.0.4",
-                "validate-npm-package-name": "~3.0.0",
-                "which": "^1.3.1",
-                "worker-farm": "^1.7.0",
-                "write-file-atomic": "^2.4.3"
-            },
-            "bin": {
-                "npm": "bin/npm-cli.js",
-                "npx": "bin/npx-cli.js"
-            },
-            "engines": {
-                "node": "6 >=6.2.0 || 8 || >=9.3.0"
-            }
-        },
-        "node_modules/npm-bundled": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/npm-bundled/-/npm-bundled-1.1.1.tgz",
-            "integrity": "sha512-gqkfgGePhTpAEgUsGEgcq1rqPXA+tv/aVBlgEzfXwA1yiUJF7xtEt3CtVwOjNYQOVknDk0F20w58Fnm3EtG0fA==",
-            "dependencies": {
-                "npm-normalize-package-bin": "^1.0.1"
-            }
-        },
-        "node_modules/npm-normalize-package-bin": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/npm-normalize-package-bin/-/npm-normalize-package-bin-1.0.1.tgz",
-            "integrity": "sha512-EPfafl6JL5/rU+ot6P3gRSCpPDW5VmIzX959Ob1+ySFUuuYHWHekXpwdUZcKP5C+DS4GEtdJluwBjnsNDl+fSA=="
-        },
-        "node_modules/npm-packlist": {
-            "version": "1.4.8",
-            "resolved": "https://registry.npmjs.org/npm-packlist/-/npm-packlist-1.4.8.tgz",
-            "integrity": "sha512-5+AZgwru5IevF5ZdnFglB5wNlHG1AOOuw28WhUq8/8emhBmLv6jX5by4WJCh7lW0uSYZYS6DXqIsyZVIXRZU9A==",
-            "dependencies": {
-                "ignore-walk": "^3.0.1",
-                "npm-bundled": "^1.0.1",
-                "npm-normalize-package-bin": "^1.0.1"
-            }
-        },
-        "node_modules/npm-run-path": {
-            "version": "2.0.2",
-            "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-2.0.2.tgz",
-            "integrity": "sha1-NakjLfo11wZ7TLLd8jV7GHFTbF8=",
-            "dependencies": {
-                "path-key": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/abbrev": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/agent-base": {
-            "version": "4.3.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "es6-promisify": "^5.0.0"
-            },
-            "engines": {
-                "node": ">= 4.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/agentkeepalive": {
-            "version": "3.5.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "humanize-ms": "^1.2.1"
-            },
-            "engines": {
-                "node": ">= 4.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/ajv": {
-            "version": "5.5.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "co": "^4.6.0",
-                "fast-deep-equal": "^1.0.0",
-                "fast-json-stable-stringify": "^2.0.0",
-                "json-schema-traverse": "^0.3.0"
-            }
-        },
-        "node_modules/npm/node_modules/ansi-align": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "string-width": "^2.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/ansi-regex": {
-            "version": "2.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/ansi-styles": {
-            "version": "3.2.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "color-convert": "^1.9.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/ansicolors": {
-            "version": "0.3.2",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/ansistyles": {
-            "version": "0.1.3",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/aproba": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/archy": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/are-we-there-yet": {
-            "version": "1.1.4",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "delegates": "^1.0.0",
-                "readable-stream": "^2.0.6"
-            }
-        },
-        "node_modules/npm/node_modules/are-we-there-yet/node_modules/readable-stream": {
-            "version": "2.3.6",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/are-we-there-yet/node_modules/string_decoder": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/asap": {
-            "version": "2.0.6",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/asn1": {
-            "version": "0.2.4",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "safer-buffer": "~2.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/assert-plus": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.8"
-            }
-        },
-        "node_modules/npm/node_modules/asynckit": {
-            "version": "0.4.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/aws-sign2": {
-            "version": "0.7.0",
-            "inBundle": true,
-            "license": "Apache-2.0",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/npm/node_modules/aws4": {
-            "version": "1.8.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/balanced-match": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/bcrypt-pbkdf": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "BSD-3-Clause",
-            "optional": true,
-            "dependencies": {
-                "tweetnacl": "^0.14.3"
-            }
-        },
-        "node_modules/npm/node_modules/bin-links": {
-            "version": "1.1.7",
-            "inBundle": true,
-            "license": "Artistic-2.0",
-            "dependencies": {
-                "bluebird": "^3.5.3",
-                "cmd-shim": "^3.0.0",
-                "gentle-fs": "^2.3.0",
-                "graceful-fs": "^4.1.15",
-                "npm-normalize-package-bin": "^1.0.0",
-                "write-file-atomic": "^2.3.0"
-            }
-        },
-        "node_modules/npm/node_modules/bluebird": {
-            "version": "3.5.5",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/boxen": {
-            "version": "1.3.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "ansi-align": "^2.0.0",
-                "camelcase": "^4.0.0",
-                "chalk": "^2.0.1",
-                "cli-boxes": "^1.0.0",
-                "string-width": "^2.0.0",
-                "term-size": "^1.2.0",
-                "widest-line": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/brace-expansion": {
-            "version": "1.1.11",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "balanced-match": "^1.0.0",
-                "concat-map": "0.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/buffer-from": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/builtins": {
-            "version": "1.0.3",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/byline": {
-            "version": "5.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/byte-size": {
-            "version": "5.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=6.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/cacache": {
-            "version": "12.0.3",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "bluebird": "^3.5.5",
-                "chownr": "^1.1.1",
-                "figgy-pudding": "^3.5.1",
-                "glob": "^7.1.4",
-                "graceful-fs": "^4.1.15",
-                "infer-owner": "^1.0.3",
-                "lru-cache": "^5.1.1",
-                "mississippi": "^3.0.0",
-                "mkdirp": "^0.5.1",
-                "move-concurrently": "^1.0.1",
-                "promise-inflight": "^1.0.1",
-                "rimraf": "^2.6.3",
-                "ssri": "^6.0.1",
-                "unique-filename": "^1.1.1",
-                "y18n": "^4.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/call-limit": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/camelcase": {
-            "version": "4.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/capture-stack-trace": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/caseless": {
-            "version": "0.12.0",
-            "inBundle": true,
-            "license": "Apache-2.0"
-        },
-        "node_modules/npm/node_modules/chalk": {
-            "version": "2.4.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "ansi-styles": "^3.2.1",
-                "escape-string-regexp": "^1.0.5",
-                "supports-color": "^5.3.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/chownr": {
-            "version": "1.1.4",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/ci-info": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/cidr-regex": {
-            "version": "2.0.10",
-            "inBundle": true,
-            "license": "BSD-2-Clause",
-            "dependencies": {
-                "ip-regex": "^2.1.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/cli-boxes": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/cli-columns": {
-            "version": "3.1.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "string-width": "^2.0.0",
-                "strip-ansi": "^3.0.1"
-            },
-            "engines": {
-                "node": ">= 4"
-            }
-        },
-        "node_modules/npm/node_modules/cli-table3": {
-            "version": "0.5.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "object-assign": "^4.1.0",
-                "string-width": "^2.1.1"
-            },
-            "engines": {
-                "node": ">=6"
-            },
-            "optionalDependencies": {
-                "colors": "^1.1.2"
-            }
-        },
-        "node_modules/npm/node_modules/cliui": {
-            "version": "4.1.0",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "string-width": "^2.1.1",
-                "strip-ansi": "^4.0.0",
-                "wrap-ansi": "^2.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/cliui/node_modules/ansi-regex": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/cliui/node_modules/strip-ansi": {
-            "version": "4.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "ansi-regex": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/clone": {
-            "version": "1.0.4",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.8"
-            }
-        },
-        "node_modules/npm/node_modules/cmd-shim": {
-            "version": "3.0.3",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "graceful-fs": "^4.1.2",
-                "mkdirp": "~0.5.0"
-            }
-        },
-        "node_modules/npm/node_modules/co": {
-            "version": "4.6.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "iojs": ">= 1.0.0",
-                "node": ">= 0.12.0"
-            }
-        },
-        "node_modules/npm/node_modules/code-point-at": {
-            "version": "1.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/color-convert": {
-            "version": "1.9.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "color-name": "^1.1.1"
-            }
-        },
-        "node_modules/npm/node_modules/color-name": {
-            "version": "1.1.3",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/colors": {
-            "version": "1.3.3",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "engines": {
-                "node": ">=0.1.90"
-            }
-        },
-        "node_modules/npm/node_modules/columnify": {
-            "version": "1.5.4",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "strip-ansi": "^3.0.0",
-                "wcwidth": "^1.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/combined-stream": {
-            "version": "1.0.6",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "delayed-stream": "~1.0.0"
-            },
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/npm/node_modules/concat-map": {
-            "version": "0.0.1",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/concat-stream": {
-            "version": "1.6.2",
-            "engines": [
-                "node >= 0.8"
-            ],
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "buffer-from": "^1.0.0",
-                "inherits": "^2.0.3",
-                "readable-stream": "^2.2.2",
-                "typedarray": "^0.0.6"
-            }
-        },
-        "node_modules/npm/node_modules/concat-stream/node_modules/readable-stream": {
-            "version": "2.3.6",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/concat-stream/node_modules/string_decoder": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/config-chain": {
-            "version": "1.1.12",
-            "inBundle": true,
-            "dependencies": {
-                "ini": "^1.3.4",
-                "proto-list": "~1.2.1"
-            }
-        },
-        "node_modules/npm/node_modules/configstore": {
-            "version": "3.1.2",
-            "inBundle": true,
-            "license": "BSD-2-Clause",
-            "dependencies": {
-                "dot-prop": "^4.1.0",
-                "graceful-fs": "^4.1.2",
-                "make-dir": "^1.0.0",
-                "unique-string": "^1.0.0",
-                "write-file-atomic": "^2.0.0",
-                "xdg-basedir": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/console-control-strings": {
-            "version": "1.1.0",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/copy-concurrently": {
-            "version": "1.0.5",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "aproba": "^1.1.1",
-                "fs-write-stream-atomic": "^1.0.8",
-                "iferr": "^0.1.5",
-                "mkdirp": "^0.5.1",
-                "rimraf": "^2.5.4",
-                "run-queue": "^1.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/copy-concurrently/node_modules/aproba": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/copy-concurrently/node_modules/iferr": {
-            "version": "0.1.5",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/core-util-is": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/create-error-class": {
-            "version": "3.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "capture-stack-trace": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/cross-spawn": {
-            "version": "5.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "lru-cache": "^4.0.1",
-                "shebang-command": "^1.2.0",
-                "which": "^1.2.9"
-            }
-        },
-        "node_modules/npm/node_modules/cross-spawn/node_modules/lru-cache": {
-            "version": "4.1.5",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "pseudomap": "^1.0.2",
-                "yallist": "^2.1.2"
-            }
-        },
-        "node_modules/npm/node_modules/cross-spawn/node_modules/yallist": {
-            "version": "2.1.2",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/crypto-random-string": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/cyclist": {
-            "version": "0.2.2",
-            "inBundle": true
-        },
-        "node_modules/npm/node_modules/dashdash": {
-            "version": "1.14.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "assert-plus": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10"
-            }
-        },
-        "node_modules/npm/node_modules/debug": {
-            "version": "3.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/debug/node_modules/ms": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/debuglog": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/npm/node_modules/decamelize": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/decode-uri-component": {
-            "version": "0.2.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10"
-            }
-        },
-        "node_modules/npm/node_modules/deep-extend": {
-            "version": "0.6.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/defaults": {
-            "version": "1.0.3",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "clone": "^1.0.2"
-            }
-        },
-        "node_modules/npm/node_modules/define-properties": {
-            "version": "1.1.3",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "object-keys": "^1.0.12"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/npm/node_modules/delayed-stream": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/npm/node_modules/delegates": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/detect-indent": {
-            "version": "5.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/detect-newline": {
-            "version": "2.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/dezalgo": {
-            "version": "1.0.3",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "asap": "^2.0.0",
-                "wrappy": "1"
-            }
-        },
-        "node_modules/npm/node_modules/dot-prop": {
-            "version": "4.2.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "is-obj": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/dotenv": {
-            "version": "5.0.1",
-            "inBundle": true,
-            "license": "BSD-2-Clause",
-            "engines": {
-                "node": ">=4.6.0"
-            }
-        },
-        "node_modules/npm/node_modules/duplexer3": {
-            "version": "0.1.4",
-            "inBundle": true,
-            "license": "BSD-3-Clause"
-        },
-        "node_modules/npm/node_modules/duplexify": {
-            "version": "3.6.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "end-of-stream": "^1.0.0",
-                "inherits": "^2.0.1",
-                "readable-stream": "^2.0.0",
-                "stream-shift": "^1.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/duplexify/node_modules/readable-stream": {
-            "version": "2.3.6",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/duplexify/node_modules/string_decoder": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/ecc-jsbn": {
-            "version": "0.1.2",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "jsbn": "~0.1.0",
-                "safer-buffer": "^2.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/editor": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/encoding": {
-            "version": "0.1.12",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "iconv-lite": "~0.4.13"
-            }
-        },
-        "node_modules/npm/node_modules/end-of-stream": {
-            "version": "1.4.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "once": "^1.4.0"
-            }
-        },
-        "node_modules/npm/node_modules/env-paths": {
-            "version": "2.2.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/err-code": {
-            "version": "1.1.2",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/errno": {
-            "version": "0.1.7",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "prr": "~1.0.1"
-            },
-            "bin": {
-                "errno": "cli.js"
-            }
-        },
-        "node_modules/npm/node_modules/es-abstract": {
-            "version": "1.12.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "es-to-primitive": "^1.1.1",
-                "function-bind": "^1.1.1",
-                "has": "^1.0.1",
-                "is-callable": "^1.1.3",
-                "is-regex": "^1.0.4"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/npm/node_modules/es-to-primitive": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "is-callable": "^1.1.4",
-                "is-date-object": "^1.0.1",
-                "is-symbol": "^1.0.2"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/npm/node_modules/es6-promise": {
-            "version": "4.2.8",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/es6-promisify": {
-            "version": "5.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "es6-promise": "^4.0.3"
-            }
-        },
-        "node_modules/npm/node_modules/escape-string-regexp": {
-            "version": "1.0.5",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.8.0"
-            }
-        },
-        "node_modules/npm/node_modules/execa": {
-            "version": "0.7.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "cross-spawn": "^5.0.1",
-                "get-stream": "^3.0.0",
-                "is-stream": "^1.1.0",
-                "npm-run-path": "^2.0.0",
-                "p-finally": "^1.0.0",
-                "signal-exit": "^3.0.0",
-                "strip-eof": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/execa/node_modules/get-stream": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/extend": {
-            "version": "3.0.2",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/extsprintf": {
-            "version": "1.3.0",
-            "engines": [
-                "node >=0.6.0"
-            ],
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/fast-deep-equal": {
-            "version": "1.1.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/fast-json-stable-stringify": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/figgy-pudding": {
-            "version": "3.5.1",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/find-npm-prefix": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/find-up": {
-            "version": "2.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "locate-path": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/flush-write-stream": {
-            "version": "1.0.3",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "inherits": "^2.0.1",
-                "readable-stream": "^2.0.4"
-            }
-        },
-        "node_modules/npm/node_modules/flush-write-stream/node_modules/readable-stream": {
-            "version": "2.3.6",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/flush-write-stream/node_modules/string_decoder": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/forever-agent": {
-            "version": "0.6.1",
-            "inBundle": true,
-            "license": "Apache-2.0",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/npm/node_modules/form-data": {
-            "version": "2.3.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "asynckit": "^0.4.0",
-                "combined-stream": "1.0.6",
-                "mime-types": "^2.1.12"
-            },
-            "engines": {
-                "node": ">= 0.12"
-            }
-        },
-        "node_modules/npm/node_modules/from2": {
-            "version": "2.3.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "inherits": "^2.0.1",
-                "readable-stream": "^2.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/from2/node_modules/readable-stream": {
-            "version": "2.3.6",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/from2/node_modules/string_decoder": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/fs-minipass": {
-            "version": "1.2.7",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "minipass": "^2.6.0"
-            }
-        },
-        "node_modules/npm/node_modules/fs-minipass/node_modules/minipass": {
-            "version": "2.9.0",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "safe-buffer": "^5.1.2",
-                "yallist": "^3.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/fs-vacuum": {
-            "version": "1.2.10",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "graceful-fs": "^4.1.2",
-                "path-is-inside": "^1.0.1",
-                "rimraf": "^2.5.2"
-            }
-        },
-        "node_modules/npm/node_modules/fs-write-stream-atomic": {
-            "version": "1.0.10",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "graceful-fs": "^4.1.2",
-                "iferr": "^0.1.5",
-                "imurmurhash": "^0.1.4",
-                "readable-stream": "1 || 2"
-            }
-        },
-        "node_modules/npm/node_modules/fs-write-stream-atomic/node_modules/iferr": {
-            "version": "0.1.5",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/fs-write-stream-atomic/node_modules/readable-stream": {
-            "version": "2.3.6",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/fs-write-stream-atomic/node_modules/string_decoder": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/fs.realpath": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/function-bind": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/gauge": {
-            "version": "2.7.4",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "aproba": "^1.0.3",
-                "console-control-strings": "^1.0.0",
-                "has-unicode": "^2.0.0",
-                "object-assign": "^4.1.0",
-                "signal-exit": "^3.0.0",
-                "string-width": "^1.0.1",
-                "strip-ansi": "^3.0.1",
-                "wide-align": "^1.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/gauge/node_modules/aproba": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/gauge/node_modules/string-width": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "code-point-at": "^1.0.0",
-                "is-fullwidth-code-point": "^1.0.0",
-                "strip-ansi": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/genfun": {
-            "version": "5.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/gentle-fs": {
-            "version": "2.3.0",
-            "inBundle": true,
-            "license": "Artistic-2.0",
-            "dependencies": {
-                "aproba": "^1.1.2",
-                "chownr": "^1.1.2",
-                "cmd-shim": "^3.0.3",
-                "fs-vacuum": "^1.2.10",
-                "graceful-fs": "^4.1.11",
-                "iferr": "^0.1.5",
-                "infer-owner": "^1.0.4",
-                "mkdirp": "^0.5.1",
-                "path-is-inside": "^1.0.2",
-                "read-cmd-shim": "^1.0.1",
-                "slide": "^1.1.6"
-            }
-        },
-        "node_modules/npm/node_modules/gentle-fs/node_modules/aproba": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/gentle-fs/node_modules/iferr": {
-            "version": "0.1.5",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/get-caller-file": {
-            "version": "1.0.3",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/get-stream": {
-            "version": "4.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "pump": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/getpass": {
-            "version": "0.1.7",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "assert-plus": "^1.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/glob": {
-            "version": "7.1.6",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "fs.realpath": "^1.0.0",
-                "inflight": "^1.0.4",
-                "inherits": "2",
-                "minimatch": "^3.0.4",
-                "once": "^1.3.0",
-                "path-is-absolute": "^1.0.0"
-            },
-            "engines": {
-                "node": "*"
-            },
-            "funding": {
-                "url": "https://github.com/sponsors/isaacs"
-            }
-        },
-        "node_modules/npm/node_modules/global-dirs": {
-            "version": "0.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "ini": "^1.3.4"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/got": {
-            "version": "6.7.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "create-error-class": "^3.0.0",
-                "duplexer3": "^0.1.4",
-                "get-stream": "^3.0.0",
-                "is-redirect": "^1.0.0",
-                "is-retry-allowed": "^1.0.0",
-                "is-stream": "^1.0.0",
-                "lowercase-keys": "^1.0.0",
-                "safe-buffer": "^5.0.1",
-                "timed-out": "^4.0.0",
-                "unzip-response": "^2.0.1",
-                "url-parse-lax": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/got/node_modules/get-stream": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/graceful-fs": {
-            "version": "4.2.4",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/har-schema": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "ISC",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/har-validator": {
-            "version": "5.1.0",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "ajv": "^5.3.0",
-                "har-schema": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/has": {
-            "version": "1.0.3",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "function-bind": "^1.1.1"
-            },
-            "engines": {
-                "node": ">= 0.4.0"
-            }
-        },
-        "node_modules/npm/node_modules/has-flag": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/has-symbols": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/npm/node_modules/has-unicode": {
-            "version": "2.0.1",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/hosted-git-info": {
-            "version": "2.8.8",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/http-cache-semantics": {
-            "version": "3.8.1",
-            "inBundle": true,
-            "license": "BSD-2-Clause"
-        },
-        "node_modules/npm/node_modules/http-proxy-agent": {
-            "version": "2.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "agent-base": "4",
-                "debug": "3.1.0"
-            },
-            "engines": {
-                "node": ">= 4.5.0"
-            }
-        },
-        "node_modules/npm/node_modules/http-signature": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "assert-plus": "^1.0.0",
-                "jsprim": "^1.2.2",
-                "sshpk": "^1.7.0"
-            },
-            "engines": {
-                "node": ">=0.8",
-                "npm": ">=1.3.7"
-            }
-        },
-        "node_modules/npm/node_modules/https-proxy-agent": {
-            "version": "2.2.4",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "agent-base": "^4.3.0",
-                "debug": "^3.1.0"
-            },
-            "engines": {
-                "node": ">= 4.5.0"
-            }
-        },
-        "node_modules/npm/node_modules/humanize-ms": {
-            "version": "1.2.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "ms": "^2.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/iconv-lite": {
-            "version": "0.4.23",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "safer-buffer": ">= 2.1.2 < 3"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/iferr": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=6.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/ignore-walk": {
-            "version": "3.0.3",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "minimatch": "^3.0.4"
-            }
-        },
-        "node_modules/npm/node_modules/import-lazy": {
-            "version": "2.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/imurmurhash": {
-            "version": "0.1.4",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.8.19"
-            }
-        },
-        "node_modules/npm/node_modules/infer-owner": {
-            "version": "1.0.4",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/inflight": {
-            "version": "1.0.6",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "once": "^1.3.0",
-                "wrappy": "1"
-            }
-        },
-        "node_modules/npm/node_modules/inherits": {
-            "version": "2.0.4",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/ini": {
-            "version": "1.3.5",
-            "inBundle": true,
-            "license": "ISC",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/npm/node_modules/init-package-json": {
-            "version": "1.10.3",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "glob": "^7.1.1",
-                "npm-package-arg": "^4.0.0 || ^5.0.0 || ^6.0.0",
-                "promzard": "^0.3.0",
-                "read": "~1.0.1",
-                "read-package-json": "1 || 2",
-                "semver": "2.x || 3.x || 4 || 5",
-                "validate-npm-package-license": "^3.0.1",
-                "validate-npm-package-name": "^3.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/invert-kv": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/ip": {
-            "version": "1.1.5",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/ip-regex": {
-            "version": "2.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/is-callable": {
-            "version": "1.1.4",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/npm/node_modules/is-ci": {
-            "version": "1.2.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "ci-info": "^1.5.0"
-            },
-            "bin": {
-                "is-ci": "bin.js"
-            }
-        },
-        "node_modules/npm/node_modules/is-ci/node_modules/ci-info": {
-            "version": "1.6.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/is-cidr": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "BSD-2-Clause",
-            "dependencies": {
-                "cidr-regex": "^2.0.10"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/is-date-object": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/npm/node_modules/is-fullwidth-code-point": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "number-is-nan": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/is-installed-globally": {
-            "version": "0.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "global-dirs": "^0.1.0",
-                "is-path-inside": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/is-npm": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/is-obj": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/is-path-inside": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "path-is-inside": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/is-redirect": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/is-regex": {
-            "version": "1.0.4",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "has": "^1.0.1"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/npm/node_modules/is-retry-allowed": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/is-stream": {
-            "version": "1.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/is-symbol": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "has-symbols": "^1.0.0"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/npm/node_modules/is-typedarray": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/isarray": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/isexe": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/isstream": {
-            "version": "0.1.2",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/jsbn": {
-            "version": "0.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "optional": true
-        },
-        "node_modules/npm/node_modules/json-parse-better-errors": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/json-schema": {
-            "version": "0.2.3",
-            "inBundle": true
-        },
-        "node_modules/npm/node_modules/json-schema-traverse": {
-            "version": "0.3.1",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/json-stringify-safe": {
-            "version": "5.0.1",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/jsonparse": {
-            "version": "1.3.1",
-            "engines": [
-                "node >= 0.2.0"
-            ],
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/JSONStream": {
-            "version": "1.3.5",
-            "inBundle": true,
-            "license": "(MIT OR Apache-2.0)",
-            "dependencies": {
-                "jsonparse": "^1.2.0",
-                "through": ">=2.2.7 <3"
-            },
-            "bin": {
-                "JSONStream": "bin.js"
-            },
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/npm/node_modules/jsprim": {
-            "version": "1.4.1",
-            "engines": [
-                "node >=0.6.0"
-            ],
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "assert-plus": "1.0.0",
-                "extsprintf": "1.3.0",
-                "json-schema": "0.2.3",
-                "verror": "1.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/latest-version": {
-            "version": "3.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "package-json": "^4.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/lazy-property": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/lcid": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "invert-kv": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/libcipm": {
-            "version": "4.0.7",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "bin-links": "^1.1.2",
-                "bluebird": "^3.5.1",
-                "figgy-pudding": "^3.5.1",
-                "find-npm-prefix": "^1.0.2",
-                "graceful-fs": "^4.1.11",
-                "ini": "^1.3.5",
-                "lock-verify": "^2.0.2",
-                "mkdirp": "^0.5.1",
-                "npm-lifecycle": "^3.0.0",
-                "npm-logical-tree": "^1.2.1",
-                "npm-package-arg": "^6.1.0",
-                "pacote": "^9.1.0",
-                "read-package-json": "^2.0.13",
-                "rimraf": "^2.6.2",
-                "worker-farm": "^1.6.0"
-            }
-        },
-        "node_modules/npm/node_modules/libnpm": {
-            "version": "3.0.1",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "bin-links": "^1.1.2",
-                "bluebird": "^3.5.3",
-                "find-npm-prefix": "^1.0.2",
-                "libnpmaccess": "^3.0.2",
-                "libnpmconfig": "^1.2.1",
-                "libnpmhook": "^5.0.3",
-                "libnpmorg": "^1.0.1",
-                "libnpmpublish": "^1.1.2",
-                "libnpmsearch": "^2.0.2",
-                "libnpmteam": "^1.0.2",
-                "lock-verify": "^2.0.2",
-                "npm-lifecycle": "^3.0.0",
-                "npm-logical-tree": "^1.2.1",
-                "npm-package-arg": "^6.1.0",
-                "npm-profile": "^4.0.2",
-                "npm-registry-fetch": "^4.0.0",
-                "npmlog": "^4.1.2",
-                "pacote": "^9.5.3",
-                "read-package-json": "^2.0.13",
-                "stringify-package": "^1.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/libnpmaccess": {
-            "version": "3.0.2",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "aproba": "^2.0.0",
-                "get-stream": "^4.0.0",
-                "npm-package-arg": "^6.1.0",
-                "npm-registry-fetch": "^4.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/libnpmconfig": {
-            "version": "1.2.1",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "figgy-pudding": "^3.5.1",
-                "find-up": "^3.0.0",
-                "ini": "^1.3.5"
-            }
-        },
-        "node_modules/npm/node_modules/libnpmconfig/node_modules/find-up": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "locate-path": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/libnpmconfig/node_modules/locate-path": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "p-locate": "^3.0.0",
-                "path-exists": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/libnpmconfig/node_modules/p-limit": {
-            "version": "2.2.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "p-try": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/libnpmconfig/node_modules/p-locate": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "p-limit": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/libnpmconfig/node_modules/p-try": {
-            "version": "2.2.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/libnpmhook": {
-            "version": "5.0.3",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "aproba": "^2.0.0",
-                "figgy-pudding": "^3.4.1",
-                "get-stream": "^4.0.0",
-                "npm-registry-fetch": "^4.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/libnpmorg": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "aproba": "^2.0.0",
-                "figgy-pudding": "^3.4.1",
-                "get-stream": "^4.0.0",
-                "npm-registry-fetch": "^4.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/libnpmpublish": {
-            "version": "1.1.2",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "aproba": "^2.0.0",
-                "figgy-pudding": "^3.5.1",
-                "get-stream": "^4.0.0",
-                "lodash.clonedeep": "^4.5.0",
-                "normalize-package-data": "^2.4.0",
-                "npm-package-arg": "^6.1.0",
-                "npm-registry-fetch": "^4.0.0",
-                "semver": "^5.5.1",
-                "ssri": "^6.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/libnpmsearch": {
-            "version": "2.0.2",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "figgy-pudding": "^3.5.1",
-                "get-stream": "^4.0.0",
-                "npm-registry-fetch": "^4.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/libnpmteam": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "aproba": "^2.0.0",
-                "figgy-pudding": "^3.4.1",
-                "get-stream": "^4.0.0",
-                "npm-registry-fetch": "^4.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/libnpx": {
-            "version": "10.2.2",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "dotenv": "^5.0.1",
-                "npm-package-arg": "^6.0.0",
-                "rimraf": "^2.6.2",
-                "safe-buffer": "^5.1.0",
-                "update-notifier": "^2.3.0",
-                "which": "^1.3.0",
-                "y18n": "^4.0.0",
-                "yargs": "^11.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/locate-path": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "p-locate": "^2.0.0",
-                "path-exists": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/lock-verify": {
-            "version": "2.1.0",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "npm-package-arg": "^6.1.0",
-                "semver": "^5.4.1"
-            }
-        },
-        "node_modules/npm/node_modules/lockfile": {
-            "version": "1.0.4",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "signal-exit": "^3.0.2"
-            }
-        },
-        "node_modules/npm/node_modules/lodash._baseindexof": {
-            "version": "3.1.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/lodash._baseuniq": {
-            "version": "4.6.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "lodash._createset": "~4.0.0",
-                "lodash._root": "~3.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/lodash._bindcallback": {
-            "version": "3.0.1",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/lodash._cacheindexof": {
-            "version": "3.0.2",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/lodash._createcache": {
-            "version": "3.1.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "lodash._getnative": "^3.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/lodash._createset": {
-            "version": "4.0.3",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/lodash._getnative": {
-            "version": "3.9.1",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/lodash._root": {
-            "version": "3.0.1",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/lodash.clonedeep": {
-            "version": "4.5.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/lodash.restparam": {
-            "version": "3.6.1",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/lodash.union": {
-            "version": "4.6.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/lodash.uniq": {
-            "version": "4.5.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/lodash.without": {
-            "version": "4.4.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/lowercase-keys": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/lru-cache": {
-            "version": "5.1.1",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "yallist": "^3.0.2"
-            }
-        },
-        "node_modules/npm/node_modules/make-dir": {
-            "version": "1.3.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "pify": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/make-fetch-happen": {
-            "version": "5.0.2",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "agentkeepalive": "^3.4.1",
-                "cacache": "^12.0.0",
-                "http-cache-semantics": "^3.8.1",
-                "http-proxy-agent": "^2.1.0",
-                "https-proxy-agent": "^2.2.3",
-                "lru-cache": "^5.1.1",
-                "mississippi": "^3.0.0",
-                "node-fetch-npm": "^2.0.2",
-                "promise-retry": "^1.1.1",
-                "socks-proxy-agent": "^4.0.0",
-                "ssri": "^6.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/map-age-cleaner": {
-            "version": "0.1.3",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "p-defer": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/meant": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/mem": {
-            "version": "4.3.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "map-age-cleaner": "^0.1.1",
-                "mimic-fn": "^2.0.0",
-                "p-is-promise": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/mem/node_modules/mimic-fn": {
-            "version": "2.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/mime-db": {
-            "version": "1.35.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/npm/node_modules/mime-types": {
-            "version": "2.1.19",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "mime-db": "~1.35.0"
-            },
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/npm/node_modules/minimatch": {
-            "version": "3.0.4",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "brace-expansion": "^1.1.7"
-            },
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/npm/node_modules/minizlib": {
-            "version": "1.3.3",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "minipass": "^2.9.0"
-            }
-        },
-        "node_modules/npm/node_modules/minizlib/node_modules/minipass": {
-            "version": "2.9.0",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "safe-buffer": "^5.1.2",
-                "yallist": "^3.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/mississippi": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "BSD-2-Clause",
-            "dependencies": {
-                "concat-stream": "^1.5.0",
-                "duplexify": "^3.4.2",
-                "end-of-stream": "^1.1.0",
-                "flush-write-stream": "^1.0.0",
-                "from2": "^2.1.0",
-                "parallel-transform": "^1.1.0",
-                "pump": "^3.0.0",
-                "pumpify": "^1.3.3",
-                "stream-each": "^1.1.0",
-                "through2": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/mkdirp": {
-            "version": "0.5.5",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "minimist": "^1.2.5"
-            },
-            "bin": {
-                "mkdirp": "bin/cmd.js"
-            }
-        },
-        "node_modules/npm/node_modules/mkdirp/node_modules/minimist": {
-            "version": "1.2.5",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/move-concurrently": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "aproba": "^1.1.1",
-                "copy-concurrently": "^1.0.0",
-                "fs-write-stream-atomic": "^1.0.8",
-                "mkdirp": "^0.5.1",
-                "rimraf": "^2.5.4",
-                "run-queue": "^1.0.3"
-            }
-        },
-        "node_modules/npm/node_modules/move-concurrently/node_modules/aproba": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/ms": {
-            "version": "2.1.1",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/mute-stream": {
-            "version": "0.0.7",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/nice-try": {
-            "version": "1.0.5",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/node-fetch-npm": {
-            "version": "2.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "encoding": "^0.1.11",
-                "json-parse-better-errors": "^1.0.0",
-                "safe-buffer": "^5.1.1"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/node-gyp": {
-            "version": "5.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "env-paths": "^2.2.0",
-                "glob": "^7.1.4",
-                "graceful-fs": "^4.2.2",
-                "mkdirp": "^0.5.1",
-                "nopt": "^4.0.1",
-                "npmlog": "^4.1.2",
-                "request": "^2.88.0",
-                "rimraf": "^2.6.3",
-                "semver": "^5.7.1",
-                "tar": "^4.4.12",
-                "which": "^1.3.1"
-            },
-            "bin": {
-                "node-gyp": "bin/node-gyp.js"
-            },
-            "engines": {
-                "node": ">= 6.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/nopt": {
-            "version": "4.0.3",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "abbrev": "1",
-                "osenv": "^0.1.4"
-            },
-            "bin": {
-                "nopt": "bin/nopt.js"
-            }
-        },
-        "node_modules/npm/node_modules/normalize-package-data": {
-            "version": "2.5.0",
-            "inBundle": true,
-            "license": "BSD-2-Clause",
-            "dependencies": {
-                "hosted-git-info": "^2.1.4",
-                "resolve": "^1.10.0",
-                "semver": "2 || 3 || 4 || 5",
-                "validate-npm-package-license": "^3.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/normalize-package-data/node_modules/resolve": {
-            "version": "1.10.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "path-parse": "^1.0.6"
-            }
-        },
-        "node_modules/npm/node_modules/npm-audit-report": {
-            "version": "1.3.2",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "cli-table3": "^0.5.0",
-                "console-control-strings": "^1.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/npm-bundled": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "npm-normalize-package-bin": "^1.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/npm-cache-filename": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/npm-install-checks": {
-            "version": "3.0.2",
-            "inBundle": true,
-            "license": "BSD-2-Clause",
-            "dependencies": {
-                "semver": "^2.3.0 || 3.x || 4 || 5"
-            }
-        },
-        "node_modules/npm/node_modules/npm-lifecycle": {
-            "version": "3.1.4",
-            "inBundle": true,
-            "license": "Artistic-2.0",
-            "dependencies": {
-                "byline": "^5.0.0",
-                "graceful-fs": "^4.1.15",
-                "node-gyp": "^5.0.2",
-                "resolve-from": "^4.0.0",
-                "slide": "^1.1.6",
-                "uid-number": "0.0.6",
-                "umask": "^1.1.0",
-                "which": "^1.3.1"
-            }
-        },
-        "node_modules/npm/node_modules/npm-logical-tree": {
-            "version": "1.2.1",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/npm-normalize-package-bin": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/npm-package-arg": {
-            "version": "6.1.1",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "hosted-git-info": "^2.7.1",
-                "osenv": "^0.1.5",
-                "semver": "^5.6.0",
-                "validate-npm-package-name": "^3.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/npm-packlist": {
-            "version": "1.4.8",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "ignore-walk": "^3.0.1",
-                "npm-bundled": "^1.0.1",
-                "npm-normalize-package-bin": "^1.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/npm-pick-manifest": {
-            "version": "3.0.2",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "figgy-pudding": "^3.5.1",
-                "npm-package-arg": "^6.0.0",
-                "semver": "^5.4.1"
-            }
-        },
-        "node_modules/npm/node_modules/npm-profile": {
-            "version": "4.0.4",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "aproba": "^1.1.2 || 2",
-                "figgy-pudding": "^3.4.1",
-                "npm-registry-fetch": "^4.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/npm-registry-fetch": {
-            "version": "4.0.4",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "bluebird": "^3.5.1",
-                "figgy-pudding": "^3.4.1",
-                "JSONStream": "^1.3.4",
-                "lru-cache": "^5.1.1",
-                "make-fetch-happen": "^5.0.0",
-                "npm-package-arg": "^6.1.0",
-                "safe-buffer": "^5.2.0"
-            }
-        },
-        "node_modules/npm/node_modules/npm-registry-fetch/node_modules/safe-buffer": {
-            "version": "5.2.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/npm-run-path": {
-            "version": "2.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "path-key": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/npm-user-validate": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "BSD-2-Clause"
-        },
-        "node_modules/npm/node_modules/npmlog": {
-            "version": "4.1.2",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "are-we-there-yet": "~1.1.2",
-                "console-control-strings": "~1.1.0",
-                "gauge": "~2.7.3",
-                "set-blocking": "~2.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/number-is-nan": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/oauth-sign": {
-            "version": "0.9.0",
-            "inBundle": true,
-            "license": "Apache-2.0",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/npm/node_modules/object-assign": {
-            "version": "4.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/object-keys": {
-            "version": "1.0.12",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/npm/node_modules/object.getownpropertydescriptors": {
-            "version": "2.0.3",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "define-properties": "^1.1.2",
-                "es-abstract": "^1.5.1"
-            },
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/npm/node_modules/once": {
-            "version": "1.4.0",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "wrappy": "1"
-            }
-        },
-        "node_modules/npm/node_modules/opener": {
-            "version": "1.5.1",
-            "inBundle": true,
-            "license": "(WTFPL OR MIT)",
-            "bin": {
-                "opener": "bin/opener-bin.js"
-            }
-        },
-        "node_modules/npm/node_modules/os-homedir": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/os-locale": {
-            "version": "3.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "execa": "^1.0.0",
-                "lcid": "^2.0.0",
-                "mem": "^4.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/os-locale/node_modules/cross-spawn": {
-            "version": "6.0.5",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "nice-try": "^1.0.4",
-                "path-key": "^2.0.1",
-                "semver": "^5.5.0",
-                "shebang-command": "^1.2.0",
-                "which": "^1.2.9"
-            },
-            "engines": {
-                "node": ">=4.8"
-            }
-        },
-        "node_modules/npm/node_modules/os-locale/node_modules/execa": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "cross-spawn": "^6.0.0",
-                "get-stream": "^4.0.0",
-                "is-stream": "^1.1.0",
-                "npm-run-path": "^2.0.0",
-                "p-finally": "^1.0.0",
-                "signal-exit": "^3.0.0",
-                "strip-eof": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/os-tmpdir": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/osenv": {
-            "version": "0.1.5",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "os-homedir": "^1.0.0",
-                "os-tmpdir": "^1.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/p-defer": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/p-finally": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/p-is-promise": {
-            "version": "2.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/p-limit": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "p-try": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/p-locate": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "p-limit": "^1.1.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/p-try": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/package-json": {
-            "version": "4.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "got": "^6.7.1",
-                "registry-auth-token": "^3.0.1",
-                "registry-url": "^3.0.3",
-                "semver": "^5.1.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/pacote": {
-            "version": "9.5.12",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "bluebird": "^3.5.3",
-                "cacache": "^12.0.2",
-                "chownr": "^1.1.2",
-                "figgy-pudding": "^3.5.1",
-                "get-stream": "^4.1.0",
-                "glob": "^7.1.3",
-                "infer-owner": "^1.0.4",
-                "lru-cache": "^5.1.1",
-                "make-fetch-happen": "^5.0.0",
-                "minimatch": "^3.0.4",
-                "minipass": "^2.3.5",
-                "mississippi": "^3.0.0",
-                "mkdirp": "^0.5.1",
-                "normalize-package-data": "^2.4.0",
-                "npm-normalize-package-bin": "^1.0.0",
-                "npm-package-arg": "^6.1.0",
-                "npm-packlist": "^1.1.12",
-                "npm-pick-manifest": "^3.0.0",
-                "npm-registry-fetch": "^4.0.0",
-                "osenv": "^0.1.5",
-                "promise-inflight": "^1.0.1",
-                "promise-retry": "^1.1.1",
-                "protoduck": "^5.0.1",
-                "rimraf": "^2.6.2",
-                "safe-buffer": "^5.1.2",
-                "semver": "^5.6.0",
-                "ssri": "^6.0.1",
-                "tar": "^4.4.10",
-                "unique-filename": "^1.1.1",
-                "which": "^1.3.1"
-            }
-        },
-        "node_modules/npm/node_modules/pacote/node_modules/minipass": {
-            "version": "2.9.0",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "safe-buffer": "^5.1.2",
-                "yallist": "^3.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/parallel-transform": {
-            "version": "1.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "cyclist": "~0.2.2",
-                "inherits": "^2.0.3",
-                "readable-stream": "^2.1.5"
-            }
-        },
-        "node_modules/npm/node_modules/parallel-transform/node_modules/readable-stream": {
-            "version": "2.3.6",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/parallel-transform/node_modules/string_decoder": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/path-exists": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/path-is-absolute": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/path-is-inside": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "(WTFPL OR MIT)"
-        },
-        "node_modules/npm/node_modules/path-key": {
-            "version": "2.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/path-parse": {
-            "version": "1.0.6",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/performance-now": {
-            "version": "2.1.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/pify": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/prepend-http": {
-            "version": "1.0.4",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/process-nextick-args": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/promise-inflight": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/promise-retry": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "err-code": "^1.0.0",
-                "retry": "^0.10.0"
-            },
-            "engines": {
-                "node": ">=0.12"
-            }
-        },
-        "node_modules/npm/node_modules/promise-retry/node_modules/retry": {
-            "version": "0.10.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/npm/node_modules/promzard": {
-            "version": "0.3.0",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "read": "1"
-            }
-        },
-        "node_modules/npm/node_modules/proto-list": {
-            "version": "1.2.4",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/protoduck": {
-            "version": "5.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "genfun": "^5.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/prr": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/pseudomap": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/psl": {
-            "version": "1.1.29",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/pump": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "end-of-stream": "^1.1.0",
-                "once": "^1.3.1"
-            }
-        },
-        "node_modules/npm/node_modules/pumpify": {
-            "version": "1.5.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "duplexify": "^3.6.0",
-                "inherits": "^2.0.3",
-                "pump": "^2.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/pumpify/node_modules/pump": {
-            "version": "2.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "end-of-stream": "^1.1.0",
-                "once": "^1.3.1"
-            }
-        },
-        "node_modules/npm/node_modules/punycode": {
-            "version": "1.4.1",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/qrcode-terminal": {
-            "version": "0.12.0",
-            "inBundle": true,
-            "bin": {
-                "qrcode-terminal": "bin/qrcode-terminal.js"
-            }
-        },
-        "node_modules/npm/node_modules/qs": {
-            "version": "6.5.2",
-            "inBundle": true,
-            "license": "BSD-3-Clause",
-            "engines": {
-                "node": ">=0.6"
-            }
-        },
-        "node_modules/npm/node_modules/query-string": {
-            "version": "6.8.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "decode-uri-component": "^0.2.0",
-                "split-on-first": "^1.0.0",
-                "strict-uri-encode": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/qw": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/rc": {
-            "version": "1.2.8",
-            "inBundle": true,
-            "license": "(BSD-2-Clause OR MIT OR Apache-2.0)",
-            "dependencies": {
-                "deep-extend": "^0.6.0",
-                "ini": "~1.3.0",
-                "minimist": "^1.2.0",
-                "strip-json-comments": "~2.0.1"
-            },
-            "bin": {
-                "rc": "cli.js"
-            }
-        },
-        "node_modules/npm/node_modules/rc/node_modules/minimist": {
-            "version": "1.2.5",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/read": {
-            "version": "1.0.7",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "mute-stream": "~0.0.4"
-            },
-            "engines": {
-                "node": ">=0.8"
-            }
-        },
-        "node_modules/npm/node_modules/read-cmd-shim": {
-            "version": "1.0.5",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "graceful-fs": "^4.1.2"
-            }
-        },
-        "node_modules/npm/node_modules/read-installed": {
-            "version": "4.0.3",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "debuglog": "^1.0.1",
-                "read-package-json": "^2.0.0",
-                "readdir-scoped-modules": "^1.0.0",
-                "semver": "2 || 3 || 4 || 5",
-                "slide": "~1.1.3",
-                "util-extend": "^1.0.1"
-            },
-            "optionalDependencies": {
-                "graceful-fs": "^4.1.2"
-            }
-        },
-        "node_modules/npm/node_modules/read-package-json": {
-            "version": "2.1.1",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "glob": "^7.1.1",
-                "json-parse-better-errors": "^1.0.1",
-                "normalize-package-data": "^2.0.0",
-                "npm-normalize-package-bin": "^1.0.0"
-            },
-            "optionalDependencies": {
-                "graceful-fs": "^4.1.2"
-            }
-        },
-        "node_modules/npm/node_modules/read-package-tree": {
-            "version": "5.3.1",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "read-package-json": "^2.0.0",
-                "readdir-scoped-modules": "^1.0.0",
-                "util-promisify": "^2.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/readable-stream": {
-            "version": "3.6.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "inherits": "^2.0.3",
-                "string_decoder": "^1.1.1",
-                "util-deprecate": "^1.0.1"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/npm/node_modules/readdir-scoped-modules": {
-            "version": "1.1.0",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "debuglog": "^1.0.1",
-                "dezalgo": "^1.0.0",
-                "graceful-fs": "^4.1.2",
-                "once": "^1.3.0"
-            }
-        },
-        "node_modules/npm/node_modules/registry-auth-token": {
-            "version": "3.4.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "rc": "^1.1.6",
-                "safe-buffer": "^5.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/registry-url": {
-            "version": "3.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "rc": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/request": {
-            "version": "2.88.0",
-            "inBundle": true,
-            "license": "Apache-2.0",
-            "dependencies": {
-                "aws-sign2": "~0.7.0",
-                "aws4": "^1.8.0",
-                "caseless": "~0.12.0",
-                "combined-stream": "~1.0.6",
-                "extend": "~3.0.2",
-                "forever-agent": "~0.6.1",
-                "form-data": "~2.3.2",
-                "har-validator": "~5.1.0",
-                "http-signature": "~1.2.0",
-                "is-typedarray": "~1.0.0",
-                "isstream": "~0.1.2",
-                "json-stringify-safe": "~5.0.1",
-                "mime-types": "~2.1.19",
-                "oauth-sign": "~0.9.0",
-                "performance-now": "^2.1.0",
-                "qs": "~6.5.2",
-                "safe-buffer": "^5.1.2",
-                "tough-cookie": "~2.4.3",
-                "tunnel-agent": "^0.6.0",
-                "uuid": "^3.3.2"
-            },
-            "engines": {
-                "node": ">= 4"
-            }
-        },
-        "node_modules/npm/node_modules/require-directory": {
-            "version": "2.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/require-main-filename": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/resolve-from": {
-            "version": "4.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/retry": {
-            "version": "0.12.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">= 4"
-            }
-        },
-        "node_modules/npm/node_modules/rimraf": {
-            "version": "2.7.1",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/npm/node_modules/run-queue": {
-            "version": "1.0.3",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "aproba": "^1.1.1"
-            }
-        },
-        "node_modules/npm/node_modules/run-queue/node_modules/aproba": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/safe-buffer": {
-            "version": "5.1.2",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/safer-buffer": {
-            "version": "2.1.2",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/semver": {
-            "version": "5.7.1",
-            "inBundle": true,
-            "license": "ISC",
-            "bin": {
-                "semver": "bin/semver"
-            }
-        },
-        "node_modules/npm/node_modules/semver-diff": {
-            "version": "2.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "semver": "^5.0.3"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/set-blocking": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/sha": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "(BSD-2-Clause OR MIT)",
-            "dependencies": {
-                "graceful-fs": "^4.1.2"
-            }
-        },
-        "node_modules/npm/node_modules/shebang-command": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "shebang-regex": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/shebang-regex": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/signal-exit": {
-            "version": "3.0.2",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/slide": {
-            "version": "1.1.6",
-            "inBundle": true,
-            "license": "ISC",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/npm/node_modules/smart-buffer": {
-            "version": "4.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">= 6.0.0",
-                "npm": ">= 3.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/socks": {
-            "version": "2.3.3",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "ip": "1.1.5",
-                "smart-buffer": "^4.1.0"
-            },
-            "engines": {
-                "node": ">= 6.0.0",
-                "npm": ">= 3.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/socks-proxy-agent": {
-            "version": "4.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "agent-base": "~4.2.1",
-                "socks": "~2.3.2"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/npm/node_modules/socks-proxy-agent/node_modules/agent-base": {
-            "version": "4.2.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "es6-promisify": "^5.0.0"
-            },
-            "engines": {
-                "node": ">= 4.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/sorted-object": {
-            "version": "2.0.1",
-            "inBundle": true,
-            "license": "(WTFPL OR MIT)"
-        },
-        "node_modules/npm/node_modules/sorted-union-stream": {
-            "version": "2.1.3",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "from2": "^1.3.0",
-                "stream-iterate": "^1.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/sorted-union-stream/node_modules/from2": {
-            "version": "1.3.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "inherits": "~2.0.1",
-                "readable-stream": "~1.1.10"
-            }
-        },
-        "node_modules/npm/node_modules/sorted-union-stream/node_modules/isarray": {
-            "version": "0.0.1",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/sorted-union-stream/node_modules/readable-stream": {
-            "version": "1.1.14",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.1",
-                "isarray": "0.0.1",
-                "string_decoder": "~0.10.x"
-            }
-        },
-        "node_modules/npm/node_modules/sorted-union-stream/node_modules/string_decoder": {
-            "version": "0.10.31",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/spdx-correct": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "Apache-2.0",
-            "dependencies": {
-                "spdx-expression-parse": "^3.0.0",
-                "spdx-license-ids": "^3.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/spdx-exceptions": {
-            "version": "2.1.0",
-            "inBundle": true,
-            "license": "CC-BY-3.0"
-        },
-        "node_modules/npm/node_modules/spdx-expression-parse": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "spdx-exceptions": "^2.1.0",
-                "spdx-license-ids": "^3.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/spdx-license-ids": {
-            "version": "3.0.3",
-            "inBundle": true,
-            "license": "CC0-1.0"
-        },
-        "node_modules/npm/node_modules/split-on-first": {
-            "version": "1.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/npm/node_modules/sshpk": {
-            "version": "1.14.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "asn1": "~0.2.3",
-                "assert-plus": "^1.0.0",
-                "dashdash": "^1.12.0",
-                "getpass": "^0.1.1",
-                "safer-buffer": "^2.0.2"
-            },
-            "bin": {
-                "sshpk-conv": "bin/sshpk-conv",
-                "sshpk-sign": "bin/sshpk-sign",
-                "sshpk-verify": "bin/sshpk-verify"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            },
-            "optionalDependencies": {
-                "bcrypt-pbkdf": "^1.0.0",
-                "ecc-jsbn": "~0.1.1",
-                "jsbn": "~0.1.0",
-                "tweetnacl": "~0.14.0"
-            }
-        },
-        "node_modules/npm/node_modules/ssri": {
-            "version": "6.0.1",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "figgy-pudding": "^3.5.1"
-            }
-        },
-        "node_modules/npm/node_modules/stream-each": {
-            "version": "1.2.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "end-of-stream": "^1.1.0",
-                "stream-shift": "^1.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/stream-iterate": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "readable-stream": "^2.1.5",
-                "stream-shift": "^1.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/stream-iterate/node_modules/readable-stream": {
-            "version": "2.3.6",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/stream-iterate/node_modules/string_decoder": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/stream-shift": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/strict-uri-encode": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/string_decoder": {
-            "version": "1.3.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "safe-buffer": "~5.2.0"
-            }
-        },
-        "node_modules/npm/node_modules/string_decoder/node_modules/safe-buffer": {
-            "version": "5.2.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/string-width": {
-            "version": "2.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "is-fullwidth-code-point": "^2.0.0",
-                "strip-ansi": "^4.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/string-width/node_modules/ansi-regex": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/string-width/node_modules/is-fullwidth-code-point": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/string-width/node_modules/strip-ansi": {
-            "version": "4.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "ansi-regex": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/stringify-package": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/strip-ansi": {
-            "version": "3.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "ansi-regex": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/strip-eof": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/strip-json-comments": {
-            "version": "2.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/supports-color": {
-            "version": "5.4.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "has-flag": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/tar": {
-            "version": "4.4.13",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "chownr": "^1.1.1",
-                "fs-minipass": "^1.2.5",
-                "minipass": "^2.8.6",
-                "minizlib": "^1.2.1",
-                "mkdirp": "^0.5.0",
-                "safe-buffer": "^5.1.2",
-                "yallist": "^3.0.3"
-            },
-            "engines": {
-                "node": ">=4.5"
-            }
-        },
-        "node_modules/npm/node_modules/tar/node_modules/minipass": {
-            "version": "2.9.0",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "safe-buffer": "^5.1.2",
-                "yallist": "^3.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/term-size": {
-            "version": "1.2.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "execa": "^0.7.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/text-table": {
-            "version": "0.2.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/through": {
-            "version": "2.3.8",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/through2": {
-            "version": "2.0.3",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "readable-stream": "^2.1.5",
-                "xtend": "~4.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/through2/node_modules/readable-stream": {
-            "version": "2.3.6",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/npm/node_modules/through2/node_modules/string_decoder": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/timed-out": {
-            "version": "4.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/tiny-relative-date": {
-            "version": "1.3.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/tough-cookie": {
-            "version": "2.4.3",
-            "inBundle": true,
-            "license": "BSD-3-Clause",
-            "dependencies": {
-                "psl": "^1.1.24",
-                "punycode": "^1.4.1"
-            },
-            "engines": {
-                "node": ">=0.8"
-            }
-        },
-        "node_modules/npm/node_modules/tunnel-agent": {
-            "version": "0.6.0",
-            "inBundle": true,
-            "license": "Apache-2.0",
-            "dependencies": {
-                "safe-buffer": "^5.0.1"
-            },
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/npm/node_modules/tweetnacl": {
-            "version": "0.14.5",
-            "inBundle": true,
-            "license": "Unlicense",
-            "optional": true
-        },
-        "node_modules/npm/node_modules/typedarray": {
-            "version": "0.0.6",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/uid-number": {
-            "version": "0.0.6",
-            "inBundle": true,
-            "license": "ISC",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/npm/node_modules/umask": {
-            "version": "1.1.0",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/unique-filename": {
-            "version": "1.1.1",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "unique-slug": "^2.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/unique-slug": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "imurmurhash": "^0.1.4"
-            }
-        },
-        "node_modules/npm/node_modules/unique-string": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "crypto-random-string": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/unpipe": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/npm/node_modules/unzip-response": {
-            "version": "2.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/update-notifier": {
-            "version": "2.5.0",
-            "inBundle": true,
-            "license": "BSD-2-Clause",
-            "dependencies": {
-                "boxen": "^1.2.1",
-                "chalk": "^2.0.1",
-                "configstore": "^3.0.0",
-                "import-lazy": "^2.1.0",
-                "is-ci": "^1.0.10",
-                "is-installed-globally": "^0.1.0",
-                "is-npm": "^1.0.0",
-                "latest-version": "^3.0.0",
-                "semver-diff": "^2.0.0",
-                "xdg-basedir": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/url-parse-lax": {
-            "version": "1.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "prepend-http": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/util-deprecate": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/util-extend": {
-            "version": "1.0.3",
-            "inBundle": true,
-            "license": "MIT"
-        },
-        "node_modules/npm/node_modules/util-promisify": {
-            "version": "2.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "object.getownpropertydescriptors": "^2.0.3"
-            }
-        },
-        "node_modules/npm/node_modules/uuid": {
-            "version": "3.3.3",
-            "inBundle": true,
-            "license": "MIT",
-            "bin": {
-                "uuid": "bin/uuid"
-            }
-        },
-        "node_modules/npm/node_modules/validate-npm-package-license": {
-            "version": "3.0.4",
-            "inBundle": true,
-            "license": "Apache-2.0",
-            "dependencies": {
-                "spdx-correct": "^3.0.0",
-                "spdx-expression-parse": "^3.0.0"
-            }
-        },
-        "node_modules/npm/node_modules/validate-npm-package-name": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "builtins": "^1.0.3"
-            }
-        },
-        "node_modules/npm/node_modules/verror": {
-            "version": "1.10.0",
-            "engines": [
-                "node >=0.6.0"
-            ],
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "assert-plus": "^1.0.0",
-                "core-util-is": "1.0.2",
-                "extsprintf": "^1.2.0"
-            }
-        },
-        "node_modules/npm/node_modules/wcwidth": {
-            "version": "1.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "defaults": "^1.0.3"
-            }
-        },
-        "node_modules/npm/node_modules/which": {
-            "version": "1.3.1",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "isexe": "^2.0.0"
-            },
-            "bin": {
-                "which": "bin/which"
-            }
-        },
-        "node_modules/npm/node_modules/which-module": {
-            "version": "2.0.0",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/wide-align": {
-            "version": "1.1.2",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "string-width": "^1.0.2"
-            }
-        },
-        "node_modules/npm/node_modules/wide-align/node_modules/string-width": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "code-point-at": "^1.0.0",
-                "is-fullwidth-code-point": "^1.0.0",
-                "strip-ansi": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/widest-line": {
-            "version": "2.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "string-width": "^2.1.1"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/worker-farm": {
-            "version": "1.7.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "errno": "~0.1.7"
-            }
-        },
-        "node_modules/npm/node_modules/wrap-ansi": {
-            "version": "2.1.0",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "string-width": "^1.0.1",
-                "strip-ansi": "^3.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/wrap-ansi/node_modules/string-width": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "code-point-at": "^1.0.0",
-                "is-fullwidth-code-point": "^1.0.0",
-                "strip-ansi": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/npm/node_modules/wrappy": {
-            "version": "1.0.2",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/write-file-atomic": {
-            "version": "2.4.3",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "graceful-fs": "^4.1.11",
-                "imurmurhash": "^0.1.4",
-                "signal-exit": "^3.0.2"
-            }
-        },
-        "node_modules/npm/node_modules/xdg-basedir": {
-            "version": "3.0.0",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/npm/node_modules/xtend": {
-            "version": "4.0.1",
-            "inBundle": true,
-            "license": "MIT",
-            "engines": {
-                "node": ">=0.4"
-            }
-        },
-        "node_modules/npm/node_modules/y18n": {
-            "version": "4.0.0",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/yallist": {
-            "version": "3.0.3",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npm/node_modules/yargs": {
-            "version": "11.1.1",
-            "inBundle": true,
-            "license": "MIT",
-            "dependencies": {
-                "cliui": "^4.0.0",
-                "decamelize": "^1.1.1",
-                "find-up": "^2.1.0",
-                "get-caller-file": "^1.0.1",
-                "os-locale": "^3.1.0",
-                "require-directory": "^2.1.1",
-                "require-main-filename": "^1.0.1",
-                "set-blocking": "^2.0.0",
-                "string-width": "^2.0.0",
-                "which-module": "^2.0.0",
-                "y18n": "^3.2.1",
-                "yargs-parser": "^9.0.2"
-            }
-        },
-        "node_modules/npm/node_modules/yargs-parser": {
-            "version": "9.0.2",
-            "inBundle": true,
-            "license": "ISC",
-            "dependencies": {
-                "camelcase": "^4.1.0"
-            }
-        },
-        "node_modules/npm/node_modules/yargs/node_modules/y18n": {
-            "version": "3.2.1",
-            "inBundle": true,
-            "license": "ISC"
-        },
-        "node_modules/npmlog": {
-            "version": "4.1.2",
-            "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz",
-            "integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg==",
-            "dependencies": {
-                "are-we-there-yet": "~1.1.2",
-                "console-control-strings": "~1.1.0",
-                "gauge": "~2.7.3",
-                "set-blocking": "~2.0.0"
-            }
-        },
-        "node_modules/nth-check": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.2.tgz",
-            "integrity": "sha512-WeBOdju8SnzPN5vTUJYxYUxLeXpCaVP5i5e0LF8fg7WORF2Wd7wFX/pk0tYZk7s8T+J7VLy0Da6J1+wCT0AtHg==",
-            "dependencies": {
-                "boolbase": "~1.0.0"
-            }
-        },
-        "node_modules/number-is-nan": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
-            "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/nwsapi": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.0.tgz",
-            "integrity": "sha512-h2AatdwYH+JHiZpv7pt/gSX1XoRGb7L/qSIeuqA6GwYoF9w1vP1cw42TO0aI2pNyshRK5893hNSl+1//vHK7hQ==",
-            "dev": true
-        },
-        "node_modules/oauth": {
-            "version": "0.9.15",
-            "resolved": "https://registry.npmjs.org/oauth/-/oauth-0.9.15.tgz",
-            "integrity": "sha1-vR/vr2hslrdUda7VGWQS/2DPucE="
-        },
-        "node_modules/oauth-sign": {
-            "version": "0.9.0",
-            "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.9.0.tgz",
-            "integrity": "sha512-fexhUFFPTGV8ybAtSIGbV6gOkSv8UtRbDBnAyLQw4QPKkgNlsH2ByPGtMUqdWkos6YCRmAqViwgZrJc/mRDzZQ==",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/object-assign": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-            "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/object-component": {
-            "version": "0.0.3",
-            "resolved": "https://registry.npmjs.org/object-component/-/object-component-0.0.3.tgz",
-            "integrity": "sha1-8MaapQ78lbhmwYb0AKM3acsvEpE="
-        },
-        "node_modules/object-copy": {
-            "version": "0.1.0",
-            "resolved": "https://registry.npmjs.org/object-copy/-/object-copy-0.1.0.tgz",
-            "integrity": "sha1-fn2Fi3gb18mRpBupde04EnVOmYw=",
-            "dependencies": {
-                "copy-descriptor": "^0.1.0",
-                "define-property": "^0.2.5",
-                "kind-of": "^3.0.3"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/object-copy/node_modules/define-property": {
-            "version": "0.2.5",
-            "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-            "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
-            "dependencies": {
-                "is-descriptor": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/object-copy/node_modules/is-buffer": {
-            "version": "1.1.6",
-            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
-            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
-        },
-        "node_modules/object-copy/node_modules/kind-of": {
-            "version": "3.2.2",
-            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-            "dependencies": {
-                "is-buffer": "^1.1.5"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/object-inspect": {
-            "version": "1.7.0",
-            "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.7.0.tgz",
-            "integrity": "sha512-a7pEHdh1xKIAgTySUGgLMx/xwDZskN1Ud6egYYN3EdRW4ZMPNEDUTF+hwy2LUC+Bl+SyLXANnwz/jyh/qutKUw=="
-        },
-        "node_modules/object-is": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.2.tgz",
-            "integrity": "sha512-5lHCz+0uufF6wZ7CRFWJN3hp8Jqblpgve06U5CMQ3f//6iDjPr2PEo9MWCjEssDsa+UZEL4PkFpr+BMop6aKzQ==",
-            "dependencies": {
-                "define-properties": "^1.1.3",
-                "es-abstract": "^1.17.5"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/object-keys": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
-            "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==",
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/object-to-arguments": {
-            "version": "0.0.8",
-            "resolved": "https://registry.npmjs.org/object-to-arguments/-/object-to-arguments-0.0.8.tgz",
-            "integrity": "sha512-BfWfuAwuhdH1bhMG5EG90WE/eckkBhBvnke8eSEkCDXoLE9Jk5JwYGTbCx1ehGwV48HvBkn62VukPBdlMUOY9w==",
-            "dependencies": {
-                "inspect-parameters-declaration": "0.0.10",
-                "magicli": "0.0.5",
-                "split-skip": "0.0.2",
-                "stringify-parameters": "0.0.4",
-                "unpack-string": "0.0.2"
-            },
-            "bin": {
-                "object-to-arguments": "bin/cli.js"
-            }
-        },
-        "node_modules/object-to-arguments/node_modules/inspect-parameters-declaration": {
-            "version": "0.0.10",
-            "resolved": "https://registry.npmjs.org/inspect-parameters-declaration/-/inspect-parameters-declaration-0.0.10.tgz",
-            "integrity": "sha512-L8/Bvt9iDXQTZ63xY5/MAyvzz+FagR/qGh1kIXvUpsno3AAE0Z95d6QO51zrcMGaEGpwh/57idfMxTxbvRmytg==",
-            "dependencies": {
-                "magicli": "0.0.5",
-                "split-skip": "0.0.2",
-                "stringify-parameters": "0.0.4",
-                "unpack-string": "0.0.2"
-            },
-            "bin": {
-                "inspect-parameters-declaration": "bin/cli.js"
-            }
-        },
-        "node_modules/object-to-arguments/node_modules/magicli": {
-            "version": "0.0.5",
-            "resolved": "https://registry.npmjs.org/magicli/-/magicli-0.0.5.tgz",
-            "integrity": "sha1-zufQ+7THBRiqyxHsPrfiX/SaSSE=",
-            "dependencies": {
-                "commander": "^2.9.0",
-                "get-stdin": "^5.0.1",
-                "inspect-function": "^0.2.1",
-                "pipe-functions": "^1.2.0"
-            }
-        },
-        "node_modules/object-visit": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/object-visit/-/object-visit-1.0.1.tgz",
-            "integrity": "sha1-95xEk68MU3e1n+OdOV5BBC3QRbs=",
-            "dependencies": {
-                "isobject": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/object.assign": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.0.tgz",
-            "integrity": "sha512-exHJeq6kBKj58mqGyTQ9DFvrZC/eR6OwxzoM9YRoGBqrXYonaFyGiFMuc9VZrXf7DarreEwMpurG3dd+CNyW5w==",
-            "dependencies": {
-                "define-properties": "^1.1.2",
-                "function-bind": "^1.1.1",
-                "has-symbols": "^1.0.0",
-                "object-keys": "^1.0.11"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/object.getownpropertydescriptors": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/object.getownpropertydescriptors/-/object.getownpropertydescriptors-2.1.0.tgz",
-            "integrity": "sha512-Z53Oah9A3TdLoblT7VKJaTDdXdT+lQO+cNpKVnya5JDe9uLvzu1YyY1yFDFrcxrlRgWrEFH0jJtD/IbuwjcEVg==",
-            "dependencies": {
-                "define-properties": "^1.1.3",
-                "es-abstract": "^1.17.0-next.1"
-            },
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/object.pick": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.3.0.tgz",
-            "integrity": "sha1-h6EKxMFpS9Lhy/U1kaZhQftd10c=",
-            "dependencies": {
-                "isobject": "^3.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/obuf": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.2.tgz",
-            "integrity": "sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg==",
-            "dev": true
-        },
-        "node_modules/on-finished": {
-            "version": "2.3.0",
-            "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
-            "integrity": "sha1-IPEzZIGwg811M3mSoWlxqi2QaUc=",
-            "dependencies": {
-                "ee-first": "1.1.1"
-            },
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/on-headers": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.0.2.tgz",
-            "integrity": "sha512-pZAE+FJLoyITytdqK0U5s+FIpjN0JP3OzFi/u8Rx+EV5/W+JTWGXG8xFzevE7AjBfDqHv/8vL8qQsIhHnqRkrA==",
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/once": {
-            "version": "1.4.0",
-            "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
-            "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
-            "dependencies": {
-                "wrappy": "1"
-            }
-        },
-        "node_modules/opentype.js": {
-            "version": "1.3.3",
-            "resolved": "https://registry.npmjs.org/opentype.js/-/opentype.js-1.3.3.tgz",
-            "integrity": "sha512-/qIY/+WnKGlPIIPhbeNjynfD2PO15G9lA/xqlX2bDH+4lc3Xz5GCQ68mqxj3DdUv6AJqCeaPvuAoH8mVL0zcuA==",
-            "dependencies": {
-                "string.prototype.codepointat": "^0.2.1",
-                "tiny-inflate": "^1.0.3"
-            },
-            "bin": {
-                "ot": "bin/ot"
-            },
-            "engines": {
-                "node": ">= 8.0.0"
-            }
-        },
-        "node_modules/opn": {
-            "version": "5.5.0",
-            "resolved": "https://registry.npmjs.org/opn/-/opn-5.5.0.tgz",
-            "integrity": "sha512-PqHpggC9bLV0VeWcdKhkpxY+3JTzetLSqTCWL/z/tFIbI6G8JCjondXklT1JinczLz2Xib62sSp0T/gKT4KksA==",
-            "dev": true,
-            "dependencies": {
-                "is-wsl": "^1.1.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/optionator": {
-            "version": "0.8.3",
-            "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.3.tgz",
-            "integrity": "sha512-+IW9pACdk3XWmmTXG8m3upGUJst5XRGzxMRjXzAuJ1XnIFNvfhjjIuYkDvysnPQ7qzqVzLt78BCruntqRhWQbA==",
-            "dev": true,
-            "dependencies": {
-                "deep-is": "~0.1.3",
-                "fast-levenshtein": "~2.0.6",
-                "levn": "~0.3.0",
-                "prelude-ls": "~1.1.2",
-                "type-check": "~0.3.2",
-                "word-wrap": "~1.2.3"
-            },
-            "engines": {
-                "node": ">= 0.8.0"
-            }
-        },
-        "node_modules/orderedmap": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/orderedmap/-/orderedmap-1.1.1.tgz",
-            "integrity": "sha512-3Ux8um0zXbVacKUkcytc0u3HgC0b0bBLT+I60r2J/En72cI0nZffqrA7Xtf2Hqs27j1g82llR5Mhbd0Z1XW4AQ=="
-        },
-        "node_modules/original": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/original/-/original-1.0.2.tgz",
-            "integrity": "sha512-hyBVl6iqqUOJ8FqRe+l/gS8H+kKYjrEndd5Pm1MfBtsEKA038HkkdbAl/72EAXGyonD/PFsvmVG+EvcIpliMBg==",
-            "dev": true,
-            "dependencies": {
-                "url-parse": "^1.4.3"
-            }
-        },
-        "node_modules/os-browserify": {
-            "version": "0.3.0",
-            "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.3.0.tgz",
-            "integrity": "sha1-hUNzx/XCMVkU/Jv8a9gjj92h7Cc=",
-            "dev": true
-        },
-        "node_modules/os-homedir": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
-            "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/os-tmpdir": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
-            "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/osenv": {
-            "version": "0.1.5",
-            "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.5.tgz",
-            "integrity": "sha512-0CWcCECdMVc2Rw3U5w9ZjqX6ga6ubk1xDVKxtBQPK7wis/0F2r9T6k4ydGYhecl7YUBxBVxhL5oisPsNxAPe2g==",
-            "dependencies": {
-                "os-homedir": "^1.0.0",
-                "os-tmpdir": "^1.0.0"
-            }
-        },
-        "node_modules/p-debounce": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/p-debounce/-/p-debounce-1.0.0.tgz",
-            "integrity": "sha1-y38svu/YegnrqGHhErZ1J+Yh4v0=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/p-finally": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz",
-            "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/p-limit": {
-            "version": "2.3.0",
-            "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
-            "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
-            "dependencies": {
-                "p-try": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/p-locate": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-3.0.0.tgz",
-            "integrity": "sha512-x+12w/To+4GFfgJhBEpiDcLozRJGegY+Ei7/z0tSLkMmxGZNybVMSfWj9aJn8Z5Fc7dBUNJOOVgPv2H7IwulSQ==",
-            "dependencies": {
-                "p-limit": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/p-map": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/p-map/-/p-map-2.1.0.tgz",
-            "integrity": "sha512-y3b8Kpd8OAN444hxfBbFfj1FY/RjtTd8tzYwhUqNYXx0fXx2iX4maP4Qr6qhIKbQXI02wTLAda4fYUbDagTUFw==",
-            "dev": true,
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/p-retry": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/p-retry/-/p-retry-3.0.1.tgz",
-            "integrity": "sha512-XE6G4+YTTkT2a0UWb2kjZe8xNwf8bIbnqpc/IS/idOBVhyves0mK5OJgeocjx7q5pvX/6m23xuzVPYT1uGM73w==",
-            "dev": true,
-            "dependencies": {
-                "retry": "^0.12.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/p-try": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
-            "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/package-json": {
-            "version": "4.0.1",
-            "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz",
-            "integrity": "sha1-iGmgQBJTZhxMTKPabCEh7VVfXu0=",
-            "dependencies": {
-                "got": "^6.7.1",
-                "registry-auth-token": "^3.0.1",
-                "registry-url": "^3.0.3",
-                "semver": "^5.1.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/pako": {
-            "version": "1.0.11",
-            "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.11.tgz",
-            "integrity": "sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw=="
-        },
-        "node_modules/parallel-transform": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/parallel-transform/-/parallel-transform-1.2.0.tgz",
-            "integrity": "sha512-P2vSmIu38uIlvdcU7fDkyrxj33gTUy/ABO5ZUbGowxNCopBq/OoD42bP4UmMrJoPyk4Uqf0mu3mtWBhHCZD8yg==",
-            "dev": true,
-            "dependencies": {
-                "cyclist": "^1.0.1",
-                "inherits": "^2.0.3",
-                "readable-stream": "^2.1.5"
-            }
-        },
-        "node_modules/parallel-transform/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/parent-module": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
-            "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==",
-            "dependencies": {
-                "callsites": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/parse-asn1": {
-            "version": "5.1.6",
-            "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.6.tgz",
-            "integrity": "sha512-RnZRo1EPU6JBnra2vGHj0yhp6ebyjBZpmUCLHWiFhxlzvBCCpAuZ7elsBp1PVAbQN0/04VD/19rfzlBSwLstMw==",
-            "dev": true,
-            "dependencies": {
-                "asn1.js": "^5.2.0",
-                "browserify-aes": "^1.0.0",
-                "evp_bytestokey": "^1.0.0",
-                "pbkdf2": "^3.0.3",
-                "safe-buffer": "^5.1.1"
-            }
-        },
-        "node_modules/parse-json": {
-            "version": "5.0.0",
-            "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.0.0.tgz",
-            "integrity": "sha512-OOY5b7PAEFV0E2Fir1KOkxchnZNCdowAJgQ5NuxjpBKTRP3pQhwkrkxqQjeoKJ+fO7bCpmIZaogI4eZGDMEGOw==",
-            "dependencies": {
-                "@babel/code-frame": "^7.0.0",
-                "error-ex": "^1.3.1",
-                "json-parse-better-errors": "^1.0.1",
-                "lines-and-columns": "^1.1.6"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/parse-passwd": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
-            "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/parse5": {
-            "version": "3.0.3",
-            "resolved": "https://registry.npmjs.org/parse5/-/parse5-3.0.3.tgz",
-            "integrity": "sha512-rgO9Zg5LLLkfJF9E6CCmXlSE4UVceloys8JrFqCcHloC3usd/kJCyPDwH2SOlzix2j3xaP9sUX3e8+kvkuleAA==",
-            "dependencies": {
-                "@types/node": "*"
-            }
-        },
-        "node_modules/parseqs": {
-            "version": "0.0.5",
-            "resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.5.tgz",
-            "integrity": "sha1-1SCKNzjkZ2bikbouoXNoSSGouJ0=",
-            "dependencies": {
-                "better-assert": "~1.0.0"
-            }
-        },
-        "node_modules/parseuri": {
-            "version": "0.0.5",
-            "resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.5.tgz",
-            "integrity": "sha1-gCBKUNTbt3m/3G6+J3jZDkvOMgo=",
-            "dependencies": {
-                "better-assert": "~1.0.0"
-            }
-        },
-        "node_modules/parseurl": {
-            "version": "1.3.3",
-            "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
-            "integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==",
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/pascalcase": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/pascalcase/-/pascalcase-0.1.1.tgz",
-            "integrity": "sha1-s2PlXoAGym/iF4TS2yK9FdeRfxQ=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/passport": {
-            "version": "0.4.1",
-            "resolved": "https://registry.npmjs.org/passport/-/passport-0.4.1.tgz",
-            "integrity": "sha512-IxXgZZs8d7uFSt3eqNjM9NQ3g3uQCW5avD8mRNoXV99Yig50vjuaez6dQK2qC0kVWPRTujxY0dWgGfT09adjYg==",
-            "dependencies": {
-                "passport-strategy": "1.x.x",
-                "pause": "0.0.1"
-            },
-            "engines": {
-                "node": ">= 0.4.0"
-            }
-        },
-        "node_modules/passport-google-oauth20": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/passport-google-oauth20/-/passport-google-oauth20-2.0.0.tgz",
-            "integrity": "sha512-KSk6IJ15RoxuGq7D1UKK/8qKhNfzbLeLrG3gkLZ7p4A6DBCcv7xpyQwuXtWdpyR0+E0mwkpjY1VfPOhxQrKzdQ==",
-            "dependencies": {
-                "passport-oauth2": "1.x.x"
-            },
-            "engines": {
-                "node": ">= 0.4.0"
-            }
-        },
-        "node_modules/passport-local": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/passport-local/-/passport-local-1.0.0.tgz",
-            "integrity": "sha1-H+YyaMkudWBmJkN+O5BmYsFbpu4=",
-            "dependencies": {
-                "passport-strategy": "1.x.x"
-            },
-            "engines": {
-                "node": ">= 0.4.0"
-            }
-        },
-        "node_modules/passport-oauth2": {
-            "version": "1.5.0",
-            "resolved": "https://registry.npmjs.org/passport-oauth2/-/passport-oauth2-1.5.0.tgz",
-            "integrity": "sha512-kqBt6vR/5VlCK8iCx1/KpY42kQ+NEHZwsSyt4Y6STiNjU+wWICG1i8ucc1FapXDGO15C5O5VZz7+7vRzrDPXXQ==",
-            "dependencies": {
-                "base64url": "3.x.x",
-                "oauth": "0.9.x",
-                "passport-strategy": "1.x.x",
-                "uid2": "0.0.x",
-                "utils-merge": "1.x.x"
-            },
-            "engines": {
-                "node": ">= 0.4.0"
-            }
-        },
-        "node_modules/passport-strategy": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/passport-strategy/-/passport-strategy-1.0.0.tgz",
-            "integrity": "sha1-tVOaqPwiWj0a0XlHbd8ja0QPUuQ=",
-            "engines": {
-                "node": ">= 0.4.0"
-            }
-        },
-        "node_modules/path-browserify": {
-            "version": "0.0.1",
-            "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.1.tgz",
-            "integrity": "sha512-BapA40NHICOS+USX9SN4tyhq+A2RrN/Ws5F0Z5aMHDp98Fl86lX8Oti8B7uN93L4Ifv4fHOEA+pQw87gmMO/lQ==",
-            "dev": true
-        },
-        "node_modules/path-dirname": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz",
-            "integrity": "sha1-zDPSTVJeCZpTiMAzbG4yuRYGCeA="
-        },
-        "node_modules/path-exists": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
-            "integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/path-is-absolute": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
-            "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/path-is-inside": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz",
-            "integrity": "sha1-NlQX3t5EQw0cEa9hAn+s8HS9/FM="
-        },
-        "node_modules/path-key": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/path-key/-/path-key-2.0.1.tgz",
-            "integrity": "sha1-QRyttXTFoUDTpLGRDUDYDMn0C0A=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/path-parse": {
-            "version": "1.0.6",
-            "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.6.tgz",
-            "integrity": "sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw=="
-        },
-        "node_modules/path-to-regexp": {
-            "version": "0.1.7",
-            "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
-            "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
-        },
-        "node_modules/path-type": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
-            "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/pathval": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/pathval/-/pathval-1.1.0.tgz",
-            "integrity": "sha1-uULm1L3mUwBe9rcTYd74cn0GReA=",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/pause": {
-            "version": "0.0.1",
-            "resolved": "https://registry.npmjs.org/pause/-/pause-0.0.1.tgz",
-            "integrity": "sha1-HUCLP9t2kjuVQ9lvtMnf1TXZy10="
-        },
-        "node_modules/pbkdf2": {
-            "version": "3.1.2",
-            "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.1.2.tgz",
-            "integrity": "sha512-iuh7L6jA7JEGu2WxDwtQP1ddOpaJNC4KlDEFfdQajSGgGPNi4OyDc2R7QnbY2bR9QjBVGwgvTdNJZoE7RaxUMA==",
-            "dev": true,
-            "dependencies": {
-                "create-hash": "^1.1.2",
-                "create-hmac": "^1.1.4",
-                "ripemd160": "^2.0.1",
-                "safe-buffer": "^5.0.1",
-                "sha.js": "^2.4.8"
-            },
-            "engines": {
-                "node": ">=0.12"
-            }
-        },
-        "node_modules/pdf-parse": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/pdf-parse/-/pdf-parse-1.1.1.tgz",
-            "integrity": "sha512-v6ZJ/efsBpGrGGknjtq9J/oC8tZWq0KWL5vQrk2GlzLEQPUDB1ex+13Rmidl1neNN358Jn9EHZw5y07FFtaC7A==",
-            "dependencies": {
-                "debug": "^3.1.0",
-                "node-ensure": "^0.0.0"
-            },
-            "engines": {
-                "node": ">=6.8.1"
-            }
-        },
-        "node_modules/pdfjs": {
-            "version": "2.3.9",
-            "resolved": "https://registry.npmjs.org/pdfjs/-/pdfjs-2.3.9.tgz",
-            "integrity": "sha512-SK4xI0UbtNo9Ub1BMVgxphdL0Cy1iN9p2SxWG98JLnVe569WF8IO60K03UxlnmSV2s5P0MV1DEuZOlUslRlinA==",
-            "dependencies": {
-                "@rkusa/linebreak": "^1.0.0",
-                "opentype.js": "^1.3.3",
-                "pako": "^1.0.11",
-                "readable-stream": "^3.6.0",
-                "unorm": "^1.6.0",
-                "uuid": "^7.0.3"
-            },
-            "engines": {
-                "node": ">=7"
-            }
-        },
-        "node_modules/pdfjs-dist": {
-            "version": "2.4.456",
-            "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-2.4.456.tgz",
-            "integrity": "sha512-yckJEHq3F48hcp6wStEpbN9McOj328Ib09UrBlGAKxvN2k+qYPN5iq6TH6jD1C0pso7zTep+g/CKsYgdrQd5QA=="
-        },
-        "node_modules/pdfjs/node_modules/uuid": {
-            "version": "7.0.3",
-            "resolved": "https://registry.npmjs.org/uuid/-/uuid-7.0.3.tgz",
-            "integrity": "sha512-DPSke0pXhTZgoF/d+WSt2QaKMCFSfx7QegxEWT+JOuHF5aWrKEn0G+ztjuJg/gG8/ItK+rbPCD/yNv8yyih6Cg==",
-            "bin": {
-                "uuid": "dist/bin/uuid"
-            }
-        },
-        "node_modules/pend": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz",
-            "integrity": "sha1-elfrVQpng/kRUzH89GY9XI4AelA="
-        },
-        "node_modules/performance-now": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
-            "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns="
-        },
-        "node_modules/picomatch": {
-            "version": "2.2.2",
-            "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.2.2.tgz",
-            "integrity": "sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==",
-            "dev": true,
-            "engines": {
-                "node": ">=8.6"
-            }
-        },
-        "node_modules/pify": {
-            "version": "4.0.1",
-            "resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz",
-            "integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==",
-            "dev": true,
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/pinkie": {
-            "version": "2.0.4",
-            "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz",
-            "integrity": "sha1-clVrgM+g1IqXToDnckjoDtT3+HA=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/pinkie-promise": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
-            "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o=",
-            "dependencies": {
-                "pinkie": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/pipe-functions": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/pipe-functions/-/pipe-functions-1.3.0.tgz",
-            "integrity": "sha512-6Rtbp7criZRwedlvWbUYxqlqJoAlMvYHo2UcRWq79xZ54vZcaNHpVBOcWkX3ErT2aUA69tv+uiv4zKJbhD/Wgg=="
-        },
-        "node_modules/pkg-dir": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-2.0.0.tgz",
-            "integrity": "sha1-9tXREJ4Z1j7fQo4L1X4Sd3YVM0s=",
-            "dev": true,
-            "dependencies": {
-                "find-up": "^2.1.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/pkg-dir/node_modules/find-up": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
-            "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c=",
-            "dev": true,
-            "dependencies": {
-                "locate-path": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/pkg-dir/node_modules/locate-path": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",
-            "integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4=",
-            "dev": true,
-            "dependencies": {
-                "p-locate": "^2.0.0",
-                "path-exists": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/pkg-dir/node_modules/p-limit": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.3.0.tgz",
-            "integrity": "sha512-vvcXsLAJ9Dr5rQOPk7toZQZJApBl2K4J6dANSsEuh6QI41JYcsS/qhTGa9ErIUUgK3WNQoJYvylxvjqmiqEA9Q==",
-            "dev": true,
-            "dependencies": {
-                "p-try": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/pkg-dir/node_modules/p-locate": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-2.0.0.tgz",
-            "integrity": "sha1-IKAQOyIqcMj9OcwuWAaA893l7EM=",
-            "dev": true,
-            "dependencies": {
-                "p-limit": "^1.1.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/pkg-dir/node_modules/p-try": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/p-try/-/p-try-1.0.0.tgz",
-            "integrity": "sha1-y8ec26+P1CKOE/Yh8rGiN8GyB7M=",
-            "dev": true,
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/please-upgrade-node": {
-            "version": "3.2.0",
-            "resolved": "https://registry.npmjs.org/please-upgrade-node/-/please-upgrade-node-3.2.0.tgz",
-            "integrity": "sha512-gQR3WpIgNIKwBMVLkpMUeR3e1/E1y42bqDQZfql+kDeXd8COYfM8PQA4X6y7a8u9Ua9FHmsrrmirW2vHs45hWg==",
-            "dependencies": {
-                "semver-compare": "^1.0.0"
-            }
-        },
-        "node_modules/plist": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/plist/-/plist-1.2.0.tgz",
-            "integrity": "sha1-CEtQk93JJQbiWfh0uNmxr7jHlZM=",
-            "dependencies": {
-                "base64-js": "0.0.8",
-                "util-deprecate": "1.0.2",
-                "xmlbuilder": "4.0.0",
-                "xmldom": "0.1.x"
-            }
-        },
-        "node_modules/plist/node_modules/base64-js": {
-            "version": "0.0.8",
-            "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-0.0.8.tgz",
-            "integrity": "sha1-EQHpVE9KdrG8OybUUsqW16NeeXg=",
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/pn": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/pn/-/pn-1.1.0.tgz",
-            "integrity": "sha512-2qHaIQr2VLRFoxe2nASzsV6ef4yOOH+Fi9FBOVH6cqeSgUnoyySPZkxzLuzd+RYOQTRpROA0ztTMqxROKSb/nA==",
-            "dev": true
-        },
-        "node_modules/popper.js": {
-            "version": "1.16.1",
-            "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
-            "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ=="
-        },
-        "node_modules/portfinder": {
-            "version": "1.0.26",
-            "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.26.tgz",
-            "integrity": "sha512-Xi7mKxJHHMI3rIUrnm/jjUgwhbYMkp/XKEcZX3aG4BrumLpq3nmoQMX+ClYnDZnZ/New7IatC1no5RX0zo1vXQ==",
-            "dev": true,
-            "dependencies": {
-                "async": "^2.6.2",
-                "debug": "^3.1.1",
-                "mkdirp": "^0.5.1"
-            },
-            "engines": {
-                "node": ">= 0.12.0"
-            }
-        },
-        "node_modules/posix-character-classes": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
-            "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/postcss": {
-            "version": "7.0.27",
-            "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.27.tgz",
-            "integrity": "sha512-WuQETPMcW9Uf1/22HWUWP9lgsIC+KEHg2kozMflKjbeUtw9ujvFX6QmIfozaErDkmLWS9WEnEdEe6Uo9/BNTdQ==",
-            "dev": true,
-            "dependencies": {
-                "chalk": "^2.4.2",
-                "source-map": "^0.6.1",
-                "supports-color": "^6.1.0"
-            },
-            "engines": {
-                "node": ">=6.0.0"
-            }
-        },
-        "node_modules/postcss-modules-extract-imports": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-2.0.0.tgz",
-            "integrity": "sha512-LaYLDNS4SG8Q5WAWqIJgdHPJrDDr/Lv775rMBFUbgjTz6j34lUznACHcdRWroPvXANP2Vj7yNK57vp9eFqzLWQ==",
-            "dev": true,
-            "dependencies": {
-                "postcss": "^7.0.5"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/postcss-modules-local-by-default": {
-            "version": "2.0.6",
-            "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-2.0.6.tgz",
-            "integrity": "sha512-oLUV5YNkeIBa0yQl7EYnxMgy4N6noxmiwZStaEJUSe2xPMcdNc8WmBQuQCx18H5psYbVxz8zoHk0RAAYZXP9gA==",
-            "dev": true,
-            "dependencies": {
-                "postcss": "^7.0.6",
-                "postcss-selector-parser": "^6.0.0",
-                "postcss-value-parser": "^3.3.1"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/postcss-modules-scope": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-2.2.0.tgz",
-            "integrity": "sha512-YyEgsTMRpNd+HmyC7H/mh3y+MeFWevy7V1evVhJWewmMbjDHIbZbOXICC2y+m1xI1UVfIT1HMW/O04Hxyu9oXQ==",
-            "dev": true,
-            "dependencies": {
-                "postcss": "^7.0.6",
-                "postcss-selector-parser": "^6.0.0"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/postcss-modules-values": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-2.0.0.tgz",
-            "integrity": "sha512-Ki7JZa7ff1N3EIMlPnGTZfUMe69FFwiQPnVSXC9mnn3jozCRBYIxiZd44yJOV2AmabOo4qFf8s0dC/+lweG7+w==",
-            "dev": true,
-            "dependencies": {
-                "icss-replace-symbols": "^1.1.0",
-                "postcss": "^7.0.6"
-            }
-        },
-        "node_modules/postcss-selector-parser": {
-            "version": "6.0.2",
-            "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.2.tgz",
-            "integrity": "sha512-36P2QR59jDTOAiIkqEprfJDsoNrvwFei3eCqKd1Y0tUsBimsq39BLp7RD+JWny3WgB1zGhJX8XVePwm9k4wdBg==",
-            "dev": true,
-            "dependencies": {
-                "cssesc": "^3.0.0",
-                "indexes-of": "^1.0.1",
-                "uniq": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/postcss-value-parser": {
-            "version": "3.3.1",
-            "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz",
-            "integrity": "sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ=="
-        },
-        "node_modules/postcss/node_modules/source-map": {
-            "version": "0.6.1",
-            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/postcss/node_modules/supports-color": {
-            "version": "6.1.0",
-            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz",
-            "integrity": "sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==",
-            "dev": true,
-            "dependencies": {
-                "has-flag": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/prebuild-install": {
-            "version": "5.3.3",
-            "resolved": "https://registry.npmjs.org/prebuild-install/-/prebuild-install-5.3.3.tgz",
-            "integrity": "sha512-GV+nsUXuPW2p8Zy7SarF/2W/oiK8bFQgJcncoJ0d7kRpekEA0ftChjfEaF9/Y+QJEc/wFR7RAEa8lYByuUIe2g==",
-            "dependencies": {
-                "detect-libc": "^1.0.3",
-                "expand-template": "^2.0.3",
-                "github-from-package": "0.0.0",
-                "minimist": "^1.2.0",
-                "mkdirp": "^0.5.1",
-                "napi-build-utils": "^1.0.1",
-                "node-abi": "^2.7.0",
-                "noop-logger": "^0.1.1",
-                "npmlog": "^4.0.1",
-                "pump": "^3.0.0",
-                "rc": "^1.2.7",
-                "simple-get": "^3.0.3",
-                "tar-fs": "^2.0.0",
-                "tunnel-agent": "^0.6.0",
-                "which-pm-runs": "^1.0.0"
-            },
-            "bin": {
-                "prebuild-install": "bin.js"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/prelude-ls": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz",
-            "integrity": "sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ=",
-            "dev": true,
-            "engines": {
-                "node": ">= 0.8.0"
-            }
-        },
-        "node_modules/prepend-http": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz",
-            "integrity": "sha1-1PRWKwzjaW5BrFLQ4ALlemNdxtw=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/probe-image-size": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/probe-image-size/-/probe-image-size-4.1.1.tgz",
-            "integrity": "sha512-42LqKZqTLxH/UvAZ2/cKhAsR4G/Y6B7i7fI2qtQu9hRBK4YjS6gqO+QRtwTjvojUx4+/+JuOMzLoFyRecT9qRw==",
-            "dependencies": {
-                "any-promise": "^1.3.0",
-                "deepmerge": "^4.0.0",
-                "inherits": "^2.0.3",
-                "next-tick": "^1.0.0",
-                "request": "^2.83.0",
-                "stream-parser": "~0.3.1"
-            }
-        },
-        "node_modules/probe-image-size/node_modules/deepmerge": {
-            "version": "4.2.2",
-            "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz",
-            "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/process": {
-            "version": "0.11.10",
-            "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
-            "integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI=",
-            "dev": true,
-            "engines": {
-                "node": ">= 0.6.0"
-            }
-        },
-        "node_modules/process-nextick-args": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
-            "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="
-        },
-        "node_modules/progress": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz",
-            "integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==",
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/promise": {
-            "version": "7.3.1",
-            "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
-            "integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==",
-            "dependencies": {
-                "asap": "~2.0.3"
-            }
-        },
-        "node_modules/promise-inflight": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/promise-inflight/-/promise-inflight-1.0.1.tgz",
-            "integrity": "sha1-mEcocL8igTL8vdhoEputEsPAKeM=",
-            "dev": true
-        },
-        "node_modules/prop-types": {
-            "version": "15.7.2",
-            "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz",
-            "integrity": "sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==",
-            "dependencies": {
-                "loose-envify": "^1.4.0",
-                "object-assign": "^4.1.1",
-                "react-is": "^16.8.1"
-            }
-        },
-        "node_modules/prosemirror-commands": {
-            "version": "1.1.4",
-            "resolved": "https://registry.npmjs.org/prosemirror-commands/-/prosemirror-commands-1.1.4.tgz",
-            "integrity": "sha512-kj4Qi+8h3EpJtZuuEDwZ9h2/QNGWDsIX/CzjmClxi9GhxWyBUMVUvIFk0mgdqHyX20lLeGmOpc0TLA5aPzgpWg==",
-            "dependencies": {
-                "prosemirror-model": "^1.0.0",
-                "prosemirror-state": "^1.0.0",
-                "prosemirror-transform": "^1.0.0"
-            }
-        },
-        "node_modules/prosemirror-dev-tools": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/prosemirror-dev-tools/-/prosemirror-dev-tools-3.0.1.tgz",
-            "integrity": "sha512-ZLMqrdIpDstBG6kP6Pt62FB7sAiLKqtW/oWvoBqlHw1p2ovNErR1/5aR1Uxrs6dgb4nPDxbu2uMKf/yI7ok7zQ==",
-            "dependencies": {
-                "@babel/runtime": "^7.0.0",
-                "@emotion/core": "^10.0.28",
-                "@emotion/styled": "^10.0.27",
-                "emotion": "^10.0.27",
-                "html": "^1.0.0",
-                "jsondiffpatch": "^0.4.1",
-                "nanoid": "^3.1.6",
-                "prop-types": "^15.7.2",
-                "prosemirror-model": ">=1.0.0",
-                "prosemirror-state": ">=1.0.0",
-                "react-dock": "^0.2.4",
-                "react-json-tree": "^0.11.2",
-                "unstated": "^2.1.1"
-            },
-            "engines": {
-                "node": ">=10"
-            }
-        },
-        "node_modules/prosemirror-find-replace": {
-            "version": "0.9.0",
-            "resolved": "https://registry.npmjs.org/prosemirror-find-replace/-/prosemirror-find-replace-0.9.0.tgz",
-            "integrity": "sha1-QgsENNF5xdBJD44hSNhVGpVJY4I="
-        },
-        "node_modules/prosemirror-history": {
-            "version": "1.1.3",
-            "resolved": "https://registry.npmjs.org/prosemirror-history/-/prosemirror-history-1.1.3.tgz",
-            "integrity": "sha512-zGDotijea+vnfnyyUGyiy1wfOQhf0B/b6zYcCouBV8yo6JmrE9X23M5q7Nf/nATywEZbgRLG70R4DmfSTC+gfg==",
-            "dependencies": {
-                "prosemirror-state": "^1.2.2",
-                "prosemirror-transform": "^1.0.0",
-                "rope-sequence": "^1.3.0"
-            }
-        },
-        "node_modules/prosemirror-inputrules": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/prosemirror-inputrules/-/prosemirror-inputrules-1.1.2.tgz",
-            "integrity": "sha512-Ja5Z3BWestlHYGvtSGqyvxMeB8QEuBjlHM8YnKtLGUXMDp965qdDV4goV8lJb17kIWHk7e7JNj6Catuoa3302g==",
-            "dependencies": {
-                "prosemirror-state": "^1.0.0",
-                "prosemirror-transform": "^1.0.0"
-            }
-        },
-        "node_modules/prosemirror-keymap": {
-            "version": "1.1.4",
-            "resolved": "https://registry.npmjs.org/prosemirror-keymap/-/prosemirror-keymap-1.1.4.tgz",
-            "integrity": "sha512-Al8cVUOnDFL4gcI5IDlG6xbZ0aOD/i3B17VT+1JbHWDguCgt/lBHVTHUBcKvvbSg6+q/W4Nj1Fu6bwZSca3xjg==",
-            "dependencies": {
-                "prosemirror-state": "^1.0.0",
-                "w3c-keyname": "^2.2.0"
-            }
-        },
-        "node_modules/prosemirror-model": {
-            "version": "1.10.0",
-            "resolved": "https://registry.npmjs.org/prosemirror-model/-/prosemirror-model-1.10.0.tgz",
-            "integrity": "sha512-xTMbbO2q4abs5lJdeRvk/SrftNfZlMdvChKziTiK+OKtP8LkQI8uw39u4S5zqyflrmW3Or6+qnyFPf1p4v2u1g==",
-            "dependencies": {
-                "orderedmap": "^1.1.0"
-            }
-        },
-        "node_modules/prosemirror-schema-list": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/prosemirror-schema-list/-/prosemirror-schema-list-1.1.2.tgz",
-            "integrity": "sha512-dgM9PwtM4twa5WsgSYMB+J8bwjnR43DAD3L9MsR9rKm/nZR5Y85xcjB7gusVMSsbQ2NomMZF03RE6No6mTnclQ==",
-            "dependencies": {
-                "prosemirror-model": "^1.0.0",
-                "prosemirror-transform": "^1.0.0"
-            }
-        },
-        "node_modules/prosemirror-state": {
-            "version": "1.3.3",
-            "resolved": "https://registry.npmjs.org/prosemirror-state/-/prosemirror-state-1.3.3.tgz",
-            "integrity": "sha512-PLXh2VJsIgvlgSTH6I2Yg6vk1CzPDp21DFreVpQtDMY2S6WaMmrQgDTLRcsrD8X38v8Yc873H7+ogdGzyIPn+w==",
-            "dependencies": {
-                "prosemirror-model": "^1.0.0",
-                "prosemirror-transform": "^1.0.0"
-            }
-        },
-        "node_modules/prosemirror-transform": {
-            "version": "1.2.6",
-            "resolved": "https://registry.npmjs.org/prosemirror-transform/-/prosemirror-transform-1.2.6.tgz",
-            "integrity": "sha512-DyV6cRip8//GIHTrqBe2B7I8VjPFQZYuBuB4clpguq1SrS9lLponoBt/0XRWxETkCVsxYSvwE76X0zo6AZhwaw==",
-            "dependencies": {
-                "prosemirror-model": "^1.0.0"
-            }
-        },
-        "node_modules/prosemirror-view": {
-            "version": "1.15.0",
-            "resolved": "https://registry.npmjs.org/prosemirror-view/-/prosemirror-view-1.15.0.tgz",
-            "integrity": "sha512-a7Q76sO/DCZr2UX2Rv1Rbw52cr9kVIz8iJOf/rq4mPN1NA3lugq2BKJgUMwlB3U4utyw3olLigqouRHM48NJyg==",
-            "dependencies": {
-                "prosemirror-model": "^1.1.0",
-                "prosemirror-state": "^1.0.0",
-                "prosemirror-transform": "^1.1.0"
-            }
-        },
-        "node_modules/proxy-addr": {
-            "version": "2.0.6",
-            "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.6.tgz",
-            "integrity": "sha512-dh/frvCBVmSsDYzw6n926jv974gddhkFPfiN8hPOi30Wax25QZyZEGveluCgliBnqmuM+UJmBErbAUFIoDbjOw==",
-            "dependencies": {
-                "forwarded": "~0.1.2",
-                "ipaddr.js": "1.9.1"
-            },
-            "engines": {
-                "node": ">= 0.10"
-            }
-        },
-        "node_modules/proxy-from-env": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
-            "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
-        },
-        "node_modules/prr": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz",
-            "integrity": "sha1-0/wRS6BplaRexok/SEzrHXj19HY=",
-            "dev": true
-        },
-        "node_modules/pseudomap": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/pseudomap/-/pseudomap-1.0.2.tgz",
-            "integrity": "sha1-8FKijacOYYkX7wqKw0wa5aaChrM="
-        },
-        "node_modules/psl": {
-            "version": "1.8.0",
-            "resolved": "https://registry.npmjs.org/psl/-/psl-1.8.0.tgz",
-            "integrity": "sha512-RIdOzyoavK+hA18OGGWDqUTsCLhtA7IcZ/6NCs4fFJaHBDab+pDDmDIByWFRQJq2Cd7r1OoQxBGKOaztq+hjIQ=="
-        },
-        "node_modules/pstree.remy": {
-            "version": "1.1.7",
-            "resolved": "https://registry.npmjs.org/pstree.remy/-/pstree.remy-1.1.7.tgz",
-            "integrity": "sha512-xsMgrUwRpuGskEzBFkH8NmTimbZ5PcPup0LA8JJkHIm2IMUbQcpo3yeLNWVrufEYjh8YwtSVh0xz6UeWc5Oh5A=="
-        },
-        "node_modules/public-encrypt": {
-            "version": "4.0.3",
-            "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.3.tgz",
-            "integrity": "sha512-zVpa8oKZSz5bTMTFClc1fQOnyyEzpl5ozpi1B5YcvBrdohMjH2rfsBtyXcuNuwjsDIXmBYlF2N5FlJYhR29t8Q==",
-            "dev": true,
-            "dependencies": {
-                "bn.js": "^4.1.0",
-                "browserify-rsa": "^4.0.0",
-                "create-hash": "^1.1.0",
-                "parse-asn1": "^5.0.0",
-                "randombytes": "^2.0.1",
-                "safe-buffer": "^5.1.2"
-            }
-        },
-        "node_modules/public-encrypt/node_modules/bn.js": {
-            "version": "4.12.0",
-            "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
-            "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==",
-            "dev": true
-        },
-        "node_modules/pug": {
-            "version": "2.0.4",
-            "resolved": "https://registry.npmjs.org/pug/-/pug-2.0.4.tgz",
-            "integrity": "sha512-XhoaDlvi6NIzL49nu094R2NA6P37ijtgMDuWE+ofekDChvfKnzFal60bhSdiy8y2PBO6fmz3oMEIcfpBVRUdvw==",
-            "dependencies": {
-                "pug-code-gen": "^2.0.2",
-                "pug-filters": "^3.1.1",
-                "pug-lexer": "^4.1.0",
-                "pug-linker": "^3.0.6",
-                "pug-load": "^2.0.12",
-                "pug-parser": "^5.0.1",
-                "pug-runtime": "^2.0.5",
-                "pug-strip-comments": "^1.0.4"
-            }
-        },
-        "node_modules/pug-attrs": {
-            "version": "2.0.4",
-            "resolved": "https://registry.npmjs.org/pug-attrs/-/pug-attrs-2.0.4.tgz",
-            "integrity": "sha512-TaZ4Z2TWUPDJcV3wjU3RtUXMrd3kM4Wzjbe3EWnSsZPsJ3LDI0F3yCnf2/W7PPFF+edUFQ0HgDL1IoxSz5K8EQ==",
-            "dependencies": {
-                "constantinople": "^3.0.1",
-                "js-stringify": "^1.0.1",
-                "pug-runtime": "^2.0.5"
-            }
-        },
-        "node_modules/pug-code-gen": {
-            "version": "2.0.2",
-            "resolved": "https://registry.npmjs.org/pug-code-gen/-/pug-code-gen-2.0.2.tgz",
-            "integrity": "sha512-kROFWv/AHx/9CRgoGJeRSm+4mLWchbgpRzTEn8XCiwwOy6Vh0gAClS8Vh5TEJ9DBjaP8wCjS3J6HKsEsYdvaCw==",
-            "dependencies": {
-                "constantinople": "^3.1.2",
-                "doctypes": "^1.1.0",
-                "js-stringify": "^1.0.1",
-                "pug-attrs": "^2.0.4",
-                "pug-error": "^1.3.3",
-                "pug-runtime": "^2.0.5",
-                "void-elements": "^2.0.1",
-                "with": "^5.0.0"
-            }
-        },
-        "node_modules/pug-error": {
-            "version": "1.3.3",
-            "resolved": "https://registry.npmjs.org/pug-error/-/pug-error-1.3.3.tgz",
-            "integrity": "sha512-qE3YhESP2mRAWMFJgKdtT5D7ckThRScXRwkfo+Erqga7dyJdY3ZquspprMCj/9sJ2ijm5hXFWQE/A3l4poMWiQ=="
-        },
-        "node_modules/pug-filters": {
-            "version": "3.1.1",
-            "resolved": "https://registry.npmjs.org/pug-filters/-/pug-filters-3.1.1.tgz",
-            "integrity": "sha512-lFfjNyGEyVWC4BwX0WyvkoWLapI5xHSM3xZJFUhx4JM4XyyRdO8Aucc6pCygnqV2uSgJFaJWW3Ft1wCWSoQkQg==",
-            "dependencies": {
-                "clean-css": "^4.1.11",
-                "constantinople": "^3.0.1",
-                "jstransformer": "1.0.0",
-                "pug-error": "^1.3.3",
-                "pug-walk": "^1.1.8",
-                "resolve": "^1.1.6",
-                "uglify-js": "^2.6.1"
-            }
-        },
-        "node_modules/pug-lexer": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/pug-lexer/-/pug-lexer-4.1.0.tgz",
-            "integrity": "sha512-i55yzEBtjm0mlplW4LoANq7k3S8gDdfC6+LThGEvsK4FuobcKfDAwt6V4jKPH9RtiE3a2Akfg5UpafZ1OksaPA==",
-            "dependencies": {
-                "character-parser": "^2.1.1",
-                "is-expression": "^3.0.0",
-                "pug-error": "^1.3.3"
-            }
-        },
-        "node_modules/pug-linker": {
-            "version": "3.0.6",
-            "resolved": "https://registry.npmjs.org/pug-linker/-/pug-linker-3.0.6.tgz",
-            "integrity": "sha512-bagfuHttfQOpANGy1Y6NJ+0mNb7dD2MswFG2ZKj22s8g0wVsojpRlqveEQHmgXXcfROB2RT6oqbPYr9EN2ZWzg==",
-            "dependencies": {
-                "pug-error": "^1.3.3",
-                "pug-walk": "^1.1.8"
-            }
-        },
-        "node_modules/pug-load": {
-            "version": "2.0.12",
-            "resolved": "https://registry.npmjs.org/pug-load/-/pug-load-2.0.12.tgz",
-            "integrity": "sha512-UqpgGpyyXRYgJs/X60sE6SIf8UBsmcHYKNaOccyVLEuT6OPBIMo6xMPhoJnqtB3Q3BbO4Z3Bjz5qDsUWh4rXsg==",
-            "dependencies": {
-                "object-assign": "^4.1.0",
-                "pug-walk": "^1.1.8"
-            }
-        },
-        "node_modules/pug-parser": {
-            "version": "5.0.1",
-            "resolved": "https://registry.npmjs.org/pug-parser/-/pug-parser-5.0.1.tgz",
-            "integrity": "sha512-nGHqK+w07p5/PsPIyzkTQfzlYfuqoiGjaoqHv1LjOv2ZLXmGX1O+4Vcvps+P4LhxZ3drYSljjq4b+Naid126wA==",
-            "dependencies": {
-                "pug-error": "^1.3.3",
-                "token-stream": "0.0.1"
-            }
-        },
-        "node_modules/pug-runtime": {
-            "version": "2.0.5",
-            "resolved": "https://registry.npmjs.org/pug-runtime/-/pug-runtime-2.0.5.tgz",
-            "integrity": "sha512-P+rXKn9un4fQY77wtpcuFyvFaBww7/91f3jHa154qU26qFAnOe6SW1CbIDcxiG5lLK9HazYrMCCuDvNgDQNptw=="
-        },
-        "node_modules/pug-strip-comments": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/pug-strip-comments/-/pug-strip-comments-1.0.4.tgz",
-            "integrity": "sha512-i5j/9CS4yFhSxHp5iKPHwigaig/VV9g+FgReLJWWHEHbvKsbqL0oP/K5ubuLco6Wu3Kan5p7u7qk8A4oLLh6vw==",
-            "dependencies": {
-                "pug-error": "^1.3.3"
-            }
-        },
-        "node_modules/pug-walk": {
-            "version": "1.1.8",
-            "resolved": "https://registry.npmjs.org/pug-walk/-/pug-walk-1.1.8.tgz",
-            "integrity": "sha512-GMu3M5nUL3fju4/egXwZO0XLi6fW/K3T3VTgFQ14GxNi8btlxgT5qZL//JwZFm/2Fa64J/PNS8AZeys3wiMkVA=="
-        },
-        "node_modules/pump": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz",
-            "integrity": "sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww==",
-            "dependencies": {
-                "end-of-stream": "^1.1.0",
-                "once": "^1.3.1"
-            }
-        },
-        "node_modules/pumpify": {
-            "version": "1.5.1",
-            "resolved": "https://registry.npmjs.org/pumpify/-/pumpify-1.5.1.tgz",
-            "integrity": "sha512-oClZI37HvuUJJxSKKrC17bZ9Cu0ZYhEAGPsPUy9KlMUmv9dKX2o77RUmq7f3XjIxbwyGwYzbzQ1L2Ks8sIradQ==",
-            "dev": true,
-            "dependencies": {
-                "duplexify": "^3.6.0",
-                "inherits": "^2.0.3",
-                "pump": "^2.0.0"
-            }
-        },
-        "node_modules/pumpify/node_modules/pump": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/pump/-/pump-2.0.1.tgz",
-            "integrity": "sha512-ruPMNRkN3MHP1cWJc9OWr+T/xDP0jhXYCLfJcBuX54hhfIBnaQmAUMfDcG4DM5UMWByBbJY69QSphm3jtDKIkA==",
-            "dev": true,
-            "dependencies": {
-                "end-of-stream": "^1.1.0",
-                "once": "^1.3.1"
-            }
-        },
-        "node_modules/punycode": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.1.1.tgz",
-            "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/puppeteer": {
-            "version": "3.3.0",
-            "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-3.3.0.tgz",
-            "integrity": "sha512-23zNqRltZ1PPoK28uRefWJ/zKb5Jhnzbbwbpcna2o5+QMn17F0khq5s1bdH3vPlyj+J36pubccR8wiNA/VE0Vw==",
-            "hasInstallScript": true,
-            "dependencies": {
-                "debug": "^4.1.0",
-                "extract-zip": "^2.0.0",
-                "https-proxy-agent": "^4.0.0",
-                "mime": "^2.0.3",
-                "progress": "^2.0.1",
-                "proxy-from-env": "^1.0.0",
-                "rimraf": "^3.0.2",
-                "tar-fs": "^2.0.0",
-                "unbzip2-stream": "^1.3.3",
-                "ws": "^7.2.3"
-            },
-            "engines": {
-                "node": ">=10.18.1"
-            }
-        },
-        "node_modules/puppeteer/node_modules/agent-base": {
-            "version": "5.1.1",
-            "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-5.1.1.tgz",
-            "integrity": "sha512-TMeqbNl2fMW0nMjTEPOwe3J/PRFP4vqeoNuQMG0HlMrtm5QxKqdvAkZ1pRBQ/ulIyDD5Yq0nJ7YbdD8ey0TO3g==",
-            "engines": {
-                "node": ">= 6.0.0"
-            }
-        },
-        "node_modules/puppeteer/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/puppeteer/node_modules/https-proxy-agent": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-4.0.0.tgz",
-            "integrity": "sha512-zoDhWrkR3of1l9QAL8/scJZyLu8j/gBkcwcaQOZh7Gyh/+uJQzGVETdgT30akuwkpL8HTRfssqI3BZuV18teDg==",
-            "dependencies": {
-                "agent-base": "5",
-                "debug": "4"
-            },
-            "engines": {
-                "node": ">= 6.0.0"
-            }
-        },
-        "node_modules/puppeteer/node_modules/mime": {
-            "version": "2.4.6",
-            "resolved": "https://registry.npmjs.org/mime/-/mime-2.4.6.tgz",
-            "integrity": "sha512-RZKhC3EmpBchfTGBVb8fb+RL2cWyw/32lshnsETttkBAyAUXSGHxbEJWWRXc751DrIxG1q04b8QwMbAwkRPpUA==",
-            "bin": {
-                "mime": "cli.js"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/pure-color": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/pure-color/-/pure-color-1.3.0.tgz",
-            "integrity": "sha1-H+Bk+wrIUfDeYTIKi/eWg2Qi8z4="
-        },
-        "node_modules/q": {
-            "version": "1.5.1",
-            "resolved": "https://registry.npmjs.org/q/-/q-1.5.1.tgz",
-            "integrity": "sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc=",
-            "engines": {
-                "node": ">=0.6.0",
-                "teleport": ">=0.2.0"
-            }
-        },
-        "node_modules/qs": {
-            "version": "6.5.2",
-            "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.2.tgz",
-            "integrity": "sha512-N5ZAX4/LxJmF+7wN74pUD6qAh9/wnvdQcjq9TZjevvXzSUo7bfmw91saqMjzGS2xq91/odN2dW/WOl7qQHNDGA==",
-            "engines": {
-                "node": ">=0.6"
-            }
-        },
-        "node_modules/query-string": {
-            "version": "6.13.1",
-            "resolved": "https://registry.npmjs.org/query-string/-/query-string-6.13.1.tgz",
-            "integrity": "sha512-RfoButmcK+yCta1+FuU8REvisx1oEzhMKwhLUNcepQTPGcNMp1sIqjnfCtfnvGSQZQEhaBHvccujtWoUV3TTbA==",
-            "dependencies": {
-                "decode-uri-component": "^0.2.0",
-                "split-on-first": "^1.0.0",
-                "strict-uri-encode": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/querystring": {
-            "version": "0.2.0",
-            "resolved": "https://registry.npmjs.org/querystring/-/querystring-0.2.0.tgz",
-            "integrity": "sha1-sgmEkgO7Jd+CDadW50cAWHhSFiA=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.4.x"
-            }
-        },
-        "node_modules/querystring-es3": {
-            "version": "0.2.1",
-            "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz",
-            "integrity": "sha1-nsYfeQSYdXB9aUFFlv2Qek1xHnM=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.4.x"
-            }
-        },
-        "node_modules/querystringify": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.1.1.tgz",
-            "integrity": "sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA==",
-            "dev": true
-        },
-        "node_modules/raf-schd": {
-            "version": "4.0.2",
-            "resolved": "https://registry.npmjs.org/raf-schd/-/raf-schd-4.0.2.tgz",
-            "integrity": "sha512-VhlMZmGy6A6hrkJWHLNTGl5gtgMUm+xfGza6wbwnE914yeQ5Ybm18vgM734RZhMgfw4tacUrWseGZlpUrrakEQ=="
-        },
-        "node_modules/random-bytes": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/random-bytes/-/random-bytes-1.0.0.tgz",
-            "integrity": "sha1-T2ih3Arli9P7lYSMMDJNt11kNgs=",
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/randombytes": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
-            "integrity": "sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==",
-            "dev": true,
-            "dependencies": {
-                "safe-buffer": "^5.1.0"
-            }
-        },
-        "node_modules/randomfill": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/randomfill/-/randomfill-1.0.4.tgz",
-            "integrity": "sha512-87lcbR8+MhcWcUiQ+9e+Rwx8MyR2P7qnt15ynUlbm3TU/fjbgz4GsvfSUDTemtCCtVCqb4ZcEFlyPNTh9bBTLw==",
-            "dev": true,
-            "dependencies": {
-                "randombytes": "^2.0.5",
-                "safe-buffer": "^5.1.0"
-            }
-        },
-        "node_modules/range-parser": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz",
-            "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/raw-body": {
-            "version": "2.4.0",
-            "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.4.0.tgz",
-            "integrity": "sha512-4Oz8DUIwdvoa5qMJelxipzi/iJIi40O5cGV1wNYp5hvZP8ZN0T+jiNkL0QepXs+EsQ9XJ8ipEDoiH70ySUJP3Q==",
-            "dependencies": {
-                "bytes": "3.1.0",
-                "http-errors": "1.7.2",
-                "iconv-lite": "0.4.24",
-                "unpipe": "1.0.0"
-            },
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/raw-loader": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-1.0.0.tgz",
-            "integrity": "sha512-Uqy5AqELpytJTRxYT4fhltcKPj0TyaEpzJDcGz7DFJi+pQOOi3GjR/DOdxTkTsF+NzhnldIoG6TORaBlInUuqA==",
-            "dependencies": {
-                "loader-utils": "^1.1.0",
-                "schema-utils": "^1.0.0"
-            },
-            "engines": {
-                "node": ">= 6.9.0"
-            }
-        },
-        "node_modules/raw-loader/node_modules/schema-utils": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
-            "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
-            "dependencies": {
-                "ajv": "^6.1.0",
-                "ajv-errors": "^1.0.0",
-                "ajv-keywords": "^3.1.0"
-            },
-            "engines": {
-                "node": ">= 4"
-            }
-        },
-        "node_modules/rc": {
-            "version": "1.2.8",
-            "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz",
-            "integrity": "sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==",
-            "dependencies": {
-                "deep-extend": "^0.6.0",
-                "ini": "~1.3.0",
-                "minimist": "^1.2.0",
-                "strip-json-comments": "~2.0.1"
-            },
-            "bin": {
-                "rc": "cli.js"
-            }
-        },
-        "node_modules/rc-switch": {
-            "version": "1.9.0",
-            "resolved": "https://registry.npmjs.org/rc-switch/-/rc-switch-1.9.0.tgz",
-            "integrity": "sha512-Isas+egaK6qSk64jaEw4GgPStY4umYDbT7ZY93bZF1Af+b/JEsKsJdNOU2qG3WI0Z6tXo2DDq0kJCv8Yhu0zww==",
-            "dependencies": {
-                "classnames": "^2.2.1",
-                "prop-types": "^15.5.6",
-                "react-lifecycles-compat": "^3.0.4"
-            }
-        },
-        "node_modules/react": {
-            "version": "16.13.1",
-            "resolved": "https://registry.npmjs.org/react/-/react-16.13.1.tgz",
-            "integrity": "sha512-YMZQQq32xHLX0bz5Mnibv1/LHb3Sqzngu7xstSM+vrkE5Kzr9xE0yMByK5kMoTK30YVJE61WfbxIFFvfeDKT1w==",
-            "dependencies": {
-                "loose-envify": "^1.1.0",
-                "object-assign": "^4.1.1",
-                "prop-types": "^15.6.2"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/react-audio-waveform": {
-            "version": "0.0.5",
-            "resolved": "https://registry.npmjs.org/react-audio-waveform/-/react-audio-waveform-0.0.5.tgz",
-            "integrity": "sha512-4dJwhl+LQRuywzmmjuhWT5GueT3Ai2ZhB+loVxg0sRdhplyDp96xAu10/V/+J25Cl7YqNtl2DWSxvSoI/i6l6w=="
-        },
-        "node_modules/react-autosuggest": {
-            "version": "9.4.3",
-            "resolved": "https://registry.npmjs.org/react-autosuggest/-/react-autosuggest-9.4.3.tgz",
-            "integrity": "sha512-wFbp5QpgFQRfw9cwKvcgLR8theikOUkv8PFsuLYqI2PUgVlx186Cz8MYt5bLxculi+jxGGUUVt+h0esaBZZouw==",
-            "dependencies": {
-                "prop-types": "^15.5.10",
-                "react-autowhatever": "^10.1.2",
-                "shallow-equal": "^1.0.0"
-            }
-        },
-        "node_modules/react-autowhatever": {
-            "version": "10.2.1",
-            "resolved": "https://registry.npmjs.org/react-autowhatever/-/react-autowhatever-10.2.1.tgz",
-            "integrity": "sha512-5gQyoETyBH6GmuW1N1J81CuoAV+Djeg66DEo03xiZOl3WOwJHBP5LisKUvCGOakjrXU4M3hcIvCIqMBYGUmqOA==",
-            "dependencies": {
-                "prop-types": "^15.5.8",
-                "react-themeable": "^1.1.0",
-                "section-iterator": "^2.0.0"
-            }
-        },
-        "node_modules/react-base16-styling": {
-            "version": "0.5.3",
-            "resolved": "https://registry.npmjs.org/react-base16-styling/-/react-base16-styling-0.5.3.tgz",
-            "integrity": "sha1-OFjyTpxN2MvT9wLz901YHKKRcmk=",
-            "dependencies": {
-                "base16": "^1.0.0",
-                "lodash.curry": "^4.0.1",
-                "lodash.flow": "^3.3.0",
-                "pure-color": "^1.2.0"
-            }
-        },
-        "node_modules/react-beautiful-dnd": {
-            "version": "13.0.0",
-            "resolved": "https://registry.npmjs.org/react-beautiful-dnd/-/react-beautiful-dnd-13.0.0.tgz",
-            "integrity": "sha512-87It8sN0ineoC3nBW0SbQuTFXM6bUqM62uJGY4BtTf0yzPl8/3+bHMWkgIe0Z6m8e+gJgjWxefGRVfpE3VcdEg==",
-            "dependencies": {
-                "@babel/runtime": "^7.8.4",
-                "css-box-model": "^1.2.0",
-                "memoize-one": "^5.1.1",
-                "raf-schd": "^4.0.2",
-                "react-redux": "^7.1.1",
-                "redux": "^4.0.4",
-                "use-memo-one": "^1.1.1"
-            }
-        },
-        "node_modules/react-color": {
-            "version": "2.18.1",
-            "resolved": "https://registry.npmjs.org/react-color/-/react-color-2.18.1.tgz",
-            "integrity": "sha512-X5XpyJS6ncplZs74ak0JJoqPi+33Nzpv5RYWWxn17bslih+X7OlgmfpmGC1fNvdkK7/SGWYf1JJdn7D2n5gSuQ==",
-            "dependencies": {
-                "@icons/material": "^0.2.4",
-                "lodash": "^4.17.11",
-                "material-colors": "^1.2.1",
-                "prop-types": "^15.5.10",
-                "reactcss": "^1.2.0",
-                "tinycolor2": "^1.4.1"
-            }
-        },
-        "node_modules/react-compound-slider": {
-            "version": "2.5.0",
-            "resolved": "https://registry.npmjs.org/react-compound-slider/-/react-compound-slider-2.5.0.tgz",
-            "integrity": "sha512-T84FtSI0bkQPmH5GaaHbL+2McOyIR6M5sqS80dqw/bHc5r2UKLYY64BWTbsL+XO0jlx7REuJJnZUBqo4eSRl7g==",
-            "dependencies": {
-                "@babel/runtime": "^7.7.7",
-                "d3-array": "^1.2.4",
-                "prop-types": "^15.7.2",
-                "warning": "^3.0.0"
-            }
-        },
-        "node_modules/react-datepicker": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-3.0.0.tgz",
-            "integrity": "sha512-Yrxan1tERAiWS0EzitpiaiXOIz0APTUtV75uWbaS+jSaKoGCR6wUN2FDwr1ACGlnEoGhR9QQ2Vq3odnWtgJsOA==",
-            "dependencies": {
-                "classnames": "^2.2.6",
-                "date-fns": "^2.0.1",
-                "prop-types": "^15.7.2",
-                "react-onclickoutside": "^6.9.0",
-                "react-popper": "^1.3.4"
-            }
-        },
-        "node_modules/react-dock": {
-            "version": "0.2.4",
-            "resolved": "https://registry.npmjs.org/react-dock/-/react-dock-0.2.4.tgz",
-            "integrity": "sha1-5yfcdVCztzEWY13LnA4E0Lev4Xw=",
-            "dependencies": {
-                "lodash.debounce": "^3.1.1",
-                "prop-types": "^15.5.8"
-            }
-        },
-        "node_modules/react-dom": {
-            "version": "16.13.1",
-            "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.13.1.tgz",
-            "integrity": "sha512-81PIMmVLnCNLO/fFOQxdQkvEq/+Hfpv24XNJfpyZhTRfO0QcmQIF/PgCa1zCOj2w1hrn12MFLyaJ/G0+Mxtfag==",
-            "dependencies": {
-                "loose-envify": "^1.1.0",
-                "object-assign": "^4.1.1",
-                "prop-types": "^15.6.2",
-                "scheduler": "^0.19.1"
-            }
-        },
-        "node_modules/react-draggable": {
-            "version": "4.4.3",
-            "resolved": "https://registry.npmjs.org/react-draggable/-/react-draggable-4.4.3.tgz",
-            "integrity": "sha512-jV4TE59MBuWm7gb6Ns3Q1mxX8Azffb7oTtDtBgFkxRvhDp38YAARmRplrj0+XGkhOJB5XziArX+4HUUABtyZ0w==",
-            "dependencies": {
-                "classnames": "^2.2.5",
-                "prop-types": "^15.6.0"
-            }
-        },
-        "node_modules/react-event-listener": {
-            "version": "0.6.6",
-            "resolved": "https://registry.npmjs.org/react-event-listener/-/react-event-listener-0.6.6.tgz",
-            "integrity": "sha512-+hCNqfy7o9wvO6UgjqFmBzARJS7qrNoda0VqzvOuioEpoEXKutiKuv92dSz6kP7rYLmyHPyYNLesi5t/aH1gfw==",
-            "dependencies": {
-                "@babel/runtime": "^7.2.0",
-                "prop-types": "^15.6.0",
-                "warning": "^4.0.1"
-            }
-        },
-        "node_modules/react-event-listener/node_modules/warning": {
-            "version": "4.0.3",
-            "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
-            "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
-            "dependencies": {
-                "loose-envify": "^1.0.0"
-            }
-        },
-        "node_modules/react-grid-layout": {
-            "version": "0.18.3",
-            "resolved": "https://registry.npmjs.org/react-grid-layout/-/react-grid-layout-0.18.3.tgz",
-            "integrity": "sha512-lHkrk941Tk5nTwZPa9uj6ttHBT0VehSHwEhWbINBJKvM1GRaFNOefvjcuxSyuCI5JWjVUP+Qm3ARt2470AlxMA==",
-            "dependencies": {
-                "classnames": "2.x",
-                "lodash.isequal": "^4.0.0",
-                "prop-types": "^15.0.0",
-                "react-draggable": "^4.0.0",
-                "react-resizable": "^1.9.0"
-            }
-        },
-        "node_modules/react-image-lightbox-with-rotate": {
-            "version": "5.1.1",
-            "resolved": "https://registry.npmjs.org/react-image-lightbox-with-rotate/-/react-image-lightbox-with-rotate-5.1.1.tgz",
-            "integrity": "sha512-5ZubUQefKSDGIiAwK4lkfmGr/bgIfNDHXqC+Fm6nbNwTVYuYOZ1RJjULOniEB4fxb3Vm0z/x0oNhi1lbP1aMtg==",
-            "dependencies": {
-                "blueimp-load-image": "^2.19.0",
-                "prop-types": "^15.6.1",
-                "react-modal": "^3.4.4"
-            }
-        },
-        "node_modules/react-input-autosize": {
-            "version": "2.2.2",
-            "resolved": "https://registry.npmjs.org/react-input-autosize/-/react-input-autosize-2.2.2.tgz",
-            "integrity": "sha512-jQJgYCA3S0j+cuOwzuCd1OjmBmnZLdqQdiLKRYrsMMzbjUrVDS5RvJUDwJqA7sKuksDuzFtm6hZGKFu7Mjk5aw==",
-            "dependencies": {
-                "prop-types": "^15.5.8"
-            }
-        },
-        "node_modules/react-is": {
-            "version": "16.13.1",
-            "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
-            "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
-        },
-        "node_modules/react-json-tree": {
-            "version": "0.11.2",
-            "resolved": "https://registry.npmjs.org/react-json-tree/-/react-json-tree-0.11.2.tgz",
-            "integrity": "sha512-aYhUPj1y5jR3ZQ+G3N7aL8FbTyO03iLwnVvvEikLcNFqNTyabdljo9xDftZndUBFyyyL0aK3qGO9+8EilILHUw==",
-            "dependencies": {
-                "babel-runtime": "^6.6.1",
-                "prop-types": "^15.5.8",
-                "react-base16-styling": "^0.5.1"
-            }
-        },
-        "node_modules/react-jsx-parser": {
-            "version": "1.25.1",
-            "resolved": "https://registry.npmjs.org/react-jsx-parser/-/react-jsx-parser-1.25.1.tgz",
-            "integrity": "sha512-lCHAw7iOocnPSpjfsHXZQGLyPpr9wlk3qtkVN44hZs0PwQuxcH8MWbLY+j6pqB9QSijM7qtulDLgFIYbAcqSmQ==",
-            "dependencies": {
-                "acorn": "^7.2.0",
-                "acorn-jsx": "^5.2.0",
-                "core-js": "^3.6.5"
-            }
-        },
-        "node_modules/react-jsx-parser/node_modules/acorn": {
-            "version": "7.3.1",
-            "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.3.1.tgz",
-            "integrity": "sha512-tLc0wSnatxAQHVHUapaHdz72pi9KUyHjq5KyHjGg9Y8Ifdc79pTh2XvI6I1/chZbnM7QtNKzh66ooDogPZSleA==",
-            "bin": {
-                "acorn": "bin/acorn"
-            },
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/react-jsx-parser/node_modules/core-js": {
-            "version": "3.6.5",
-            "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.6.5.tgz",
-            "integrity": "sha512-vZVEEwZoIsI+vPEuoF9Iqf5H7/M3eeQqWlQnYa8FSKKePuYTf5MWnxb5SDAzCa60b3JBRS5g9b+Dq7b1y/RCrA==",
-            "hasInstallScript": true
-        },
-        "node_modules/react-lifecycles-compat": {
-            "version": "3.0.4",
-            "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
-            "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
-        },
-        "node_modules/react-loading": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/react-loading/-/react-loading-2.0.3.tgz",
-            "integrity": "sha512-Vdqy79zq+bpeWJqC+xjltUjuGApyoItPgL0vgVfcJHhqwU7bAMKzysfGW/ADu6i0z0JiOCRJjo+IkFNkRNbA3A=="
-        },
-        "node_modules/react-measure": {
-            "version": "2.3.0",
-            "resolved": "https://registry.npmjs.org/react-measure/-/react-measure-2.3.0.tgz",
-            "integrity": "sha512-dwAvmiOeblj5Dvpnk8Jm7Q8B4THF/f1l1HtKVi0XDecsG6LXwGvzV5R1H32kq3TW6RW64OAf5aoQxpIgLa4z8A==",
-            "dependencies": {
-                "@babel/runtime": "^7.2.0",
-                "get-node-dimensions": "^1.2.1",
-                "prop-types": "^15.6.2",
-                "resize-observer-polyfill": "^1.5.0"
-            }
-        },
-        "node_modules/react-merge-refs": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/react-merge-refs/-/react-merge-refs-1.1.0.tgz",
-            "integrity": "sha512-alTKsjEL0dKH/ru1Iyn7vliS2QRcBp9zZPGoWxUOvRGWPUYgjo+V01is7p04It6KhgrzhJGnIj9GgX8W4bZoCQ=="
-        },
-        "node_modules/react-modal": {
-            "version": "3.11.2",
-            "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.11.2.tgz",
-            "integrity": "sha512-o8gvvCOFaG1T7W6JUvsYjRjMVToLZgLIsi5kdhFIQCtHxDkA47LznX62j+l6YQkpXDbvQegsDyxe/+JJsFQN7w==",
-            "dependencies": {
-                "exenv": "^1.2.0",
-                "prop-types": "^15.5.10",
-                "react-lifecycles-compat": "^3.0.0",
-                "warning": "^4.0.3"
-            }
-        },
-        "node_modules/react-modal/node_modules/warning": {
-            "version": "4.0.3",
-            "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
-            "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
-            "dependencies": {
-                "loose-envify": "^1.0.0"
-            }
-        },
-        "node_modules/react-onclickoutside": {
-            "version": "6.9.0",
-            "resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.9.0.tgz",
-            "integrity": "sha512-8ltIY3bC7oGhj2nPAvWOGi+xGFybPNhJM0V1H8hY/whNcXgmDeaeoCMPPd8VatrpTsUWjb/vGzrmu6SrXVty3A=="
-        },
-        "node_modules/react-popper": {
-            "version": "1.3.7",
-            "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-1.3.7.tgz",
-            "integrity": "sha512-nmqYTx7QVjCm3WUZLeuOomna138R1luC4EqkW3hxJUrAe+3eNz3oFCLYdnPwILfn0mX1Ew2c3wctrjlUMYYUww==",
-            "dependencies": {
-                "@babel/runtime": "^7.1.2",
-                "create-react-context": "^0.3.0",
-                "deep-equal": "^1.1.1",
-                "popper.js": "^1.14.4",
-                "prop-types": "^15.6.1",
-                "typed-styles": "^0.0.7",
-                "warning": "^4.0.2"
-            }
-        },
-        "node_modules/react-popper/node_modules/create-react-context": {
-            "version": "0.3.0",
-            "resolved": "https://registry.npmjs.org/create-react-context/-/create-react-context-0.3.0.tgz",
-            "integrity": "sha512-dNldIoSuNSvlTJ7slIKC/ZFGKexBMBrrcc+TTe1NdmROnaASuLPvqpwj9v4XS4uXZ8+YPu0sNmShX2rXI5LNsw==",
-            "dependencies": {
-                "gud": "^1.0.0",
-                "warning": "^4.0.3"
-            }
-        },
-        "node_modules/react-popper/node_modules/warning": {
-            "version": "4.0.3",
-            "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
-            "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
-            "dependencies": {
-                "loose-envify": "^1.0.0"
-            }
-        },
-        "node_modules/react-reconciler": {
-            "version": "0.26.2",
-            "resolved": "https://registry.npmjs.org/react-reconciler/-/react-reconciler-0.26.2.tgz",
-            "integrity": "sha512-nK6kgY28HwrMNwDnMui3dvm3rCFjZrcGiuwLc5COUipBK5hWHLOxMJhSnSomirqWwjPBJKV1QcbkI0VJr7Gl1Q==",
-            "dependencies": {
-                "loose-envify": "^1.1.0",
-                "object-assign": "^4.1.1",
-                "scheduler": "^0.20.2"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/react-reconciler/node_modules/scheduler": {
-            "version": "0.20.2",
-            "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
-            "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
-            "dependencies": {
-                "loose-envify": "^1.1.0",
-                "object-assign": "^4.1.1"
-            }
-        },
-        "node_modules/react-redux": {
-            "version": "7.2.0",
-            "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.0.tgz",
-            "integrity": "sha512-EvCAZYGfOLqwV7gh849xy9/pt55rJXPwmYvI4lilPM5rUT/1NxuuN59ipdBksRVSvz0KInbPnp4IfoXJXCqiDA==",
-            "dependencies": {
-                "@babel/runtime": "^7.5.5",
-                "hoist-non-react-statics": "^3.3.0",
-                "loose-envify": "^1.4.0",
-                "prop-types": "^15.7.2",
-                "react-is": "^16.9.0"
-            }
-        },
-        "node_modules/react-resizable": {
-            "version": "1.10.1",
-            "resolved": "https://registry.npmjs.org/react-resizable/-/react-resizable-1.10.1.tgz",
-            "integrity": "sha512-Jd/bKOKx6+19NwC4/aMLRu/J9/krfxlDnElP41Oc+oLiUWs/zwV1S9yBfBZRnqAwQb6vQ/HRSk3bsSWGSgVbpw==",
-            "dependencies": {
-                "prop-types": "15.x",
-                "react-draggable": "^4.0.3"
-            }
-        },
-        "node_modules/react-resizable-rotatable-draggable": {
-            "version": "0.2.0",
-            "resolved": "https://registry.npmjs.org/react-resizable-rotatable-draggable/-/react-resizable-rotatable-draggable-0.2.0.tgz",
-            "integrity": "sha512-F8TPx3z7/AcmRViySbYV3LpUWXFpHlGAmKmNcYMgPlS+h1eYFazRG3xYS8Z6e48hWY1EcCny/YNrwRNUrap8CQ==",
-            "engines": {
-                "node": ">=8",
-                "npm": ">=6"
-            }
-        },
-        "node_modules/react-reveal": {
-            "version": "1.2.2",
-            "resolved": "https://registry.npmjs.org/react-reveal/-/react-reveal-1.2.2.tgz",
-            "integrity": "sha512-JCv3fAoU6Z+Lcd8U48bwzm4pMZ79qsedSXYwpwt6lJNtj/v5nKJYZZbw3yhaQPPgYePo3Y0NOCoYOq/jcsisuw==",
-            "dependencies": {
-                "prop-types": "^15.5.10"
-            }
-        },
-        "node_modules/react-select": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/react-select/-/react-select-3.1.0.tgz",
-            "integrity": "sha512-wBFVblBH1iuCBprtpyGtd1dGMadsG36W5/t2Aj8OE6WbByDg5jIFyT7X5gT+l0qmT5TqWhxX+VsKJvCEl2uL9g==",
-            "dependencies": {
-                "@babel/runtime": "^7.4.4",
-                "@emotion/cache": "^10.0.9",
-                "@emotion/core": "^10.0.9",
-                "@emotion/css": "^10.0.9",
-                "memoize-one": "^5.0.0",
-                "prop-types": "^15.6.0",
-                "react-input-autosize": "^2.2.2",
-                "react-transition-group": "^4.3.0"
-            }
-        },
-        "node_modules/react-select/node_modules/dom-helpers": {
-            "version": "5.1.4",
-            "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.1.4.tgz",
-            "integrity": "sha512-TjMyeVUvNEnOnhzs6uAn9Ya47GmMo3qq7m+Lr/3ON0Rs5kHvb8I+SQYjLUSYn7qhEm0QjW0yrBkvz9yOrwwz1A==",
-            "dependencies": {
-                "@babel/runtime": "^7.8.7",
-                "csstype": "^2.6.7"
-            }
-        },
-        "node_modules/react-select/node_modules/react-transition-group": {
-            "version": "4.4.1",
-            "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.1.tgz",
-            "integrity": "sha512-Djqr7OQ2aPUiYurhPalTrVy9ddmFCCzwhqQmtN+J3+3DzLO209Fdr70QrN8Z3DsglWql6iY1lDWAfpFiBtuKGw==",
-            "dependencies": {
-                "@babel/runtime": "^7.5.5",
-                "dom-helpers": "^5.0.1",
-                "loose-envify": "^1.4.0",
-                "prop-types": "^15.6.2"
-            }
-        },
-        "node_modules/react-table": {
-            "version": "6.11.5",
-            "resolved": "https://registry.npmjs.org/react-table/-/react-table-6.11.5.tgz",
-            "integrity": "sha512-LM+AS9v//7Y7lAlgTWW/cW6Sn5VOb3EsSkKQfQTzOW8FngB1FUskLLNEVkAYsTX9LjOWR3QlGjykJqCE6eXT/g==",
-            "dependencies": {
-                "@types/react-table": "^6.8.5",
-                "classnames": "^2.2.5",
-                "react-is": "^16.8.1"
-            }
-        },
-        "node_modules/react-themeable": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/react-themeable/-/react-themeable-1.1.0.tgz",
-            "integrity": "sha1-fURm3ZsrX6dQWHJ4JenxUro3mg4=",
-            "dependencies": {
-                "object-assign": "^3.0.0"
-            }
-        },
-        "node_modules/react-themeable/node_modules/object-assign": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
-            "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/react-three-fiber": {
-            "version": "0.0.0-deprecated",
-            "resolved": "https://registry.npmjs.org/react-three-fiber/-/react-three-fiber-0.0.0-deprecated.tgz",
-            "integrity": "sha512-EblIqTAsIpkYeM8bZtC4lcpTE0A2zCEGipFB52RgcQq/q+0oryrk7Sxt+sqhIjUu6xMNEVywV8dr74lz5yWO6A=="
-        },
-        "node_modules/react-transition-group": {
-            "version": "2.9.0",
-            "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-2.9.0.tgz",
-            "integrity": "sha512-+HzNTCHpeQyl4MJ/bdE0u6XRMe9+XG/+aL4mCxVN4DnPBQ0/5bfHWPDuOZUzYdMj94daZaZdCCc1Dzt9R/xSSg==",
-            "dependencies": {
-                "dom-helpers": "^3.4.0",
-                "loose-envify": "^1.4.0",
-                "prop-types": "^15.6.2",
-                "react-lifecycles-compat": "^3.0.4"
-            }
-        },
-        "node_modules/react-use-measure": {
-            "version": "2.0.4",
-            "resolved": "https://registry.npmjs.org/react-use-measure/-/react-use-measure-2.0.4.tgz",
-            "integrity": "sha512-7K2HIGaPMl3Q9ZQiEVjen3tRXl4UDda8LiTPy/QxP8dP2rl5gPBhf7mMH6MVjjRNv3loU7sNzey/ycPNnHVTxQ==",
-            "dependencies": {
-                "debounce": "^1.2.0"
-            }
-        },
-        "node_modules/reactcss": {
-            "version": "1.2.3",
-            "resolved": "https://registry.npmjs.org/reactcss/-/reactcss-1.2.3.tgz",
-            "integrity": "sha512-KiwVUcFu1RErkI97ywr8nvx8dNOpT03rbnma0SSalTYjkrPYaEajR4a/MRt6DZ46K6arDRbWMNHF+xH7G7n/8A==",
-            "dependencies": {
-                "lodash": "^4.0.1"
-            }
-        },
-        "node_modules/read-pkg": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
-            "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
-            "dependencies": {
-                "load-json-file": "^1.0.0",
-                "normalize-package-data": "^2.3.2",
-                "path-type": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/read-pkg-up": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
-            "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
-            "dependencies": {
-                "find-up": "^1.0.0",
-                "read-pkg": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/read-pkg-up/node_modules/find-up": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
-            "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
-            "dependencies": {
-                "path-exists": "^2.0.0",
-                "pinkie-promise": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/read-pkg-up/node_modules/path-exists": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
-            "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
-            "dependencies": {
-                "pinkie-promise": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/read-pkg/node_modules/path-type": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
-            "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
-            "dependencies": {
-                "graceful-fs": "^4.1.2",
-                "pify": "^2.0.0",
-                "pinkie-promise": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/read-pkg/node_modules/pify": {
-            "version": "2.3.0",
-            "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-            "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/readable-stream": {
-            "version": "3.6.0",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
-            "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
-            "dependencies": {
-                "inherits": "^2.0.3",
-                "string_decoder": "^1.1.1",
-                "util-deprecate": "^1.0.1"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/readdirp": {
-            "version": "2.2.1",
-            "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.2.1.tgz",
-            "integrity": "sha512-1JU/8q+VgFZyxwrJ+SVIOsh+KywWGpds3NTqikiKpDMZWScmAYyKIgqkO+ARvNWJfXeXR1zxz7aHF4u4CyH6vQ==",
-            "dependencies": {
-                "graceful-fs": "^4.1.11",
-                "micromatch": "^3.1.10",
-                "readable-stream": "^2.0.2"
-            },
-            "engines": {
-                "node": ">=0.10"
-            }
-        },
-        "node_modules/readdirp/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/readline": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/readline/-/readline-1.3.0.tgz",
-            "integrity": "sha1-xYDXfvLPyHUrEySYBg3JeTp6wBw="
-        },
-        "node_modules/rechoir": {
-            "version": "0.6.2",
-            "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
-            "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=",
-            "dependencies": {
-                "resolve": "^1.1.6"
-            },
-            "engines": {
-                "node": ">= 0.10"
-            }
-        },
-        "node_modules/recompose": {
-            "version": "0.26.0",
-            "resolved": "https://registry.npmjs.org/recompose/-/recompose-0.26.0.tgz",
-            "integrity": "sha512-KwOu6ztO0mN5vy3+zDcc45lgnaUoaQse/a5yLVqtzTK13czSWnFGmXbQVmnoMgDkI5POd1EwIKSbjU1V7xdZog==",
-            "dependencies": {
-                "change-emitter": "^0.1.2",
-                "fbjs": "^0.8.1",
-                "hoist-non-react-statics": "^2.3.1",
-                "symbol-observable": "^1.0.4"
-            }
-        },
-        "node_modules/recompose/node_modules/hoist-non-react-statics": {
-            "version": "2.5.5",
-            "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
-            "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
-        },
-        "node_modules/redent": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/redent/-/redent-1.0.0.tgz",
-            "integrity": "sha1-z5Fqsf1fHxbfsggi3W7H9zDCr94=",
-            "dependencies": {
-                "indent-string": "^2.1.0",
-                "strip-indent": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/reduce-flatten": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/reduce-flatten/-/reduce-flatten-1.0.1.tgz",
-            "integrity": "sha1-JYx479FT3fk8tWEjf2EYTzaW4yc=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/redux": {
-            "version": "4.0.5",
-            "resolved": "https://registry.npmjs.org/redux/-/redux-4.0.5.tgz",
-            "integrity": "sha512-VSz1uMAH24DM6MF72vcojpYPtrTUu3ByVWfPL1nPfVRb5mZVTve5GnNCUV53QM/BZ66xfWrm0CTWoM+Xlz8V1w==",
-            "dependencies": {
-                "loose-envify": "^1.4.0",
-                "symbol-observable": "^1.2.0"
-            }
-        },
-        "node_modules/regenerator-runtime": {
-            "version": "0.13.5",
-            "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.5.tgz",
-            "integrity": "sha512-ZS5w8CpKFinUzOwW3c83oPeVXoNsrLsaCoLtJvAClH135j/R77RuymhiSErhm2lKcwSCIpmvIWSbDkIfAqKQlA=="
-        },
-        "node_modules/regex-not": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/regex-not/-/regex-not-1.0.2.tgz",
-            "integrity": "sha512-J6SDjUgDxQj5NusnOtdFxDwN/+HWykR8GELwctJ7mdqhcyy1xEc4SRFHUXvxTp661YaVKAjfRLZ9cCqS6tn32A==",
-            "dependencies": {
-                "extend-shallow": "^3.0.2",
-                "safe-regex": "^1.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/regexp-clone": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/regexp-clone/-/regexp-clone-1.0.0.tgz",
-            "integrity": "sha512-TuAasHQNamyyJ2hb97IuBEif4qBHGjPHBS64sZwytpLEqtBQ1gPJTnOaQ6qmpET16cK14kkjbazl6+p0RRv0yw=="
-        },
-        "node_modules/regexp.prototype.flags": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.3.0.tgz",
-            "integrity": "sha512-2+Q0C5g951OlYlJz6yu5/M33IcsESLlLfsyIaLJaG4FA2r4yP8MvVMJUUP/fVBkSpbbbZlS5gynbEWLipiiXiQ==",
-            "dependencies": {
-                "define-properties": "^1.1.3",
-                "es-abstract": "^1.17.0-next.1"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/registry-auth-token": {
-            "version": "3.4.0",
-            "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.4.0.tgz",
-            "integrity": "sha512-4LM6Fw8eBQdwMYcES4yTnn2TqIasbXuwDx3um+QRs7S55aMKCBKBxvPXl2RiUjHwuJLTyYfxSpmfSAjQpcuP+A==",
-            "dependencies": {
-                "rc": "^1.1.6",
-                "safe-buffer": "^5.0.1"
-            }
-        },
-        "node_modules/registry-url": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz",
-            "integrity": "sha1-PU74cPc93h138M+aOBQyRE4XSUI=",
-            "dependencies": {
-                "rc": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/remove-trailing-separator": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz",
-            "integrity": "sha1-wkvOKig62tW8P1jg1IJJuSN52O8="
-        },
-        "node_modules/repeat-element": {
-            "version": "1.1.3",
-            "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.3.tgz",
-            "integrity": "sha512-ahGq0ZnV5m5XtZLMb+vP76kcAM5nkLqk0lpqAuojSKGgQtn4eRi4ZZGm2olo2zKFH+sMsWaqOCW1dqAnOru72g==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/repeat-string": {
-            "version": "1.6.1",
-            "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz",
-            "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc=",
-            "engines": {
-                "node": ">=0.10"
-            }
-        },
-        "node_modules/repeating": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz",
-            "integrity": "sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo=",
-            "dependencies": {
-                "is-finite": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/request": {
-            "version": "2.88.2",
-            "resolved": "https://registry.npmjs.org/request/-/request-2.88.2.tgz",
-            "integrity": "sha512-MsvtOrfG9ZcrOwAW+Qi+F6HbD0CWXEh9ou77uOb7FM2WPhwT7smM833PzanhJLsgXjN89Ir6V2PczXNnMpwKhw==",
-            "dependencies": {
-                "aws-sign2": "~0.7.0",
-                "aws4": "^1.8.0",
-                "caseless": "~0.12.0",
-                "combined-stream": "~1.0.6",
-                "extend": "~3.0.2",
-                "forever-agent": "~0.6.1",
-                "form-data": "~2.3.2",
-                "har-validator": "~5.1.3",
-                "http-signature": "~1.2.0",
-                "is-typedarray": "~1.0.0",
-                "isstream": "~0.1.2",
-                "json-stringify-safe": "~5.0.1",
-                "mime-types": "~2.1.19",
-                "oauth-sign": "~0.9.0",
-                "performance-now": "^2.1.0",
-                "qs": "~6.5.2",
-                "safe-buffer": "^5.1.2",
-                "tough-cookie": "~2.5.0",
-                "tunnel-agent": "^0.6.0",
-                "uuid": "^3.3.2"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/request-promise": {
-            "version": "4.2.5",
-            "resolved": "https://registry.npmjs.org/request-promise/-/request-promise-4.2.5.tgz",
-            "integrity": "sha512-ZgnepCykFdmpq86fKGwqntyTiUrHycALuGggpyCZwMvGaZWgxW6yagT0FHkgo5LzYvOaCNvxYwWYIjevSH1EDg==",
-            "dependencies": {
-                "bluebird": "^3.5.0",
-                "request-promise-core": "1.1.3",
-                "stealthy-require": "^1.1.1",
-                "tough-cookie": "^2.3.3"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/request-promise-core": {
-            "version": "1.1.3",
-            "resolved": "https://registry.npmjs.org/request-promise-core/-/request-promise-core-1.1.3.tgz",
-            "integrity": "sha512-QIs2+ArIGQVp5ZYbWD5ZLCY29D5CfWizP8eWnm8FoGD1TX61veauETVQbrV60662V0oFBkrDOuaBI8XgtuyYAQ==",
-            "dependencies": {
-                "lodash": "^4.17.15"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/request-promise-native": {
-            "version": "1.0.8",
-            "resolved": "https://registry.npmjs.org/request-promise-native/-/request-promise-native-1.0.8.tgz",
-            "integrity": "sha512-dapwLGqkHtwL5AEbfenuzjTYg35Jd6KPytsC2/TLkVMz8rm+tNt72MGUWT1RP/aYawMpN6HqbNGBQaRcBtjQMQ==",
-            "dev": true,
-            "dependencies": {
-                "request-promise-core": "1.1.3",
-                "stealthy-require": "^1.1.1",
-                "tough-cookie": "^2.3.3"
-            },
-            "engines": {
-                "node": ">=0.12.0"
-            }
-        },
-        "node_modules/request/node_modules/form-data": {
-            "version": "2.3.3",
-            "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.3.tgz",
-            "integrity": "sha512-1lLKB2Mu3aGP1Q/2eCOx0fNbRMe7XdwktwOruhfqqd0rIJWwN4Dh+E3hrPSlDCXnSR7UtZ1N38rVXm+6+MEhJQ==",
-            "dependencies": {
-                "asynckit": "^0.4.0",
-                "combined-stream": "^1.0.6",
-                "mime-types": "^2.1.12"
-            },
-            "engines": {
-                "node": ">= 0.12"
-            }
-        },
-        "node_modules/require_optional": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/require_optional/-/require_optional-1.0.1.tgz",
-            "integrity": "sha512-qhM/y57enGWHAe3v/NcwML6a3/vfESLe/sGM2dII+gEO0BpKRUkWZow/tyloNqJyN6kXSl3RyyM8Ll5D/sJP8g==",
-            "dependencies": {
-                "resolve-from": "^2.0.0",
-                "semver": "^5.1.0"
-            }
-        },
-        "node_modules/require_optional/node_modules/resolve-from": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-2.0.0.tgz",
-            "integrity": "sha1-lICrIOlP+h2egKgEx+oUdhGWa1c=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/require-directory": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
-            "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/require-main-filename": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
-            "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg=="
-        },
-        "node_modules/require-package-name": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/require-package-name/-/require-package-name-2.0.1.tgz",
-            "integrity": "sha1-wR6XJ2tluOKSP3Xav1+y7ww4Qbk="
-        },
-        "node_modules/requires-port": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
-            "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=",
-            "dev": true
-        },
-        "node_modules/resize-observer-polyfill": {
-            "version": "1.5.1",
-            "resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
-            "integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
-        },
-        "node_modules/resolve": {
-            "version": "1.17.0",
-            "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.17.0.tgz",
-            "integrity": "sha512-ic+7JYiV8Vi2yzQGFWOkiZD5Z9z7O2Zhm9XMaTxdJExKasieFCr+yXZ/WmXsckHiKl12ar0y6XiXDx3m4RHn1w==",
-            "dependencies": {
-                "path-parse": "^1.0.6"
-            }
-        },
-        "node_modules/resolve-cwd": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/resolve-cwd/-/resolve-cwd-2.0.0.tgz",
-            "integrity": "sha1-AKn3OHVW4nA46uIyyqNypqWbZlo=",
-            "dev": true,
-            "dependencies": {
-                "resolve-from": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/resolve-cwd/node_modules/resolve-from": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-3.0.0.tgz",
-            "integrity": "sha1-six699nWiBvItuZTM17rywoYh0g=",
-            "dev": true,
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/resolve-dir": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-1.0.1.tgz",
-            "integrity": "sha1-eaQGRMNivoLybv/nOcm7U4IEb0M=",
-            "dev": true,
-            "dependencies": {
-                "expand-tilde": "^2.0.0",
-                "global-modules": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/resolve-dir/node_modules/global-modules": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-1.0.0.tgz",
-            "integrity": "sha512-sKzpEkf11GpOFuw0Zzjzmt4B4UZwjOcG757PPvrfhxcLFbq0wpsgpOqxpxtxFiCG4DtG93M6XRVbF2oGdev7bg==",
-            "dev": true,
-            "dependencies": {
-                "global-prefix": "^1.0.1",
-                "is-windows": "^1.0.1",
-                "resolve-dir": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/resolve-from": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
-            "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/resolve-url": {
-            "version": "0.2.1",
-            "resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz",
-            "integrity": "sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo="
-        },
-        "node_modules/ret": {
-            "version": "0.1.15",
-            "resolved": "https://registry.npmjs.org/ret/-/ret-0.1.15.tgz",
-            "integrity": "sha512-TTlYpa+OL+vMMNG24xSlQGEJ3B/RzEfUlLct7b5G/ytav+wPrplCpVMFuwzXbkecJrb6IYo1iFb0S9v37754mg==",
-            "engines": {
-                "node": ">=0.12"
-            }
-        },
-        "node_modules/retry": {
-            "version": "0.12.0",
-            "resolved": "https://registry.npmjs.org/retry/-/retry-0.12.0.tgz",
-            "integrity": "sha1-G0KmJmoh8HQh0bC1S33BZ7AcATs=",
-            "dev": true,
-            "engines": {
-                "node": ">= 4"
-            }
-        },
-        "node_modules/reveal.js": {
-            "version": "4.0.2",
-            "resolved": "https://registry.npmjs.org/reveal.js/-/reveal.js-4.0.2.tgz",
-            "integrity": "sha512-LWZSUenufF1gpD7npxJ7KfoQQFKgc1D6XrLTFgKlwWNP1BQ74hT48KONFWMAw+8R/QUeaScCLCLrBVHDfFIEiw==",
-            "engines": {
-                "node": ">=10.0.0"
-            }
-        },
-        "node_modules/right-align": {
-            "version": "0.1.3",
-            "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz",
-            "integrity": "sha1-YTObci/mo1FWiSENJOFMlhSGE+8=",
-            "dependencies": {
-                "align-text": "^0.1.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/rimraf": {
-            "version": "3.0.2",
-            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
-            "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/ripemd160": {
-            "version": "2.0.2",
-            "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.2.tgz",
-            "integrity": "sha512-ii4iagi25WusVoiC4B4lq7pbXfAp3D9v5CwfkY33vffw2+pkDjY1D8GaN7spsxvCSx8dkPqOZCEZyfxcmJG2IA==",
-            "dev": true,
-            "dependencies": {
-                "hash-base": "^3.0.0",
-                "inherits": "^2.0.1"
-            }
-        },
-        "node_modules/rope-sequence": {
-            "version": "1.3.2",
-            "resolved": "https://registry.npmjs.org/rope-sequence/-/rope-sequence-1.3.2.tgz",
-            "integrity": "sha512-ku6MFrwEVSVmXLvy3dYph3LAMNS0890K7fabn+0YIRQ2T96T9F4gkFf0vf0WW0JUraNWwGRtInEpH7yO4tbQZg=="
-        },
-        "node_modules/rtcpeerconnection-shim": {
-            "version": "1.2.15",
-            "resolved": "https://registry.npmjs.org/rtcpeerconnection-shim/-/rtcpeerconnection-shim-1.2.15.tgz",
-            "integrity": "sha512-C6DxhXt7bssQ1nHb154lqeL0SXz5Dx4RczXZu2Aa/L1NJFnEVDxFwCBo3fqtuljhHIGceg5JKBV4XJ0gW5JKyw==",
-            "dependencies": {
-                "sdp": "^2.6.0"
-            },
-            "engines": {
-                "node": ">=6.0.0",
-                "npm": ">=3.10.0"
-            }
-        },
-        "node_modules/run-queue": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/run-queue/-/run-queue-1.0.3.tgz",
-            "integrity": "sha1-6Eg5bwV9Ij8kOGkkYY4laUFh7Ec=",
-            "dev": true,
-            "dependencies": {
-                "aproba": "^1.1.1"
-            }
-        },
-        "node_modules/safe-buffer": {
-            "version": "5.1.2",
-            "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-            "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
-        },
-        "node_modules/safe-regex": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz",
-            "integrity": "sha1-QKNmnzsHfR6UPURinhV91IAjvy4=",
-            "dependencies": {
-                "ret": "~0.1.10"
-            }
-        },
-        "node_modules/safer-buffer": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
-            "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
-        },
-        "node_modules/saslprep": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/saslprep/-/saslprep-1.0.3.tgz",
-            "integrity": "sha512-/MY/PEMbk2SuY5sScONwhUDsV2p77Znkb/q3nSVstq/yQzYJOH/Azh29p9oJLsl3LnQwSvZDKagDGBsBwSooag==",
-            "optional": true,
-            "dependencies": {
-                "sparse-bitfield": "^3.0.3"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/sass-graph": {
-            "version": "2.2.5",
-            "resolved": "https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.5.tgz",
-            "integrity": "sha512-VFWDAHOe6mRuT4mZRd4eKE+d8Uedrk6Xnh7Sh9b4NGufQLQjOrvf/MQoOdx+0s92L89FeyUUNfU597j/3uNpag==",
-            "dependencies": {
-                "glob": "^7.0.0",
-                "lodash": "^4.0.0",
-                "scss-tokenizer": "^0.2.3",
-                "yargs": "^13.3.2"
-            }
-        },
-        "node_modules/sass-loader": {
-            "version": "7.3.1",
-            "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-7.3.1.tgz",
-            "integrity": "sha512-tuU7+zm0pTCynKYHpdqaPpe+MMTQ76I9TPZ7i4/5dZsigE350shQWe5EZNl5dBidM49TPET75tNqRbcsUZWeNA==",
-            "dev": true,
-            "dependencies": {
-                "clone-deep": "^4.0.1",
-                "loader-utils": "^1.0.1",
-                "neo-async": "^2.5.0",
-                "pify": "^4.0.1",
-                "semver": "^6.3.0"
-            },
-            "engines": {
-                "node": ">= 6.9.0"
-            }
-        },
-        "node_modules/sass-loader/node_modules/semver": {
-            "version": "6.3.0",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-            "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
-            "dev": true,
-            "bin": {
-                "semver": "bin/semver.js"
-            }
-        },
-        "node_modules/sax": {
-            "version": "1.2.4",
-            "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
-            "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw=="
-        },
-        "node_modules/saxes": {
-            "version": "3.1.11",
-            "resolved": "https://registry.npmjs.org/saxes/-/saxes-3.1.11.tgz",
-            "integrity": "sha512-Ydydq3zC+WYDJK1+gRxRapLIED9PWeSuuS41wqyoRmzvhhh9nc+QQrVMKJYzJFULazeGhzSV0QleN2wD3boh2g==",
-            "dev": true,
-            "dependencies": {
-                "xmlchars": "^2.1.1"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/scheduler": {
-            "version": "0.19.1",
-            "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.19.1.tgz",
-            "integrity": "sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==",
-            "dependencies": {
-                "loose-envify": "^1.1.0",
-                "object-assign": "^4.1.1"
-            }
-        },
-        "node_modules/schema-utils": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
-            "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
-            "dev": true,
-            "dependencies": {
-                "ajv": "^6.1.0",
-                "ajv-errors": "^1.0.0",
-                "ajv-keywords": "^3.1.0"
-            },
-            "engines": {
-                "node": ">= 4"
-            }
-        },
-        "node_modules/scss-loader": {
-            "version": "0.0.1",
-            "resolved": "https://registry.npmjs.org/scss-loader/-/scss-loader-0.0.1.tgz",
-            "integrity": "sha1-6uAXueDzjBKlMtslwiC5Avs05nE=",
-            "dev": true
-        },
-        "node_modules/scss-tokenizer": {
-            "version": "0.2.3",
-            "resolved": "https://registry.npmjs.org/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz",
-            "integrity": "sha1-jrBtualyMzOCTT9VMGQRSYR85dE=",
-            "dependencies": {
-                "js-base64": "^2.1.8",
-                "source-map": "^0.4.2"
-            }
-        },
-        "node_modules/scss-tokenizer/node_modules/source-map": {
-            "version": "0.4.4",
-            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
-            "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s=",
-            "dependencies": {
-                "amdefine": ">=0.0.4"
-            },
-            "engines": {
-                "node": ">=0.8.0"
-            }
-        },
-        "node_modules/sdp": {
-            "version": "2.12.0",
-            "resolved": "https://registry.npmjs.org/sdp/-/sdp-2.12.0.tgz",
-            "integrity": "sha512-jhXqQAQVM+8Xj5EjJGVweuEzgtGWb3tmEEpl3CLP3cStInSbVHSg0QWOGQzNq8pSID4JkpeV2mPqlMDLrm0/Vw=="
-        },
-        "node_modules/section-iterator": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/section-iterator/-/section-iterator-2.0.0.tgz",
-            "integrity": "sha1-v0RNev7rlK1Dw5rS+yYVFifMuio="
-        },
-        "node_modules/select-hose": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
-            "integrity": "sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo=",
-            "dev": true
-        },
-        "node_modules/selfsigned": {
-            "version": "1.10.7",
-            "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.7.tgz",
-            "integrity": "sha512-8M3wBCzeWIJnQfl43IKwOmC4H/RAp50S8DF60znzjW5GVqTcSe2vWclt7hmYVPkKPlHWOu5EaWOMZ2Y6W8ZXTA==",
-            "dev": true,
-            "dependencies": {
-                "node-forge": "0.9.0"
-            }
-        },
-        "node_modules/selfsigned/node_modules/node-forge": {
-            "version": "0.9.0",
-            "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.9.0.tgz",
-            "integrity": "sha512-7ASaDa3pD+lJ3WvXFsxekJQelBKRpne+GOVbLbtHYdd7pFspyeuJHnWfLplGf3SwKGbfs/aYl5V/JCIaHVUKKQ==",
-            "dev": true,
-            "engines": {
-                "node": ">= 4.5.0"
-            }
-        },
-        "node_modules/semver": {
-            "version": "5.7.1",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
-            "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
-            "bin": {
-                "semver": "bin/semver"
-            }
-        },
-        "node_modules/semver-compare": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/semver-compare/-/semver-compare-1.0.0.tgz",
-            "integrity": "sha1-De4hahyUGrN+nvsXiPavxf9VN/w="
-        },
-        "node_modules/semver-diff": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/semver-diff/-/semver-diff-2.1.0.tgz",
-            "integrity": "sha1-S7uEN8jTfksM8aaP1ybsbWRdbTY=",
-            "dependencies": {
-                "semver": "^5.0.3"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/send": {
-            "version": "0.17.1",
-            "resolved": "https://registry.npmjs.org/send/-/send-0.17.1.tgz",
-            "integrity": "sha512-BsVKsiGcQMFwT8UxypobUKyv7irCNRHk1T0G680vk88yf6LBByGcZJOTJCrTP2xVN6yI+XjPJcNuE3V4fT9sAg==",
-            "dependencies": {
-                "debug": "2.6.9",
-                "depd": "~1.1.2",
-                "destroy": "~1.0.4",
-                "encodeurl": "~1.0.2",
-                "escape-html": "~1.0.3",
-                "etag": "~1.8.1",
-                "fresh": "0.5.2",
-                "http-errors": "~1.7.2",
-                "mime": "1.6.0",
-                "ms": "2.1.1",
-                "on-finished": "~2.3.0",
-                "range-parser": "~1.2.1",
-                "statuses": "~1.5.0"
-            },
-            "engines": {
-                "node": ">= 0.8.0"
-            }
-        },
-        "node_modules/send/node_modules/debug": {
-            "version": "2.6.9",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/send/node_modules/debug/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-        },
-        "node_modules/serialize-javascript": {
-            "version": "1.9.1",
-            "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-1.9.1.tgz",
-            "integrity": "sha512-0Vb/54WJ6k5v8sSWN09S0ora+Hnr+cX40r9F170nT+mSkaxltoE/7R3OrIdBSUv1OoiobH1QoWQbCnAO+e8J1A==",
-            "dev": true
-        },
-        "node_modules/serializr": {
-            "version": "1.5.4",
-            "resolved": "https://registry.npmjs.org/serializr/-/serializr-1.5.4.tgz",
-            "integrity": "sha512-ImLlkNfNSSv9d7Ah1j/yrPk1FHbRC1zkD7URcgx/8M1eYHGUxGf/Ig/d8ML04ifqN7QesyYKsfLYA4xjAVAR/g=="
-        },
-        "node_modules/serve-index": {
-            "version": "1.9.1",
-            "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.1.tgz",
-            "integrity": "sha1-03aNabHn2C5c4FD/9bRTvqEqkjk=",
-            "dev": true,
-            "dependencies": {
-                "accepts": "~1.3.4",
-                "batch": "0.6.1",
-                "debug": "2.6.9",
-                "escape-html": "~1.0.3",
-                "http-errors": "~1.6.2",
-                "mime-types": "~2.1.17",
-                "parseurl": "~1.3.2"
-            },
-            "engines": {
-                "node": ">= 0.8.0"
-            }
-        },
-        "node_modules/serve-index/node_modules/debug": {
-            "version": "2.6.9",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-            "dev": true,
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/serve-index/node_modules/http-errors": {
-            "version": "1.6.3",
-            "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.3.tgz",
-            "integrity": "sha1-i1VoC7S+KDoLW/TqLjhYC+HZMg0=",
-            "dev": true,
-            "dependencies": {
-                "depd": "~1.1.2",
-                "inherits": "2.0.3",
-                "setprototypeof": "1.1.0",
-                "statuses": ">= 1.4.0 < 2"
-            },
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/serve-index/node_modules/inherits": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
-            "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
-            "dev": true
-        },
-        "node_modules/serve-index/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
-            "dev": true
-        },
-        "node_modules/serve-index/node_modules/setprototypeof": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz",
-            "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ==",
-            "dev": true
-        },
-        "node_modules/serve-static": {
-            "version": "1.14.1",
-            "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.14.1.tgz",
-            "integrity": "sha512-JMrvUwE54emCYWlTI+hGrGv5I8dEwmco/00EvkzIIsR7MqrHonbD9pO2MOfFnpFntl7ecpZs+3mW+XbQZu9QCg==",
-            "dependencies": {
-                "encodeurl": "~1.0.2",
-                "escape-html": "~1.0.3",
-                "parseurl": "~1.3.3",
-                "send": "0.17.1"
-            },
-            "engines": {
-                "node": ">= 0.8.0"
-            }
-        },
-        "node_modules/set-blocking": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
-            "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc="
-        },
-        "node_modules/set-immediate-shim": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz",
-            "integrity": "sha1-SysbJ+uAip+NzEgaWOXlb1mfP2E=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/set-value": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/set-value/-/set-value-2.0.1.tgz",
-            "integrity": "sha512-JxHc1weCN68wRY0fhCoXpyK55m/XPHafOmK4UWD7m2CI14GMcFypt4w/0+NV5f/ZMby2F6S2wwA7fgynh9gWSw==",
-            "dependencies": {
-                "extend-shallow": "^2.0.1",
-                "is-extendable": "^0.1.1",
-                "is-plain-object": "^2.0.3",
-                "split-string": "^3.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/set-value/node_modules/extend-shallow": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
-            "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
-            "dependencies": {
-                "is-extendable": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/set-value/node_modules/is-extendable": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
-            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/setimmediate": {
-            "version": "1.0.5",
-            "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
-            "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU="
-        },
-        "node_modules/setprototypeof": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.1.tgz",
-            "integrity": "sha512-JvdAWfbXeIGaZ9cILp38HntZSFSo3mWg6xGcJJsd+d4aRMOqauag1C63dJfDw7OaMYwEbHMOxEZ1lqVRYP2OAw=="
-        },
-        "node_modules/sha.js": {
-            "version": "2.4.11",
-            "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz",
-            "integrity": "sha512-QMEp5B7cftE7APOjk5Y6xgrbWu+WkLVQwk8JNjZ8nKRciZaByEW6MubieAiToS7+dwvrjGhH8jRXz3MVd0AYqQ==",
-            "dev": true,
-            "dependencies": {
-                "inherits": "^2.0.1",
-                "safe-buffer": "^5.0.1"
-            },
-            "bin": {
-                "sha.js": "bin.js"
-            }
-        },
-        "node_modules/shallow-clone": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-3.0.1.tgz",
-            "integrity": "sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==",
-            "dev": true,
-            "dependencies": {
-                "kind-of": "^6.0.2"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/shallow-equal": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/shallow-equal/-/shallow-equal-1.2.1.tgz",
-            "integrity": "sha512-S4vJDjHHMBaiZuT9NPb616CSmLf618jawtv3sufLl6ivK8WocjAo58cXwbRV1cgqxH0Qbv+iUt6m05eqEa2IRA=="
-        },
-        "node_modules/sharp": {
-            "version": "0.23.4",
-            "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.23.4.tgz",
-            "integrity": "sha512-fJMagt6cT0UDy9XCsgyLi0eiwWWhQRxbwGmqQT6sY8Av4s0SVsT/deg8fobBQCTDU5iXRgz0rAeXoE2LBZ8g+Q==",
-            "hasInstallScript": true,
-            "dependencies": {
-                "color": "^3.1.2",
-                "detect-libc": "^1.0.3",
-                "nan": "^2.14.0",
-                "npmlog": "^4.1.2",
-                "prebuild-install": "^5.3.3",
-                "semver": "^6.3.0",
-                "simple-get": "^3.1.0",
-                "tar": "^5.0.5",
-                "tunnel-agent": "^0.6.0"
-            },
-            "engines": {
-                "node": ">=8.5.0"
-            }
-        },
-        "node_modules/sharp/node_modules/fs-minipass": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-2.1.0.tgz",
-            "integrity": "sha512-V/JgOLFCS+R6Vcq0slCuaeWEdNC3ouDlJMNIsacH2VtALiu9mV4LPrHc5cDl8k5aw6J8jwgWWpiTo5RYhmIzvg==",
-            "dependencies": {
-                "minipass": "^3.0.0"
-            },
-            "engines": {
-                "node": ">= 8"
-            }
-        },
-        "node_modules/sharp/node_modules/minipass": {
-            "version": "3.1.1",
-            "resolved": "https://registry.npmjs.org/minipass/-/minipass-3.1.1.tgz",
-            "integrity": "sha512-UFqVihv6PQgwj8/yTGvl9kPz7xIAY+R5z6XYjRInD3Gk3qx6QGSD6zEcpeG4Dy/lQnv1J6zv8ejV90hyYIKf3w==",
-            "dependencies": {
-                "yallist": "^4.0.0"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/sharp/node_modules/minizlib": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-2.1.0.tgz",
-            "integrity": "sha512-EzTZN/fjSvifSX0SlqUERCN39o6T40AMarPbv0MrarSFtIITCBh7bi+dU8nxGFHuqs9jdIAeoYoKuQAAASsPPA==",
-            "dependencies": {
-                "minipass": "^3.0.0",
-                "yallist": "^4.0.0"
-            },
-            "engines": {
-                "node": ">= 8"
-            }
-        },
-        "node_modules/sharp/node_modules/semver": {
-            "version": "6.3.0",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-            "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
-            "bin": {
-                "semver": "bin/semver.js"
-            }
-        },
-        "node_modules/sharp/node_modules/tar": {
-            "version": "5.0.5",
-            "resolved": "https://registry.npmjs.org/tar/-/tar-5.0.5.tgz",
-            "integrity": "sha512-MNIgJddrV2TkuwChwcSNds/5E9VijOiw7kAc1y5hTNJoLDSuIyid2QtLYiCYNnICebpuvjhPQZsXwUL0O3l7OQ==",
-            "dependencies": {
-                "chownr": "^1.1.3",
-                "fs-minipass": "^2.0.0",
-                "minipass": "^3.0.0",
-                "minizlib": "^2.1.0",
-                "mkdirp": "^0.5.0",
-                "yallist": "^4.0.0"
-            },
-            "engines": {
-                "node": ">= 8"
-            }
-        },
-        "node_modules/sharp/node_modules/yallist": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-            "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
-        },
-        "node_modules/shebang-command": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
-            "integrity": "sha1-RKrGW2lbAzmJaMOfNj/uXer98eo=",
-            "dependencies": {
-                "shebang-regex": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/shebang-regex": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-1.0.0.tgz",
-            "integrity": "sha1-2kL0l0DAtC2yypcoVxyxkMmO/qM=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/shelljs": {
-            "version": "0.8.4",
-            "resolved": "https://registry.npmjs.org/shelljs/-/shelljs-0.8.4.tgz",
-            "integrity": "sha512-7gk3UZ9kOfPLIAbslLzyWeGiEqx9e3rxwZM0KE6EL8GlGwjym9Mrlx5/p33bWTu9YG6vcS4MBxYZDHYr5lr8BQ==",
-            "dependencies": {
-                "glob": "^7.0.0",
-                "interpret": "^1.0.0",
-                "rechoir": "^0.6.2"
-            },
-            "bin": {
-                "shjs": "bin/shjs"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/shellwords": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.1.tgz",
-            "integrity": "sha512-vFwSUfQvqybiICwZY5+DAWIPLKsWO31Q91JSKl3UYv+K5c2QRPzn0qzec6QPu1Qc9eHYItiP3NdJqNVqetYAww==",
-            "dev": true
-        },
-        "node_modules/sift": {
-            "version": "7.0.1",
-            "resolved": "https://registry.npmjs.org/sift/-/sift-7.0.1.tgz",
-            "integrity": "sha512-oqD7PMJ+uO6jV9EQCl0LrRw1OwsiPsiFQR5AR30heR+4Dl7jBBbDLnNvWiak20tzZlSE1H7RB30SX/1j/YYT7g=="
-        },
-        "node_modules/signal-exit": {
-            "version": "3.0.3",
-            "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.3.tgz",
-            "integrity": "sha512-VUJ49FC8U1OxwZLxIbTTrDvLnf/6TDgxZcK8wxR8zs13xpx7xbG60ndBlhNrFi2EMuFRoeDoJO7wthSLq42EjA=="
-        },
-        "node_modules/simple-assign": {
-            "version": "0.1.0",
-            "resolved": "https://registry.npmjs.org/simple-assign/-/simple-assign-0.1.0.tgz",
-            "integrity": "sha1-F/0wZqXz13OPUDIbsPFMooHMS6o="
-        },
-        "node_modules/simple-concat": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/simple-concat/-/simple-concat-1.0.0.tgz",
-            "integrity": "sha1-c0TLuLbib7J9ZrL8hvn21Zl1IcY="
-        },
-        "node_modules/simple-get": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/simple-get/-/simple-get-3.1.0.tgz",
-            "integrity": "sha512-bCR6cP+aTdScaQCnQKbPKtJOKDp/hj9EDLJo3Nw4y1QksqaovlW/bnptB6/c1e+qmNIDHRK+oXFDdEqBT8WzUA==",
-            "dependencies": {
-                "decompress-response": "^4.2.0",
-                "once": "^1.3.1",
-                "simple-concat": "^1.0.0"
-            }
-        },
-        "node_modules/simple-swizzle": {
-            "version": "0.2.2",
-            "resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz",
-            "integrity": "sha1-pNprY1/8zMoz9w0Xy5JZLeleVXo=",
-            "dependencies": {
-                "is-arrayish": "^0.3.1"
-            }
-        },
-        "node_modules/simple-swizzle/node_modules/is-arrayish": {
-            "version": "0.3.2",
-            "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz",
-            "integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ=="
-        },
-        "node_modules/slash": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/slash/-/slash-1.0.0.tgz",
-            "integrity": "sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/sliced": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/sliced/-/sliced-1.0.1.tgz",
-            "integrity": "sha1-CzpmK10Ewxd7GSa+qCsD+Dei70E="
-        },
-        "node_modules/snapdragon": {
-            "version": "0.8.2",
-            "resolved": "https://registry.npmjs.org/snapdragon/-/snapdragon-0.8.2.tgz",
-            "integrity": "sha512-FtyOnWN/wCHTVXOMwvSv26d+ko5vWlIDD6zoUJ7LW8vh+ZBC8QdljveRP+crNrtBwioEUWy/4dMtbBjA4ioNlg==",
-            "dependencies": {
-                "base": "^0.11.1",
-                "debug": "^2.2.0",
-                "define-property": "^0.2.5",
-                "extend-shallow": "^2.0.1",
-                "map-cache": "^0.2.2",
-                "source-map": "^0.5.6",
-                "source-map-resolve": "^0.5.0",
-                "use": "^3.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/snapdragon-node": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/snapdragon-node/-/snapdragon-node-2.1.1.tgz",
-            "integrity": "sha512-O27l4xaMYt/RSQ5TR3vpWCAB5Kb/czIcqUFOM/C4fYcLnbZUc1PkjTAMjof2pBWaSTwOUd6qUHcFGVGj7aIwnw==",
-            "dependencies": {
-                "define-property": "^1.0.0",
-                "isobject": "^3.0.0",
-                "snapdragon-util": "^3.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/snapdragon-node/node_modules/define-property": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
-            "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
-            "dependencies": {
-                "is-descriptor": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/snapdragon-node/node_modules/is-accessor-descriptor": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-1.0.0.tgz",
-            "integrity": "sha512-m5hnHTkcVsPfqx3AKlyttIPb7J+XykHvJP2B9bZDjlhLIoEq4XoK64Vg7boZlVWYK6LUY94dYPEE7Lh0ZkZKcQ==",
-            "dependencies": {
-                "kind-of": "^6.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/snapdragon-node/node_modules/is-data-descriptor": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-1.0.0.tgz",
-            "integrity": "sha512-jbRXy1FmtAoCjQkVmIVYwuuqDFUbaOeDjmed1tOGPrsMhtJA4rD9tkgA0F1qJ3gRFRXcHYVkdeaP50Q5rE/jLQ==",
-            "dependencies": {
-                "kind-of": "^6.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/snapdragon-node/node_modules/is-descriptor": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.2.tgz",
-            "integrity": "sha512-2eis5WqQGV7peooDyLmNEPUrps9+SXX5c9pL3xEB+4e9HnGuDa7mB7kHxHw4CbqS9k1T2hOH3miL8n8WtiYVtg==",
-            "dependencies": {
-                "is-accessor-descriptor": "^1.0.0",
-                "is-data-descriptor": "^1.0.0",
-                "kind-of": "^6.0.2"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/snapdragon-util": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/snapdragon-util/-/snapdragon-util-3.0.1.tgz",
-            "integrity": "sha512-mbKkMdQKsjX4BAL4bRYTj21edOf8cN7XHdYUJEe+Zn99hVEYcMvKPct1IqNe7+AZPirn8BCDOQBHQZknqmKlZQ==",
-            "dependencies": {
-                "kind-of": "^3.2.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/snapdragon-util/node_modules/is-buffer": {
-            "version": "1.1.6",
-            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
-            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
-        },
-        "node_modules/snapdragon-util/node_modules/kind-of": {
-            "version": "3.2.2",
-            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-            "dependencies": {
-                "is-buffer": "^1.1.5"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/snapdragon/node_modules/debug": {
-            "version": "2.6.9",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/snapdragon/node_modules/define-property": {
-            "version": "0.2.5",
-            "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-            "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
-            "dependencies": {
-                "is-descriptor": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/snapdragon/node_modules/extend-shallow": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
-            "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
-            "dependencies": {
-                "is-extendable": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/snapdragon/node_modules/is-extendable": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
-            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/snapdragon/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-        },
-        "node_modules/socket.io": {
-            "version": "2.3.0",
-            "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-2.3.0.tgz",
-            "integrity": "sha512-2A892lrj0GcgR/9Qk81EaY2gYhCBxurV0PfmmESO6p27QPrUK1J3zdns+5QPqvUYK2q657nSj0guoIil9+7eFg==",
-            "dependencies": {
-                "debug": "~4.1.0",
-                "engine.io": "~3.4.0",
-                "has-binary2": "~1.0.2",
-                "socket.io-adapter": "~1.1.0",
-                "socket.io-client": "2.3.0",
-                "socket.io-parser": "~3.4.0"
-            }
-        },
-        "node_modules/socket.io-adapter": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/socket.io-adapter/-/socket.io-adapter-1.1.2.tgz",
-            "integrity": "sha512-WzZRUj1kUjrTIrUKpZLEzFZ1OLj5FwLlAFQs9kuZJzJi5DKdU7FsWc36SNmA8iDOtwBQyT8FkrriRM8vXLYz8g=="
-        },
-        "node_modules/socket.io-client": {
-            "version": "2.3.0",
-            "resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-2.3.0.tgz",
-            "integrity": "sha512-cEQQf24gET3rfhxZ2jJ5xzAOo/xhZwK+mOqtGRg5IowZsMgwvHwnf/mCRapAAkadhM26y+iydgwsXGObBB5ZdA==",
-            "dependencies": {
-                "backo2": "1.0.2",
-                "base64-arraybuffer": "0.1.5",
-                "component-bind": "1.0.0",
-                "component-emitter": "1.2.1",
-                "debug": "~4.1.0",
-                "engine.io-client": "~3.4.0",
-                "has-binary2": "~1.0.2",
-                "has-cors": "1.1.0",
-                "indexof": "0.0.1",
-                "object-component": "0.0.3",
-                "parseqs": "0.0.5",
-                "parseuri": "0.0.5",
-                "socket.io-parser": "~3.3.0",
-                "to-array": "0.1.4"
-            }
-        },
-        "node_modules/socket.io-client/node_modules/component-emitter": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
-            "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
-        },
-        "node_modules/socket.io-client/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/socket.io-client/node_modules/isarray": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.1.tgz",
-            "integrity": "sha1-o32U7ZzaLVmGXJ92/llu4fM4dB4="
-        },
-        "node_modules/socket.io-client/node_modules/socket.io-parser": {
-            "version": "3.3.0",
-            "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-3.3.0.tgz",
-            "integrity": "sha512-hczmV6bDgdaEbVqhAeVMM/jfUfzuEZHsQg6eOmLgJht6G3mPKMxYm75w2+qhAQZ+4X+1+ATZ+QFKeOZD5riHng==",
-            "dependencies": {
-                "component-emitter": "1.2.1",
-                "debug": "~3.1.0",
-                "isarray": "2.0.1"
-            }
-        },
-        "node_modules/socket.io-client/node_modules/socket.io-parser/node_modules/debug": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
-            "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/socket.io-client/node_modules/socket.io-parser/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-        },
-        "node_modules/socket.io-parser": {
-            "version": "3.4.0",
-            "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-3.4.0.tgz",
-            "integrity": "sha512-/G/VOI+3DBp0+DJKW4KesGnQkQPFmUCbA/oO2QGT6CWxU7hLGWqU3tyuzeSK/dqcyeHsQg1vTe9jiZI8GU9SCQ==",
-            "dependencies": {
-                "component-emitter": "1.2.1",
-                "debug": "~4.1.0",
-                "isarray": "2.0.1"
-            }
-        },
-        "node_modules/socket.io-parser/node_modules/component-emitter": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
-            "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
-        },
-        "node_modules/socket.io-parser/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/socket.io-parser/node_modules/isarray": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.1.tgz",
-            "integrity": "sha1-o32U7ZzaLVmGXJ92/llu4fM4dB4="
-        },
-        "node_modules/socket.io/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/sockjs": {
-            "version": "0.3.20",
-            "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.20.tgz",
-            "integrity": "sha512-SpmVOVpdq0DJc0qArhF3E5xsxvaiqGNb73XfgBpK1y3UD5gs8DSo8aCTsuT5pX8rssdc2NDIzANwP9eCAiSdTA==",
-            "dev": true,
-            "dependencies": {
-                "faye-websocket": "^0.10.0",
-                "uuid": "^3.4.0",
-                "websocket-driver": "0.6.5"
-            }
-        },
-        "node_modules/sockjs-client": {
-            "version": "1.4.0",
-            "resolved": "https://registry.npmjs.org/sockjs-client/-/sockjs-client-1.4.0.tgz",
-            "integrity": "sha512-5zaLyO8/nri5cua0VtOrFXBPK1jbL4+1cebT/mmKA1E1ZXOvJrII75bPu0l0k843G/+iAbhEqzyKr0w/eCCj7g==",
-            "dev": true,
-            "dependencies": {
-                "debug": "^3.2.5",
-                "eventsource": "^1.0.7",
-                "faye-websocket": "~0.11.1",
-                "inherits": "^2.0.3",
-                "json3": "^3.3.2",
-                "url-parse": "^1.4.3"
-            }
-        },
-        "node_modules/sockjs-client/node_modules/faye-websocket": {
-            "version": "0.11.3",
-            "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.3.tgz",
-            "integrity": "sha512-D2y4bovYpzziGgbHYtGCMjlJM36vAl/y+xUyn1C+FVx8szd1E+86KwVw6XvYSzOP8iMpm1X0I4xJD+QtUb36OA==",
-            "dev": true,
-            "dependencies": {
-                "websocket-driver": ">=0.5.1"
-            },
-            "engines": {
-                "node": ">=0.8.0"
-            }
-        },
-        "node_modules/solr-node": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/solr-node/-/solr-node-1.2.1.tgz",
-            "integrity": "sha512-DN3+FSBgpJEgGTNddzS8tNb+ILSn5MLcsWf15G9rGxi/sROHbpcevdRSVx6s5/nz56c/5AnBTBZWak7IXWX97A==",
-            "dependencies": {
-                "@log4js-node/log4js-api": "^1.0.2",
-                "node-fetch": "^2.3.0",
-                "underscore": "^1.8.3"
-            },
-            "engines": {
-                "node": ">= 0.12.0"
-            }
-        },
-        "node_modules/solr-node/node_modules/node-fetch": {
-            "version": "2.6.0",
-            "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.0.tgz",
-            "integrity": "sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA==",
-            "engines": {
-                "node": "4.x || >=6.0.0"
-            }
-        },
-        "node_modules/source-list-map": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz",
-            "integrity": "sha512-qnQ7gVMxGNxsiL4lEuJwe/To8UnK7fAnmbGEEH8RpLouuKbeEm0lhbQVFIrNSuB+G7tVrAlVsZgETT5nljf+Iw==",
-            "dev": true
-        },
-        "node_modules/source-map": {
-            "version": "0.5.7",
-            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-            "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/source-map-resolve": {
-            "version": "0.5.3",
-            "resolved": "https://registry.npmjs.org/source-map-resolve/-/source-map-resolve-0.5.3.tgz",
-            "integrity": "sha512-Htz+RnsXWk5+P2slx5Jh3Q66vhQj1Cllm0zvnaY98+NFx+Dv2CF/f5O/t8x+KaNdrdIAsruNzoh/KpialbqAnw==",
-            "dependencies": {
-                "atob": "^2.1.2",
-                "decode-uri-component": "^0.2.0",
-                "resolve-url": "^0.2.1",
-                "source-map-url": "^0.4.0",
-                "urix": "^0.1.0"
-            }
-        },
-        "node_modules/source-map-support": {
-            "version": "0.5.19",
-            "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.19.tgz",
-            "integrity": "sha512-Wonm7zOCIJzBGQdB+thsPar0kYuCIzYvxZwlBa87yi/Mdjv7Tip2cyVbLj5o0cFPN4EVkuTwb3GDDyUx2DGnGw==",
-            "dev": true,
-            "dependencies": {
-                "buffer-from": "^1.0.0",
-                "source-map": "^0.6.0"
-            }
-        },
-        "node_modules/source-map-support/node_modules/source-map": {
-            "version": "0.6.1",
-            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/source-map-url": {
-            "version": "0.4.0",
-            "resolved": "https://registry.npmjs.org/source-map-url/-/source-map-url-0.4.0.tgz",
-            "integrity": "sha1-PpNdfd1zYxuXZZlW1VEo6HtQhKM="
-        },
-        "node_modules/sparse-bitfield": {
-            "version": "3.0.3",
-            "resolved": "https://registry.npmjs.org/sparse-bitfield/-/sparse-bitfield-3.0.3.tgz",
-            "integrity": "sha1-/0rm5oZWBWuks+eSqzM004JzyhE=",
-            "optional": true,
-            "dependencies": {
-                "memory-pager": "^1.0.2"
-            }
-        },
-        "node_modules/spdx-correct": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.1.0.tgz",
-            "integrity": "sha512-lr2EZCctC2BNR7j7WzJ2FpDznxky1sjfxvvYEyzxNyb6lZXHODmEoJeFu4JupYlkfha1KZpJyoqiJ7pgA1qq8Q==",
-            "dependencies": {
-                "spdx-expression-parse": "^3.0.0",
-                "spdx-license-ids": "^3.0.0"
-            }
-        },
-        "node_modules/spdx-exceptions": {
-            "version": "2.3.0",
-            "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.3.0.tgz",
-            "integrity": "sha512-/tTrYOC7PPI1nUAgx34hUpqXuyJG+DTHJTnIULG4rDygi4xu/tfgmq1e1cIRwRzwZgo4NLySi+ricLkZkw4i5A=="
-        },
-        "node_modules/spdx-expression-parse": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-3.0.0.tgz",
-            "integrity": "sha512-Yg6D3XpRD4kkOmTpdgbUiEJFKghJH03fiC1OPll5h/0sO6neh2jqRDVHOQ4o/LMea0tgCkbMgea5ip/e+MkWyg==",
-            "dependencies": {
-                "spdx-exceptions": "^2.1.0",
-                "spdx-license-ids": "^3.0.0"
-            }
-        },
-        "node_modules/spdx-license-ids": {
-            "version": "3.0.5",
-            "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.5.tgz",
-            "integrity": "sha512-J+FWzZoynJEXGphVIS+XEh3kFSjZX/1i9gFBaWQcB+/tmpe2qUsSBABpcxqxnAxFdiUFEgAX1bjYGQvIZmoz9Q=="
-        },
-        "node_modules/spdy": {
-            "version": "4.0.2",
-            "resolved": "https://registry.npmjs.org/spdy/-/spdy-4.0.2.tgz",
-            "integrity": "sha512-r46gZQZQV+Kl9oItvl1JZZqJKGr+oEkB08A6BzkiR7593/7IbtuncXHd2YoYeTsG4157ZssMu9KYvUHLcjcDoA==",
-            "dev": true,
-            "dependencies": {
-                "debug": "^4.1.0",
-                "handle-thing": "^2.0.0",
-                "http-deceiver": "^1.2.7",
-                "select-hose": "^2.0.0",
-                "spdy-transport": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6.0.0"
-            }
-        },
-        "node_modules/spdy-transport": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-3.0.0.tgz",
-            "integrity": "sha512-hsLVFE5SjA6TCisWeJXFKniGGOpBgMLmerfO2aCyCU5s7nJ/rpAepqmFifv/GCbSbueEeAJJnmSQ2rKC/g8Fcw==",
-            "dev": true,
-            "dependencies": {
-                "debug": "^4.1.0",
-                "detect-node": "^2.0.4",
-                "hpack.js": "^2.1.6",
-                "obuf": "^1.1.2",
-                "readable-stream": "^3.0.6",
-                "wbuf": "^1.7.3"
-            }
-        },
-        "node_modules/spdy-transport/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dev": true,
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/spdy/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dev": true,
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/split-on-first": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/split-on-first/-/split-on-first-1.1.0.tgz",
-            "integrity": "sha512-43ZssAJaMusuKWL8sKUBQXHWOpq8d6CfN/u1p4gUzfJkM05C8rxTmYrkIPTXapZpORA6LkkzcUulJ8FqA7Uudw==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/split-skip": {
-            "version": "0.0.2",
-            "resolved": "https://registry.npmjs.org/split-skip/-/split-skip-0.0.2.tgz",
-            "integrity": "sha1-2J2Iu9L3Pka1FYqjcKVhIk6A1GE="
-        },
-        "node_modules/split-string": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.1.0.tgz",
-            "integrity": "sha512-NzNVhJDYpwceVVii8/Hu6DKfD2G+NrQHlS/V/qgv763EYudVwEcMQNxd2lh+0VrUByXN/oJkl5grOhYWvQUYiw==",
-            "dependencies": {
-                "extend-shallow": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/sprintf-js": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
-            "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
-        },
-        "node_modules/sshpk": {
-            "version": "1.16.1",
-            "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.16.1.tgz",
-            "integrity": "sha512-HXXqVUq7+pcKeLqqZj6mHFUMvXtOJt1uoUx09pFW6011inTMxqI8BA8PM95myrIyyKwdnzjdFjLiE6KBPVtJIg==",
-            "dependencies": {
-                "asn1": "~0.2.3",
-                "assert-plus": "^1.0.0",
-                "bcrypt-pbkdf": "^1.0.0",
-                "dashdash": "^1.12.0",
-                "ecc-jsbn": "~0.1.1",
-                "getpass": "^0.1.1",
-                "jsbn": "~0.1.0",
-                "safer-buffer": "^2.0.2",
-                "tweetnacl": "~0.14.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/ssri": {
-            "version": "5.3.0",
-            "resolved": "https://registry.npmjs.org/ssri/-/ssri-5.3.0.tgz",
-            "integrity": "sha512-XRSIPqLij52MtgoQavH/x/dU1qVKtWUAAZeOHsR9c2Ddi4XerFy3mc1alf+dLJKl9EUIm/Ht+EowFkTUOA6GAQ==",
-            "dev": true,
-            "dependencies": {
-                "safe-buffer": "^5.1.1"
-            }
-        },
-        "node_modules/standard-error": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/standard-error/-/standard-error-1.1.0.tgz",
-            "integrity": "sha1-I+UWj6HAggGJ5YEnAaeQWFENDTQ="
-        },
-        "node_modules/standard-http-error": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/standard-http-error/-/standard-http-error-2.0.1.tgz",
-            "integrity": "sha1-+K6RcuPO+cs40ucIShkl9Xp8NL0=",
-            "dependencies": {
-                "standard-error": ">= 1.1.0 < 2"
-            }
-        },
-        "node_modules/static-extend": {
-            "version": "0.1.2",
-            "resolved": "https://registry.npmjs.org/static-extend/-/static-extend-0.1.2.tgz",
-            "integrity": "sha1-YICcOcv/VTNyJv1eC1IPNB8ftcY=",
-            "dependencies": {
-                "define-property": "^0.2.5",
-                "object-copy": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/static-extend/node_modules/define-property": {
-            "version": "0.2.5",
-            "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-            "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
-            "dependencies": {
-                "is-descriptor": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/statuses": {
-            "version": "1.5.0",
-            "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
-            "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=",
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/stdout-stream": {
-            "version": "1.4.1",
-            "resolved": "https://registry.npmjs.org/stdout-stream/-/stdout-stream-1.4.1.tgz",
-            "integrity": "sha512-j4emi03KXqJWcIeF8eIXkjMFN1Cmb8gUlDYGeBALLPo5qdyTfA9bOtl8m33lRoC+vFMkP3gl0WsDr6+gzxbbTA==",
-            "dependencies": {
-                "readable-stream": "^2.0.1"
-            }
-        },
-        "node_modules/stdout-stream/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/stealthy-require": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/stealthy-require/-/stealthy-require-1.1.1.tgz",
-            "integrity": "sha1-NbCYdbT/SfJqd35QmzCQoyJr8ks=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/stream-browserify": {
-            "version": "2.0.2",
-            "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.2.tgz",
-            "integrity": "sha512-nX6hmklHs/gr2FuxYDltq8fJA1GDlxKQCz8O/IM4atRqBH8OORmBNgfvW5gG10GT/qQ9u0CzIvr2X5Pkt6ntqg==",
-            "dev": true,
-            "dependencies": {
-                "inherits": "~2.0.1",
-                "readable-stream": "^2.0.2"
-            }
-        },
-        "node_modules/stream-browserify/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/stream-each": {
-            "version": "1.2.3",
-            "resolved": "https://registry.npmjs.org/stream-each/-/stream-each-1.2.3.tgz",
-            "integrity": "sha512-vlMC2f8I2u/bZGqkdfLQW/13Zihpej/7PmSiMQsbYddxuTsJp8vRe2x2FvVExZg7FaOds43ROAuFJwPR4MTZLw==",
-            "dev": true,
-            "dependencies": {
-                "end-of-stream": "^1.1.0",
-                "stream-shift": "^1.0.0"
-            }
-        },
-        "node_modules/stream-http": {
-            "version": "2.8.3",
-            "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.8.3.tgz",
-            "integrity": "sha512-+TSkfINHDo4J+ZobQLWiMouQYB+UVYFttRA94FpEzzJ7ZdqcL4uUUQ7WkdkI4DSozGmgBUE/a47L+38PenXhUw==",
-            "dev": true,
-            "dependencies": {
-                "builtin-status-codes": "^3.0.0",
-                "inherits": "^2.0.1",
-                "readable-stream": "^2.3.6",
-                "to-arraybuffer": "^1.0.0",
-                "xtend": "^4.0.0"
-            }
-        },
-        "node_modules/stream-http/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/stream-parser": {
-            "version": "0.3.1",
-            "resolved": "https://registry.npmjs.org/stream-parser/-/stream-parser-0.3.1.tgz",
-            "integrity": "sha1-FhhUhpRCACGhGC/wrxkRwSl2F3M=",
-            "dependencies": {
-                "debug": "2"
-            }
-        },
-        "node_modules/stream-parser/node_modules/debug": {
-            "version": "2.6.9",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/stream-parser/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-        },
-        "node_modules/stream-shift": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.1.tgz",
-            "integrity": "sha512-AiisoFqQ0vbGcZgQPY1cdP2I76glaVA/RauYR4G4thNFgkTqr90yXTo4LYX60Jl+sIlPNHHdGSwo01AvbKUSVQ==",
-            "dev": true
-        },
-        "node_modules/strict-uri-encode": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-2.0.0.tgz",
-            "integrity": "sha1-ucczDHBChi9rFC3CdLvMWGbONUY=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/string_decoder": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-            "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
-            "dependencies": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
-        "node_modules/string-width": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
-            "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
-            "dependencies": {
-                "is-fullwidth-code-point": "^2.0.0",
-                "strip-ansi": "^4.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/string.prototype.codepointat": {
-            "version": "0.2.1",
-            "resolved": "https://registry.npmjs.org/string.prototype.codepointat/-/string.prototype.codepointat-0.2.1.tgz",
-            "integrity": "sha512-2cBVCj6I4IOvEnjgO/hWqXjqBGsY+zwPmHl12Srk9IXSZ56Jwwmy+66XO5Iut/oQVR7t5ihYdLB0GMa4alEUcg=="
-        },
-        "node_modules/string.prototype.trimend": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.1.tgz",
-            "integrity": "sha512-LRPxFUaTtpqYsTeNKaFOw3R4bxIzWOnbQ837QfBylo8jIxtcbK/A/sMV7Q+OAV/vWo+7s25pOE10KYSjaSO06g==",
-            "dependencies": {
-                "define-properties": "^1.1.3",
-                "es-abstract": "^1.17.5"
-            }
-        },
-        "node_modules/string.prototype.trimleft": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/string.prototype.trimleft/-/string.prototype.trimleft-2.1.2.tgz",
-            "integrity": "sha512-gCA0tza1JBvqr3bfAIFJGqfdRTyPae82+KTnm3coDXkZN9wnuW3HjGgN386D7hfv5CHQYCI022/rJPVlqXyHSw==",
-            "dependencies": {
-                "define-properties": "^1.1.3",
-                "es-abstract": "^1.17.5",
-                "string.prototype.trimstart": "^1.0.0"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/string.prototype.trimright": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/string.prototype.trimright/-/string.prototype.trimright-2.1.2.tgz",
-            "integrity": "sha512-ZNRQ7sY3KroTaYjRS6EbNiiHrOkjihL9aQE/8gfQ4DtAC/aEBRHFJa44OmoWxGGqXuJlfKkZW4WcXErGr+9ZFg==",
-            "dependencies": {
-                "define-properties": "^1.1.3",
-                "es-abstract": "^1.17.5",
-                "string.prototype.trimend": "^1.0.0"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            }
-        },
-        "node_modules/string.prototype.trimstart": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.1.tgz",
-            "integrity": "sha512-XxZn+QpvrBI1FOcg6dIpxUPgWCPuNXvMD72aaRaUQv1eD4e/Qy8i/hFTe0BUmD60p/QA6bh1avmuPTfNjqVWRw==",
-            "dependencies": {
-                "define-properties": "^1.1.3",
-                "es-abstract": "^1.17.5"
-            }
-        },
-        "node_modules/stringify-parameters": {
-            "version": "0.0.4",
-            "resolved": "https://registry.npmjs.org/stringify-parameters/-/stringify-parameters-0.0.4.tgz",
-            "integrity": "sha512-H3L90ERn5UPtkpO8eugnKcLgpIVlvTyUTrcLGm607AV5JDH6z0GymtNLr3gjGlP6I6NB/mxNX9QpY6jEQGLPdQ==",
-            "dependencies": {
-                "magicli": "0.0.5",
-                "unpack-string": "0.0.2"
-            },
-            "bin": {
-                "stringify-parameters": "bin/cli.js"
-            }
-        },
-        "node_modules/stringify-parameters/node_modules/magicli": {
-            "version": "0.0.5",
-            "resolved": "https://registry.npmjs.org/magicli/-/magicli-0.0.5.tgz",
-            "integrity": "sha1-zufQ+7THBRiqyxHsPrfiX/SaSSE=",
-            "dependencies": {
-                "commander": "^2.9.0",
-                "get-stdin": "^5.0.1",
-                "inspect-function": "^0.2.1",
-                "pipe-functions": "^1.2.0"
-            }
-        },
-        "node_modules/strip-ansi": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
-            "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
-            "dependencies": {
-                "ansi-regex": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/strip-bom": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-            "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
-            "dependencies": {
-                "is-utf8": "^0.2.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/strip-eof": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
-            "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/strip-indent": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-1.0.1.tgz",
-            "integrity": "sha1-DHlipq3vp7vUrDZkYKY4VSrhoKI=",
-            "dependencies": {
-                "get-stdin": "^4.0.1"
-            },
-            "bin": {
-                "strip-indent": "cli.js"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/strip-indent/node_modules/get-stdin": {
-            "version": "4.0.1",
-            "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
-            "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/strip-json-comments": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
-            "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/style-loader": {
-            "version": "0.23.1",
-            "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.23.1.tgz",
-            "integrity": "sha512-XK+uv9kWwhZMZ1y7mysB+zoihsEj4wneFWAS5qoiLwzW0WzSqMrrsIy+a3zkQJq0ipFtBpX5W3MqyRIBF/WFGg==",
-            "dev": true,
-            "dependencies": {
-                "loader-utils": "^1.1.0",
-                "schema-utils": "^1.0.0"
-            },
-            "engines": {
-                "node": ">= 0.12.0"
-            }
-        },
-        "node_modules/style-loader/node_modules/schema-utils": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
-            "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
-            "dev": true,
-            "dependencies": {
-                "ajv": "^6.1.0",
-                "ajv-errors": "^1.0.0",
-                "ajv-keywords": "^3.1.0"
-            },
-            "engines": {
-                "node": ">= 4"
-            }
-        },
-        "node_modules/styled-components": {
-            "version": "4.4.1",
-            "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-4.4.1.tgz",
-            "integrity": "sha512-RNqj14kYzw++6Sr38n7197xG33ipEOktGElty4I70IKzQF1jzaD1U4xQ+Ny/i03UUhHlC5NWEO+d8olRCDji6g==",
-            "hasInstallScript": true,
-            "dependencies": {
-                "@babel/helper-module-imports": "^7.0.0",
-                "@babel/traverse": "^7.0.0",
-                "@emotion/is-prop-valid": "^0.8.1",
-                "@emotion/unitless": "^0.7.0",
-                "babel-plugin-styled-components": ">= 1",
-                "css-to-react-native": "^2.2.2",
-                "memoize-one": "^5.0.0",
-                "merge-anything": "^2.2.4",
-                "prop-types": "^15.5.4",
-                "react-is": "^16.6.0",
-                "stylis": "^3.5.0",
-                "stylis-rule-sheet": "^0.0.10",
-                "supports-color": "^5.5.0"
-            }
-        },
-        "node_modules/stylis": {
-            "version": "3.5.4",
-            "resolved": "https://registry.npmjs.org/stylis/-/stylis-3.5.4.tgz",
-            "integrity": "sha512-8/3pSmthWM7lsPBKv7NXkzn2Uc9W7NotcwGNpJaa3k7WMM1XDCA4MgT5k/8BIexd5ydZdboXtU90XH9Ec4Bv/Q=="
-        },
-        "node_modules/stylis-rule-sheet": {
-            "version": "0.0.10",
-            "resolved": "https://registry.npmjs.org/stylis-rule-sheet/-/stylis-rule-sheet-0.0.10.tgz",
-            "integrity": "sha512-nTbZoaqoBnmK+ptANthb10ZRZOGC+EmTLLUxeYIuHNkEKcmKgXX1XWKkUBT2Ac4es3NybooPe0SmvKdhKJZAuw=="
-        },
-        "node_modules/supports-color": {
-            "version": "5.5.0",
-            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
-            "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
-            "dependencies": {
-                "has-flag": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/symbol-observable": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.2.0.tgz",
-            "integrity": "sha512-e900nM8RRtGhlV36KGEU9k65K3mPb1WV70OdjfxlG2EAuM1noi/E/BaW/uMhL7bPEssK8QV57vN3esixjUvcXQ==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/symbol-tree": {
-            "version": "3.2.4",
-            "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
-            "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
-            "dev": true
-        },
-        "node_modules/table-layout": {
-            "version": "0.4.5",
-            "resolved": "https://registry.npmjs.org/table-layout/-/table-layout-0.4.5.tgz",
-            "integrity": "sha512-zTvf0mcggrGeTe/2jJ6ECkJHAQPIYEwDoqsiqBjI24mvRmQbInK5jq33fyypaCBxX08hMkfmdOqj6haT33EqWw==",
-            "dependencies": {
-                "array-back": "^2.0.0",
-                "deep-extend": "~0.6.0",
-                "lodash.padend": "^4.6.1",
-                "typical": "^2.6.1",
-                "wordwrapjs": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/tapable": {
-            "version": "1.1.3",
-            "resolved": "https://registry.npmjs.org/tapable/-/tapable-1.1.3.tgz",
-            "integrity": "sha512-4WK/bYZmj8xLr+HUCODHGF1ZFzsYffasLUgEiMBY4fgtltdO6B4WJtlSbPaDTLpYTcGVwM2qLnFTICEcNxs3kA==",
-            "dev": true,
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/tar": {
-            "version": "4.4.13",
-            "resolved": "https://registry.npmjs.org/tar/-/tar-4.4.13.tgz",
-            "integrity": "sha512-w2VwSrBoHa5BsSyH+KxEqeQBAllHhccyMFVHtGtdMpF4W7IRWfZjFiQceJPChOeTsSDVUpER2T8FA93pr0L+QA==",
-            "dependencies": {
-                "chownr": "^1.1.1",
-                "fs-minipass": "^1.2.5",
-                "minipass": "^2.8.6",
-                "minizlib": "^1.2.1",
-                "mkdirp": "^0.5.0",
-                "safe-buffer": "^5.1.2",
-                "yallist": "^3.0.3"
-            },
-            "engines": {
-                "node": ">=4.5"
-            }
-        },
-        "node_modules/tar-fs": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.0.1.tgz",
-            "integrity": "sha512-6tzWDMeroL87uF/+lin46k+Q+46rAJ0SyPGz7OW7wTgblI273hsBqk2C1j0/xNadNLKDTUL9BukSjB7cwgmlPA==",
-            "dependencies": {
-                "chownr": "^1.1.1",
-                "mkdirp-classic": "^0.5.2",
-                "pump": "^3.0.0",
-                "tar-stream": "^2.0.0"
-            }
-        },
-        "node_modules/tar-stream": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-2.1.2.tgz",
-            "integrity": "sha512-UaF6FoJ32WqALZGOIAApXx+OdxhekNMChu6axLJR85zMMjXKWFGjbIRe+J6P4UnRGg9rAwWvbTT0oI7hD/Un7Q==",
-            "dependencies": {
-                "bl": "^4.0.1",
-                "end-of-stream": "^1.4.1",
-                "fs-constants": "^1.0.0",
-                "inherits": "^2.0.3",
-                "readable-stream": "^3.1.1"
-            }
-        },
-        "node_modules/temp-dir": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/temp-dir/-/temp-dir-1.0.0.tgz",
-            "integrity": "sha1-CnwOom06Oa+n4OvqnB/AvE2qAR0=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/tempy": {
-            "version": "0.2.1",
-            "resolved": "https://registry.npmjs.org/tempy/-/tempy-0.2.1.tgz",
-            "integrity": "sha512-LB83o9bfZGrntdqPuRdanIVCPReam9SOZKW0fOy5I9X3A854GGWi0tjCqoXEk84XIEYBc/x9Hq3EFop/H5wJaw==",
-            "dependencies": {
-                "temp-dir": "^1.0.0",
-                "unique-string": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/term-size": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/term-size/-/term-size-1.2.0.tgz",
-            "integrity": "sha1-RYuDiH8oj8Vtb/+/rSYuJmOO+mk=",
-            "dependencies": {
-                "execa": "^0.7.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/terser": {
-            "version": "4.8.0",
-            "resolved": "https://registry.npmjs.org/terser/-/terser-4.8.0.tgz",
-            "integrity": "sha512-EAPipTNeWsb/3wLPeup1tVPaXfIaU68xMnVdPafIL1TV05OhASArYyIfFvnvJCNrR2NIOvDVNNTFRa+Re2MWyw==",
-            "dev": true,
-            "dependencies": {
-                "commander": "^2.20.0",
-                "source-map": "~0.6.1",
-                "source-map-support": "~0.5.12"
-            },
-            "bin": {
-                "terser": "bin/terser"
-            },
-            "engines": {
-                "node": ">=6.0.0"
-            }
-        },
-        "node_modules/terser-webpack-plugin": {
-            "version": "1.4.5",
-            "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-1.4.5.tgz",
-            "integrity": "sha512-04Rfe496lN8EYruwi6oPQkG0vo8C+HT49X687FZnpPF0qMAIHONI6HEXYPKDOE8e5HjXTyKfqRd/agHtH0kOtw==",
-            "dev": true,
-            "dependencies": {
-                "cacache": "^12.0.2",
-                "find-cache-dir": "^2.1.0",
-                "is-wsl": "^1.1.0",
-                "schema-utils": "^1.0.0",
-                "serialize-javascript": "^4.0.0",
-                "source-map": "^0.6.1",
-                "terser": "^4.1.2",
-                "webpack-sources": "^1.4.0",
-                "worker-farm": "^1.7.0"
-            },
-            "engines": {
-                "node": ">= 6.9.0"
-            }
-        },
-        "node_modules/terser-webpack-plugin/node_modules/cacache": {
-            "version": "12.0.4",
-            "resolved": "https://registry.npmjs.org/cacache/-/cacache-12.0.4.tgz",
-            "integrity": "sha512-a0tMB40oefvuInr4Cwb3GerbL9xTj1D5yg0T5xrjGCGyfvbxseIXX7BAO/u/hIXdafzOI5JC3wDwHyf24buOAQ==",
-            "dev": true,
-            "dependencies": {
-                "bluebird": "^3.5.5",
-                "chownr": "^1.1.1",
-                "figgy-pudding": "^3.5.1",
-                "glob": "^7.1.4",
-                "graceful-fs": "^4.1.15",
-                "infer-owner": "^1.0.3",
-                "lru-cache": "^5.1.1",
-                "mississippi": "^3.0.0",
-                "mkdirp": "^0.5.1",
-                "move-concurrently": "^1.0.1",
-                "promise-inflight": "^1.0.1",
-                "rimraf": "^2.6.3",
-                "ssri": "^6.0.1",
-                "unique-filename": "^1.1.1",
-                "y18n": "^4.0.0"
-            }
-        },
-        "node_modules/terser-webpack-plugin/node_modules/find-cache-dir": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-2.1.0.tgz",
-            "integrity": "sha512-Tq6PixE0w/VMFfCgbONnkiQIVol/JJL7nRMi20fqzA4NRs9AfeqMGeRdPi3wIhYkxjeBaWh2rxwapn5Tu3IqOQ==",
-            "dev": true,
-            "dependencies": {
-                "commondir": "^1.0.1",
-                "make-dir": "^2.0.0",
-                "pkg-dir": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/terser-webpack-plugin/node_modules/make-dir": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
-            "integrity": "sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==",
-            "dev": true,
-            "dependencies": {
-                "pify": "^4.0.1",
-                "semver": "^5.6.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/terser-webpack-plugin/node_modules/mississippi": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/mississippi/-/mississippi-3.0.0.tgz",
-            "integrity": "sha512-x471SsVjUtBRtcvd4BzKE9kFC+/2TeWgKCgw0bZcw1b9l2X3QX5vCWgF+KaZaYm87Ss//rHnWryupDrgLvmSkA==",
-            "dev": true,
-            "dependencies": {
-                "concat-stream": "^1.5.0",
-                "duplexify": "^3.4.2",
-                "end-of-stream": "^1.1.0",
-                "flush-write-stream": "^1.0.0",
-                "from2": "^2.1.0",
-                "parallel-transform": "^1.1.0",
-                "pump": "^3.0.0",
-                "pumpify": "^1.3.3",
-                "stream-each": "^1.1.0",
-                "through2": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/terser-webpack-plugin/node_modules/pkg-dir": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-3.0.0.tgz",
-            "integrity": "sha512-/E57AYkoeQ25qkxMj5PBOVgF8Kiu/h7cYS30Z5+R7WaiCCBfLq58ZI/dSeaEKb9WVJV5n/03QwrN3IeWIFllvw==",
-            "dev": true,
-            "dependencies": {
-                "find-up": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/terser-webpack-plugin/node_modules/rimraf": {
-            "version": "2.7.1",
-            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-            "dev": true,
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/terser-webpack-plugin/node_modules/serialize-javascript": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-4.0.0.tgz",
-            "integrity": "sha512-GaNA54380uFefWghODBWEGisLZFj00nS5ACs6yHa9nLqlLpVLO8ChDGeKRjZnV4Nh4n0Qi7nhYZD/9fCPzEqkw==",
-            "dev": true,
-            "dependencies": {
-                "randombytes": "^2.1.0"
-            }
-        },
-        "node_modules/terser-webpack-plugin/node_modules/source-map": {
-            "version": "0.6.1",
-            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/terser-webpack-plugin/node_modules/ssri": {
-            "version": "6.0.2",
-            "resolved": "https://registry.npmjs.org/ssri/-/ssri-6.0.2.tgz",
-            "integrity": "sha512-cepbSq/neFK7xB6A50KHN0xHDotYzq58wWCa5LeWqnPrHG8GzfEjO/4O8kpmcGW+oaxkvhEJCWgbgNk4/ZV93Q==",
-            "dev": true,
-            "dependencies": {
-                "figgy-pudding": "^3.5.1"
-            }
-        },
-        "node_modules/terser/node_modules/source-map": {
-            "version": "0.6.1",
-            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/textarea-caret": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/textarea-caret/-/textarea-caret-3.1.0.tgz",
-            "integrity": "sha512-cXAvzO9pP5CGa6NKx0WYHl+8CHKZs8byMkt3PCJBCmq2a34YA9pO1NrQET5pzeqnBjBdToF5No4rrmkDUgQC2Q=="
-        },
-        "node_modules/three": {
-            "version": "0.127.0",
-            "resolved": "https://registry.npmjs.org/three/-/three-0.127.0.tgz",
-            "integrity": "sha512-wtgrn+mhYUbobxT7QN3GPdu3SRpSBQvwY6uOzLChWS7QE//f7paDU/+wlzbg+ngeIvBBqjBHSRuywTh8A99Jng=="
-        },
-        "node_modules/through": {
-            "version": "2.3.8",
-            "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
-            "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU="
-        },
-        "node_modules/through2": {
-            "version": "2.0.5",
-            "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.5.tgz",
-            "integrity": "sha512-/mrRod8xqpA+IHSLyGCQ2s8SPHiCDEeQJSep1jqLYeEUClOFG2Qsh+4FU6G9VeqpZnGW/Su8LQGc4YKni5rYSQ==",
-            "dev": true,
-            "dependencies": {
-                "readable-stream": "~2.3.6",
-                "xtend": "~4.0.1"
-            }
-        },
-        "node_modules/through2/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/thunky": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/thunky/-/thunky-1.1.0.tgz",
-            "integrity": "sha512-eHY7nBftgThBqOyHGVN+l8gF0BucP09fMo0oO/Lb0w1OF80dJv+lDVpXG60WMQvkcxAkNybKsrEIE3ZtKGmPrA==",
-            "dev": true
-        },
-        "node_modules/timed-out": {
-            "version": "4.0.1",
-            "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz",
-            "integrity": "sha1-8y6srFoXW+ol1/q1Zas+2HQe9W8=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/timers-browserify": {
-            "version": "2.0.12",
-            "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.12.tgz",
-            "integrity": "sha512-9phl76Cqm6FhSX9Xe1ZUAMLtm1BLkKj2Qd5ApyWkXzsMRaA7dgr81kf4wJmQf/hAvg8EEyJxDo3du/0KlhPiKQ==",
-            "dev": true,
-            "dependencies": {
-                "setimmediate": "^1.0.4"
-            },
-            "engines": {
-                "node": ">=0.6.0"
-            }
-        },
-        "node_modules/tiny-inflate": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/tiny-inflate/-/tiny-inflate-1.0.3.tgz",
-            "integrity": "sha512-pkY1fj1cKHb2seWDy0B16HeWyczlJA9/WW3u3c4z/NiWDsO3DOU5D7nhTLE9CF0yXv/QZFY7sEJmj24dK+Rrqw=="
-        },
-        "node_modules/tiny-invariant": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.1.0.tgz",
-            "integrity": "sha512-ytxQvrb1cPc9WBEI/HSeYYoGD0kWnGEOR8RY6KomWLBVhqz0RgTwVO9dLrGz7dC+nN9llyI7OKAgRq8Vq4ZBSw=="
-        },
-        "node_modules/tiny-warning": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz",
-            "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA=="
-        },
-        "node_modules/tinycolor2": {
-            "version": "1.4.1",
-            "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.4.1.tgz",
-            "integrity": "sha1-9PrTM0R7wLB9TcjpIJ2POaisd+g=",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/to-array": {
-            "version": "0.1.4",
-            "resolved": "https://registry.npmjs.org/to-array/-/to-array-0.1.4.tgz",
-            "integrity": "sha1-F+bBH3PdTz10zaek/zI46a2b+JA="
-        },
-        "node_modules/to-arraybuffer": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz",
-            "integrity": "sha1-fSKbH8xjfkZsoIEYCDanqr/4P0M=",
-            "dev": true
-        },
-        "node_modules/to-fast-properties": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
-            "integrity": "sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/to-object-path": {
-            "version": "0.3.0",
-            "resolved": "https://registry.npmjs.org/to-object-path/-/to-object-path-0.3.0.tgz",
-            "integrity": "sha1-KXWIt7Dn4KwI4E5nL4XB9JmeF68=",
-            "dependencies": {
-                "kind-of": "^3.0.2"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/to-object-path/node_modules/is-buffer": {
-            "version": "1.1.6",
-            "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
-            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
-        },
-        "node_modules/to-object-path/node_modules/kind-of": {
-            "version": "3.2.2",
-            "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-            "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-            "dependencies": {
-                "is-buffer": "^1.1.5"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/to-regex": {
-            "version": "3.0.2",
-            "resolved": "https://registry.npmjs.org/to-regex/-/to-regex-3.0.2.tgz",
-            "integrity": "sha512-FWtleNAtZ/Ki2qtqej2CXTOayOH9bHDQF+Q48VpWyDXjbYxA4Yz8iDB31zXOBUlOHHKidDbqGVrTUvQMPmBGBw==",
-            "dependencies": {
-                "define-property": "^2.0.2",
-                "extend-shallow": "^3.0.2",
-                "regex-not": "^1.0.2",
-                "safe-regex": "^1.1.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/to-regex-range": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-2.1.1.tgz",
-            "integrity": "sha1-fIDBe53+vlmeJzZ+DU3VWQFB2zg=",
-            "dependencies": {
-                "is-number": "^3.0.0",
-                "repeat-string": "^1.6.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/toidentifier": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz",
-            "integrity": "sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==",
-            "engines": {
-                "node": ">=0.6"
-            }
-        },
-        "node_modules/token-stream": {
-            "version": "0.0.1",
-            "resolved": "https://registry.npmjs.org/token-stream/-/token-stream-0.0.1.tgz",
-            "integrity": "sha1-zu78cXp2xDFvEm0LnbqlXX598Bo="
-        },
-        "node_modules/touch": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/touch/-/touch-3.1.0.tgz",
-            "integrity": "sha512-WBx8Uy5TLtOSRtIq+M03/sKDrXCLHxwDcquSP2c43Le03/9serjQBIztjRz6FkJez9D/hleyAXTBGLwwZUw9lA==",
-            "dependencies": {
-                "nopt": "~1.0.10"
-            },
-            "bin": {
-                "nodetouch": "bin/nodetouch.js"
-            }
-        },
-        "node_modules/touch/node_modules/nopt": {
-            "version": "1.0.10",
-            "resolved": "https://registry.npmjs.org/nopt/-/nopt-1.0.10.tgz",
-            "integrity": "sha1-bd0hvSoxQXuScn3Vhfim83YI6+4=",
-            "dependencies": {
-                "abbrev": "1"
-            },
-            "bin": {
-                "nopt": "bin/nopt.js"
-            }
-        },
-        "node_modules/tough-cookie": {
-            "version": "2.5.0",
-            "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.5.0.tgz",
-            "integrity": "sha512-nlLsUzgm1kfLXSXfRZMc1KLAugd4hqJHDTvc2hDIwS3mZAfMEuMbc03SujMF+GEcpaX/qboeycw6iO8JwVv2+g==",
-            "dependencies": {
-                "psl": "^1.1.28",
-                "punycode": "^2.1.1"
-            },
-            "engines": {
-                "node": ">=0.8"
-            }
-        },
-        "node_modules/tr46": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/tr46/-/tr46-1.0.1.tgz",
-            "integrity": "sha1-qLE/1r/SSJUZZ0zN5VujaTtwbQk=",
-            "dev": true,
-            "dependencies": {
-                "punycode": "^2.1.0"
-            }
-        },
-        "node_modules/translate-google-api": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/translate-google-api/-/translate-google-api-1.0.4.tgz",
-            "integrity": "sha512-KVXmo4+64/H1vIbnzf2zNiJ2JLeEB3jrEnNRP2EFNAGNqna/5bmw/Cps3pCHu0n3BzTOoWh9u6wFvrRYdzQ6Iw==",
-            "dependencies": {
-                "axios": "^0.20.0"
-            }
-        },
-        "node_modules/translate-google-api/node_modules/axios": {
-            "version": "0.20.0",
-            "resolved": "https://registry.npmjs.org/axios/-/axios-0.20.0.tgz",
-            "integrity": "sha512-ANA4rr2BDcmmAQLOKft2fufrtuvlqR+cXNNinUmvfeSNCOF98PZL+7M/v1zIdGo7OLjEA9J2gXJL+j4zGsl0bA==",
-            "dependencies": {
-                "follow-redirects": "^1.10.0"
-            }
-        },
-        "node_modules/traverse-chain": {
-            "version": "0.1.0",
-            "resolved": "https://registry.npmjs.org/traverse-chain/-/traverse-chain-0.1.0.tgz",
-            "integrity": "sha1-YdvC1Ttp/2CRoSoWj9fUMxB+QPE="
-        },
-        "node_modules/tree-kill": {
-            "version": "1.2.2",
-            "resolved": "https://registry.npmjs.org/tree-kill/-/tree-kill-1.2.2.tgz",
-            "integrity": "sha512-L0Orpi8qGpRG//Nd+H90vFB+3iHnue1zSSGmNOOCh1GLJ7rUKVwV2HvijphGQS2UmhUZewS9VgvxYIdgr+fG1A==",
-            "dev": true,
-            "bin": {
-                "tree-kill": "cli.js"
-            }
-        },
-        "node_modules/trim-newlines": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-1.0.0.tgz",
-            "integrity": "sha1-WIeWa7WCpFA6QetST301ARgVphM=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/true-case-path": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/true-case-path/-/true-case-path-1.0.3.tgz",
-            "integrity": "sha512-m6s2OdQe5wgpFMC+pAJ+q9djG82O2jcHPOI6RNg1yy9rCYR+WD6Nbpl32fDpfC56nirdRy+opFa/Vk7HYhqaew==",
-            "dependencies": {
-                "glob": "^7.1.2"
-            }
-        },
-        "node_modules/tryit": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/tryit/-/tryit-1.0.3.tgz",
-            "integrity": "sha1-OTvnMKlEb9Hq1tpZoBQwjzbCics="
-        },
-        "node_modules/ts-loader": {
-            "version": "5.4.5",
-            "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-5.4.5.tgz",
-            "integrity": "sha512-XYsjfnRQCBum9AMRZpk2rTYSVpdZBpZK+kDh0TeT3kxmQNBDVIeUjdPjY5RZry4eIAb8XHc4gYSUiUWPYvzSRw==",
-            "dev": true,
-            "dependencies": {
-                "chalk": "^2.3.0",
-                "enhanced-resolve": "^4.0.0",
-                "loader-utils": "^1.0.2",
-                "micromatch": "^3.1.4",
-                "semver": "^5.0.1"
-            },
-            "engines": {
-                "node": ">=6.11.5"
-            }
-        },
-        "node_modules/ts-node": {
-            "version": "7.0.1",
-            "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-7.0.1.tgz",
-            "integrity": "sha512-BVwVbPJRspzNh2yfslyT1PSbl5uIk03EZlb493RKHN4qej/D06n1cEhjlOJG69oFsE7OT8XjpTUcYf6pKTLMhw==",
-            "dev": true,
-            "dependencies": {
-                "arrify": "^1.0.0",
-                "buffer-from": "^1.1.0",
-                "diff": "^3.1.0",
-                "make-error": "^1.1.1",
-                "minimist": "^1.2.0",
-                "mkdirp": "^0.5.1",
-                "source-map-support": "^0.5.6",
-                "yn": "^2.0.0"
-            },
-            "bin": {
-                "ts-node": "dist/bin.js"
-            },
-            "engines": {
-                "node": ">=4.2.0"
-            }
-        },
-        "node_modules/ts-node-dev": {
-            "version": "1.0.0-pre.49",
-            "resolved": "https://registry.npmjs.org/ts-node-dev/-/ts-node-dev-1.0.0-pre.49.tgz",
-            "integrity": "sha512-iJd4QPPOaCAByl/WuEdmDX8xDR2GmoWYu6aKvGudGUcfP1sJRjpaHb7oFDuvBspQF1xhxUdbjfHuvEtZPwKZFQ==",
-            "dev": true,
-            "dependencies": {
-                "chokidar": "^3.4.0",
-                "dateformat": "~1.0.4-1.2.3",
-                "dynamic-dedupe": "^0.3.0",
-                "minimist": "^1.2.5",
-                "mkdirp": "^1.0.4",
-                "node-notifier": "^5.4.0",
-                "resolve": "^1.0.0",
-                "rimraf": "^2.6.1",
-                "source-map-support": "^0.5.12",
-                "tree-kill": "^1.2.2",
-                "ts-node": "^8.10.2",
-                "tsconfig": "^7.0.0"
-            },
-            "bin": {
-                "ts-node-dev": "bin/ts-node-dev",
-                "tsnd": "bin/ts-node-dev"
-            },
-            "engines": {
-                "node": ">=0.8.0"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/anymatch": {
-            "version": "3.1.1",
-            "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.1.tgz",
-            "integrity": "sha512-mM8522psRCqzV+6LhomX5wgp25YVibjh8Wj23I5RPkPppSVSjyKD2A2mBJmWGa+KN7f2D6LNh9jkBCeyLktzjg==",
-            "dev": true,
-            "dependencies": {
-                "normalize-path": "^3.0.0",
-                "picomatch": "^2.0.4"
-            },
-            "engines": {
-                "node": ">= 8"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/binary-extensions": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.0.0.tgz",
-            "integrity": "sha512-Phlt0plgpIIBOGTT/ehfFnbNlfsDEiqmzE2KRXoX1bLIlir4X/MR+zSyBEkL05ffWgnRSf/DXv+WrUAVr93/ow==",
-            "dev": true,
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/braces": {
-            "version": "3.0.2",
-            "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
-            "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
-            "dev": true,
-            "dependencies": {
-                "fill-range": "^7.0.1"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/chokidar": {
-            "version": "3.4.0",
-            "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.4.0.tgz",
-            "integrity": "sha512-aXAaho2VJtisB/1fg1+3nlLJqGOuewTzQpd/Tz0yTg2R0e4IGtshYvtjowyEumcBv2z+y4+kc75Mz7j5xJskcQ==",
-            "dev": true,
-            "dependencies": {
-                "anymatch": "~3.1.1",
-                "braces": "~3.0.2",
-                "glob-parent": "~5.1.0",
-                "is-binary-path": "~2.1.0",
-                "is-glob": "~4.0.1",
-                "normalize-path": "~3.0.0",
-                "readdirp": "~3.4.0"
-            },
-            "engines": {
-                "node": ">= 8.10.0"
-            },
-            "optionalDependencies": {
-                "fsevents": "~2.1.2"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/diff": {
-            "version": "4.0.2",
-            "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
-            "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.3.1"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/fill-range": {
-            "version": "7.0.1",
-            "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
-            "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
-            "dev": true,
-            "dependencies": {
-                "to-regex-range": "^5.0.1"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/glob-parent": {
-            "version": "5.1.1",
-            "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.1.tgz",
-            "integrity": "sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==",
-            "dev": true,
-            "dependencies": {
-                "is-glob": "^4.0.1"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/is-binary-path": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
-            "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
-            "dev": true,
-            "dependencies": {
-                "binary-extensions": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/is-number": {
-            "version": "7.0.0",
-            "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
-            "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.12.0"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/mkdirp": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz",
-            "integrity": "sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==",
-            "dev": true,
-            "bin": {
-                "mkdirp": "bin/cmd.js"
-            },
-            "engines": {
-                "node": ">=10"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/readdirp": {
-            "version": "3.4.0",
-            "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.4.0.tgz",
-            "integrity": "sha512-0xe001vZBnJEK+uKcj8qOhyAKPzIT+gStxWr3LCB0DwcXR5NZJ3IaC+yGnHCYzB/S7ov3m3EEbZI2zeNvX+hGQ==",
-            "dev": true,
-            "dependencies": {
-                "picomatch": "^2.2.1"
-            },
-            "engines": {
-                "node": ">=8.10.0"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/rimraf": {
-            "version": "2.7.1",
-            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-            "dev": true,
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/to-regex-range": {
-            "version": "5.0.1",
-            "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
-            "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
-            "dev": true,
-            "dependencies": {
-                "is-number": "^7.0.0"
-            },
-            "engines": {
-                "node": ">=8.0"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/ts-node": {
-            "version": "8.10.2",
-            "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-8.10.2.tgz",
-            "integrity": "sha512-ISJJGgkIpDdBhWVu3jufsWpK3Rzo7bdiIXJjQc0ynKxVOVcg2oIrf2H2cejminGrptVc6q6/uynAHNCuWGbpVA==",
-            "dev": true,
-            "dependencies": {
-                "arg": "^4.1.0",
-                "diff": "^4.0.1",
-                "make-error": "^1.1.1",
-                "source-map-support": "^0.5.17",
-                "yn": "3.1.1"
-            },
-            "bin": {
-                "ts-node": "dist/bin.js",
-                "ts-node-script": "dist/bin-script.js",
-                "ts-node-transpile-only": "dist/bin-transpile.js",
-                "ts-script": "dist/bin-script-deprecated.js"
-            },
-            "engines": {
-                "node": ">=6.0.0"
-            }
-        },
-        "node_modules/ts-node-dev/node_modules/yn": {
-            "version": "3.1.1",
-            "resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz",
-            "integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==",
-            "dev": true,
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/ts-node/node_modules/arrify": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
-            "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/tsconfig": {
-            "version": "7.0.0",
-            "resolved": "https://registry.npmjs.org/tsconfig/-/tsconfig-7.0.0.tgz",
-            "integrity": "sha512-vZXmzPrL+EmC4T/4rVlT2jNVMWCi/O4DIiSj3UHg1OE5kCKbk4mfrXc6dZksLgRM/TZlKnousKH9bbTazUWRRw==",
-            "dev": true,
-            "dependencies": {
-                "@types/strip-bom": "^3.0.0",
-                "@types/strip-json-comments": "0.0.30",
-                "strip-bom": "^3.0.0",
-                "strip-json-comments": "^2.0.0"
-            }
-        },
-        "node_modules/tsconfig/node_modules/strip-bom": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
-            "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM=",
-            "dev": true,
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/tslib": {
-            "version": "1.11.1",
-            "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.11.1.tgz",
-            "integrity": "sha512-aZW88SY8kQbU7gpV19lN24LtXh/yD4ZZg6qieAJDDg+YBsJcSmLGK9QpnUjAKVG/xefmvJGd1WUmfpT/g6AJGA==",
-            "dev": true
-        },
-        "node_modules/tslint": {
-            "version": "5.20.1",
-            "resolved": "https://registry.npmjs.org/tslint/-/tslint-5.20.1.tgz",
-            "integrity": "sha512-EcMxhzCFt8k+/UP5r8waCf/lzmeSyVlqxqMEDQE7rWYiQky8KpIBz1JAoYXfROHrPZ1XXd43q8yQnULOLiBRQg==",
-            "dev": true,
-            "dependencies": {
-                "@babel/code-frame": "^7.0.0",
-                "builtin-modules": "^1.1.1",
-                "chalk": "^2.3.0",
-                "commander": "^2.12.1",
-                "diff": "^4.0.1",
-                "glob": "^7.1.1",
-                "js-yaml": "^3.13.1",
-                "minimatch": "^3.0.4",
-                "mkdirp": "^0.5.1",
-                "resolve": "^1.3.2",
-                "semver": "^5.3.0",
-                "tslib": "^1.8.0",
-                "tsutils": "^2.29.0"
-            },
-            "bin": {
-                "tslint": "bin/tslint"
-            },
-            "engines": {
-                "node": ">=4.8.0"
-            }
-        },
-        "node_modules/tslint-loader": {
-            "version": "3.6.0",
-            "resolved": "https://registry.npmjs.org/tslint-loader/-/tslint-loader-3.6.0.tgz",
-            "integrity": "sha512-Me9Qf/87BOfCY8uJJw+J7VMF4U8WiMXKLhKKKugMydF0xMhMOt9wo2mjYTNhwbF9H7SHh8PAIwRG8roisTNekQ==",
-            "dev": true,
-            "dependencies": {
-                "loader-utils": "^1.0.2",
-                "mkdirp": "^0.5.1",
-                "object-assign": "^4.1.1",
-                "rimraf": "^2.4.4",
-                "semver": "^5.3.0"
-            }
-        },
-        "node_modules/tslint-loader/node_modules/rimraf": {
-            "version": "2.7.1",
-            "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-            "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-            "dev": true,
-            "dependencies": {
-                "glob": "^7.1.3"
-            },
-            "bin": {
-                "rimraf": "bin.js"
-            }
-        },
-        "node_modules/tslint/node_modules/diff": {
-            "version": "4.0.2",
-            "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
-            "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.3.1"
-            }
-        },
-        "node_modules/tsscmp": {
-            "version": "1.0.6",
-            "resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.6.tgz",
-            "integrity": "sha512-LxhtAkPDTkVCMQjt2h6eBVY28KCjikZqZfMcC15YBeNjkgUpdCfBu5HoiOTDu86v6smE8yOjyEktJ8hlbANHQA==",
-            "engines": {
-                "node": ">=0.6.x"
-            }
-        },
-        "node_modules/tsutils": {
-            "version": "2.29.0",
-            "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.29.0.tgz",
-            "integrity": "sha512-g5JVHCIJwzfISaXpXE1qvNalca5Jwob6FjI4AoPlqMusJ6ftFE7IkkFoMhVLRgK+4Kx3gkzb8UZK5t5yTTvEmA==",
-            "dev": true,
-            "dependencies": {
-                "tslib": "^1.8.1"
-            }
-        },
-        "node_modules/tty-browserify": {
-            "version": "0.0.0",
-            "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz",
-            "integrity": "sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY=",
-            "dev": true
-        },
-        "node_modules/tunnel-agent": {
-            "version": "0.6.0",
-            "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
-            "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0=",
-            "dependencies": {
-                "safe-buffer": "^5.0.1"
-            },
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/tweetnacl": {
-            "version": "0.14.5",
-            "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
-            "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q="
-        },
-        "node_modules/type": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/type/-/type-1.2.0.tgz",
-            "integrity": "sha512-+5nt5AAniqsCnu2cEQQdpzCAh33kVx8n0VoFidKpB1dVVLAN/F+bgVOqOJqOnEnrhp222clB5p3vUlD+1QAnfg==",
-            "dev": true
-        },
-        "node_modules/type-check": {
-            "version": "0.3.2",
-            "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz",
-            "integrity": "sha1-WITKtRLPHTVeP7eE8wgEsrUg23I=",
-            "dev": true,
-            "dependencies": {
-                "prelude-ls": "~1.1.2"
-            },
-            "engines": {
-                "node": ">= 0.8.0"
-            }
-        },
-        "node_modules/type-detect": {
-            "version": "4.0.8",
-            "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.8.tgz",
-            "integrity": "sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g==",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/type-is": {
-            "version": "1.6.18",
-            "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz",
-            "integrity": "sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==",
-            "dependencies": {
-                "media-typer": "0.3.0",
-                "mime-types": "~2.1.24"
-            },
-            "engines": {
-                "node": ">= 0.6"
-            }
-        },
-        "node_modules/typed-styles": {
-            "version": "0.0.7",
-            "resolved": "https://registry.npmjs.org/typed-styles/-/typed-styles-0.0.7.tgz",
-            "integrity": "sha512-pzP0PWoZUhsECYjABgCGQlRGL1n7tOHsgwYv3oIiEpJwGhFTuty/YNeduxQYzXXa3Ge5BdT6sHYIQYpl4uJ+5Q=="
-        },
-        "node_modules/typedarray": {
-            "version": "0.0.6",
-            "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
-            "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
-        },
-        "node_modules/typescript": {
-            "version": "3.9.9",
-            "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.9.tgz",
-            "integrity": "sha512-kdMjTiekY+z/ubJCATUPlRDl39vXYiMV9iyeMuEuXZh2we6zz80uovNN2WlAxmmdE/Z/YQe+EbOEXB5RHEED3w==",
-            "dev": true,
-            "bin": {
-                "tsc": "bin/tsc",
-                "tsserver": "bin/tsserver"
-            },
-            "engines": {
-                "node": ">=4.2.0"
-            }
-        },
-        "node_modules/typescript-collections": {
-            "version": "1.3.3",
-            "resolved": "https://registry.npmjs.org/typescript-collections/-/typescript-collections-1.3.3.tgz",
-            "integrity": "sha512-7sI4e/bZijOzyURng88oOFZCISQPTHozfE2sUu5AviFYk5QV7fYGb6YiDl+vKjF/pICA354JImBImL9XJWUvdQ=="
-        },
-        "node_modules/typescript-language-server": {
-            "version": "0.4.0",
-            "resolved": "https://registry.npmjs.org/typescript-language-server/-/typescript-language-server-0.4.0.tgz",
-            "integrity": "sha512-K8jNOmDFn+QfrCh8ujby2pGDs5rpjYZQn+zvQnf42rxG4IHbfw5CHoMvbGkWPK/J5Gw8/l5K3i03kVZC2IBElg==",
-            "dependencies": {
-                "command-exists": "1.2.6",
-                "commander": "^2.11.0",
-                "fs-extra": "^7.0.0",
-                "p-debounce": "^1.0.0",
-                "tempy": "^0.2.1",
-                "vscode-languageserver": "^5.3.0-next",
-                "vscode-uri": "^1.0.5"
-            },
-            "bin": {
-                "typescript-language-server": "lib/cli.js"
-            }
-        },
-        "node_modules/typescript-language-server/node_modules/fs-extra": {
-            "version": "7.0.1",
-            "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-7.0.1.tgz",
-            "integrity": "sha512-YJDaCJZEnBmcbw13fvdAM9AwNOJwOzrE4pqMqBq5nFiEqXUqHwlK4B+3pUw6JNvfSPtX05xFHtYy/1ni01eGCw==",
-            "dependencies": {
-                "graceful-fs": "^4.1.2",
-                "jsonfile": "^4.0.0",
-                "universalify": "^0.1.0"
-            },
-            "engines": {
-                "node": ">=6 <7 || >=8"
-            }
-        },
-        "node_modules/typescript-language-server/node_modules/jsonfile": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
-            "integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss=",
-            "dependencies": {
-                "graceful-fs": "^4.1.6"
-            }
-        },
-        "node_modules/typical": {
-            "version": "2.6.1",
-            "resolved": "https://registry.npmjs.org/typical/-/typical-2.6.1.tgz",
-            "integrity": "sha1-XAgOXWYcu+OCWdLnCjxyU+hziB0="
-        },
-        "node_modules/ua-parser-js": {
-            "version": "0.7.21",
-            "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.21.tgz",
-            "integrity": "sha512-+O8/qh/Qj8CgC6eYBVBykMrNtp5Gebn4dlGD/kKXVkJNDwyrAwSIqwz8CDf+tsAIWVycKcku6gIXJ0qwx/ZXaQ==",
-            "engines": {
-                "node": "*"
-            }
-        },
-        "node_modules/uglify-js": {
-            "version": "2.8.29",
-            "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz",
-            "integrity": "sha1-KcVzMUgFe7Th913zW3qcty5qWd0=",
-            "dependencies": {
-                "source-map": "~0.5.1",
-                "yargs": "~3.10.0"
-            },
-            "bin": {
-                "uglifyjs": "bin/uglifyjs"
-            },
-            "engines": {
-                "node": ">=0.8.0"
-            },
-            "optionalDependencies": {
-                "uglify-to-browserify": "~1.0.0"
-            }
-        },
-        "node_modules/uglify-js/node_modules/camelcase": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-            "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/uglify-js/node_modules/cliui": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-            "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE=",
-            "dependencies": {
-                "center-align": "^0.1.1",
-                "right-align": "^0.1.1",
-                "wordwrap": "0.0.2"
-            }
-        },
-        "node_modules/uglify-js/node_modules/yargs": {
-            "version": "3.10.0",
-            "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-            "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E=",
-            "dependencies": {
-                "camelcase": "^1.0.2",
-                "cliui": "^2.1.0",
-                "decamelize": "^1.0.0",
-                "window-size": "0.1.0"
-            }
-        },
-        "node_modules/uglify-to-browserify": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz",
-            "integrity": "sha1-bgkk1r2mta/jSeOabWMoUKD4grc=",
-            "optional": true
-        },
-        "node_modules/uid-safe": {
-            "version": "2.1.5",
-            "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.1.5.tgz",
-            "integrity": "sha512-KPHm4VL5dDXKz01UuEd88Df+KzynaohSL9fBh096KWAxSKZQDI2uBrVqtvRM4rwrIrRRKsdLNML/lnaaVSRioA==",
-            "dependencies": {
-                "random-bytes": "~1.0.0"
-            },
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/uid2": {
-            "version": "0.0.3",
-            "resolved": "https://registry.npmjs.org/uid2/-/uid2-0.0.3.tgz",
-            "integrity": "sha1-SDEm4Rd03y9xuLY53NeZw3YWK4I="
-        },
-        "node_modules/unbzip2-stream": {
-            "version": "1.4.3",
-            "resolved": "https://registry.npmjs.org/unbzip2-stream/-/unbzip2-stream-1.4.3.tgz",
-            "integrity": "sha512-mlExGW4w71ebDJviH16lQLtZS32VKqsSfk80GCfUlwT/4/hNRFsoscrF/c++9xinkMzECL1uL9DDwXqFWkruPg==",
-            "dependencies": {
-                "buffer": "^5.2.1",
-                "through": "^2.3.8"
-            }
-        },
-        "node_modules/undefsafe": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/undefsafe/-/undefsafe-2.0.3.tgz",
-            "integrity": "sha512-nrXZwwXrD/T/JXeygJqdCO6NZZ1L66HrxM/Z7mIq2oPanoN0F1nLx3lwJMu6AwJY69hdixaFQOuoYsMjE5/C2A==",
-            "dependencies": {
-                "debug": "^2.2.0"
-            }
-        },
-        "node_modules/undefsafe/node_modules/debug": {
-            "version": "2.6.9",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-            "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-            "dependencies": {
-                "ms": "2.0.0"
-            }
-        },
-        "node_modules/undefsafe/node_modules/ms": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-            "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-        },
-        "node_modules/underscore": {
-            "version": "1.10.2",
-            "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.10.2.tgz",
-            "integrity": "sha512-N4P+Q/BuyuEKFJ43B9gYuOj4TQUHXX+j2FqguVOpjkssLUUrnJofCcBccJSCoeturDoZU6GorDTHSvUDlSQbTg=="
-        },
-        "node_modules/unicode-trie": {
-            "version": "0.3.1",
-            "resolved": "https://registry.npmjs.org/unicode-trie/-/unicode-trie-0.3.1.tgz",
-            "integrity": "sha1-1nHd3YkQGgi6w3tqUWEBBgIFIIU=",
-            "dependencies": {
-                "pako": "^0.2.5",
-                "tiny-inflate": "^1.0.0"
-            }
-        },
-        "node_modules/unicode-trie/node_modules/pako": {
-            "version": "0.2.9",
-            "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz",
-            "integrity": "sha1-8/dSL073gjSNqBYbrZ7P1Rv4OnU="
-        },
-        "node_modules/union-value": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/union-value/-/union-value-1.0.1.tgz",
-            "integrity": "sha512-tJfXmxMeWYnczCVs7XAEvIV7ieppALdyepWMkHkwciRpZraG/xwT+s2JN8+pr1+8jCRf80FFzvr+MpQeeoF4Xg==",
-            "dependencies": {
-                "arr-union": "^3.1.0",
-                "get-value": "^2.0.6",
-                "is-extendable": "^0.1.1",
-                "set-value": "^2.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/union-value/node_modules/is-extendable": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
-            "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/uniq": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/uniq/-/uniq-1.0.1.tgz",
-            "integrity": "sha1-sxxa6CVIRKOoKBVBzisEuGWnNP8=",
-            "dev": true
-        },
-        "node_modules/unique-filename": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/unique-filename/-/unique-filename-1.1.1.tgz",
-            "integrity": "sha512-Vmp0jIp2ln35UTXuryvjzkjGdRyf9b2lTXuSYUiPmzRcl3FDtYqAwOnTJkAngD9SWhnoJzDbTKwaOrZ+STtxNQ==",
-            "dev": true,
-            "dependencies": {
-                "unique-slug": "^2.0.0"
-            }
-        },
-        "node_modules/unique-slug": {
-            "version": "2.0.2",
-            "resolved": "https://registry.npmjs.org/unique-slug/-/unique-slug-2.0.2.tgz",
-            "integrity": "sha512-zoWr9ObaxALD3DOPfjPSqxt4fnZiWblxHIgeWqW8x7UqDzEtHEQLzji2cuJYQFCU6KmoJikOYAZlrTHHebjx2w==",
-            "dev": true,
-            "dependencies": {
-                "imurmurhash": "^0.1.4"
-            }
-        },
-        "node_modules/unique-string": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-1.0.0.tgz",
-            "integrity": "sha1-nhBXzKhRq7kzmPizOuGHuZyuwRo=",
-            "dependencies": {
-                "crypto-random-string": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/universalify": {
-            "version": "0.1.2",
-            "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",
-            "integrity": "sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==",
-            "engines": {
-                "node": ">= 4.0.0"
-            }
-        },
-        "node_modules/unorm": {
-            "version": "1.6.0",
-            "resolved": "https://registry.npmjs.org/unorm/-/unorm-1.6.0.tgz",
-            "integrity": "sha512-b2/KCUlYZUeA7JFUuRJZPUtr4gZvBh7tavtv4fvk4+KV9pfGiR6CQAQAWl49ZpR3ts2dk4FYkP7EIgDJoiOLDA==",
-            "engines": {
-                "node": ">= 0.4.0"
-            }
-        },
-        "node_modules/unpack-string": {
-            "version": "0.0.2",
-            "resolved": "https://registry.npmjs.org/unpack-string/-/unpack-string-0.0.2.tgz",
-            "integrity": "sha1-MC7PCCOLATm9Q0pNf9Z83zPKJ10="
-        },
-        "node_modules/unpipe": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
-            "integrity": "sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw=",
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/unset-value": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/unset-value/-/unset-value-1.0.0.tgz",
-            "integrity": "sha1-g3aHP30jNRef+x5vw6jtDfyKtVk=",
-            "dependencies": {
-                "has-value": "^0.3.1",
-                "isobject": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/unset-value/node_modules/has-value": {
-            "version": "0.3.1",
-            "resolved": "https://registry.npmjs.org/has-value/-/has-value-0.3.1.tgz",
-            "integrity": "sha1-ex9YutpiyoJ+wKIHgCVlSEWZXh8=",
-            "dependencies": {
-                "get-value": "^2.0.3",
-                "has-values": "^0.1.4",
-                "isobject": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/unset-value/node_modules/has-value/node_modules/isobject": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
-            "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
-            "dependencies": {
-                "isarray": "1.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/unset-value/node_modules/has-values": {
-            "version": "0.1.4",
-            "resolved": "https://registry.npmjs.org/has-values/-/has-values-0.1.4.tgz",
-            "integrity": "sha1-bWHeldkd/Km5oCCJrThL/49it3E=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/unstated": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/unstated/-/unstated-2.1.1.tgz",
-            "integrity": "sha512-fORlTWMZxq7NuMJDxyIrrYIZKN7wEWYQ9SiaJfIRcSpsowr6Ph/JIfK2tgtXLW614JfPG/t5q9eEIhXRCf55xg==",
-            "dependencies": {
-                "create-react-context": "^0.1.5"
-            }
-        },
-        "node_modules/unstated/node_modules/create-react-context": {
-            "version": "0.1.6",
-            "resolved": "https://registry.npmjs.org/create-react-context/-/create-react-context-0.1.6.tgz",
-            "integrity": "sha512-eCnYYEUEc5i32LHwpE/W7NlddOB9oHwsPaWtWzYtflNkkwa3IfindIcoXdVWs12zCbwaMCavKNu84EXogVIWHw=="
-        },
-        "node_modules/unzip-response": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz",
-            "integrity": "sha1-0vD3N9FrBhXnKmk17QQhRXLVb5c=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/upath": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/upath/-/upath-1.2.0.tgz",
-            "integrity": "sha512-aZwGpamFO61g3OlfT7OQCHqhGnW43ieH9WZeP7QxN/G/jS4jfqUkZxoryvJgVPEcrl5NL/ggHsSmLMHuH64Lhg==",
-            "engines": {
-                "node": ">=4",
-                "yarn": "*"
-            }
-        },
-        "node_modules/update-notifier": {
-            "version": "2.5.0",
-            "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.5.0.tgz",
-            "integrity": "sha512-gwMdhgJHGuj/+wHJJs9e6PcCszpxR1b236igrOkUofGhqJuG+amlIKwApH1IW1WWl7ovZxsX49lMBWLxSdm5Dw==",
-            "dependencies": {
-                "boxen": "^1.2.1",
-                "chalk": "^2.0.1",
-                "configstore": "^3.0.0",
-                "import-lazy": "^2.1.0",
-                "is-ci": "^1.0.10",
-                "is-installed-globally": "^0.1.0",
-                "is-npm": "^1.0.0",
-                "latest-version": "^3.0.0",
-                "semver-diff": "^2.0.0",
-                "xdg-basedir": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/uri-js": {
-            "version": "4.2.2",
-            "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.2.2.tgz",
-            "integrity": "sha512-KY9Frmirql91X2Qgjry0Wd4Y+YTdrdZheS8TFwvkbLWf/G5KNJDCh6pKL5OZctEW4+0Baa5idK2ZQuELRwPznQ==",
-            "dependencies": {
-                "punycode": "^2.1.0"
-            }
-        },
-        "node_modules/urix": {
-            "version": "0.1.0",
-            "resolved": "https://registry.npmjs.org/urix/-/urix-0.1.0.tgz",
-            "integrity": "sha1-2pN/emLiH+wf0Y1Js1wpNQZ6bHI="
-        },
-        "node_modules/url": {
-            "version": "0.11.0",
-            "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
-            "integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=",
-            "dev": true,
-            "dependencies": {
-                "punycode": "1.3.2",
-                "querystring": "0.2.0"
-            }
-        },
-        "node_modules/url-loader": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/url-loader/-/url-loader-1.1.2.tgz",
-            "integrity": "sha512-dXHkKmw8FhPqu8asTc1puBfe3TehOCo2+RmOOev5suNCIYBcT626kxiWg1NBVkwc4rO8BGa7gP70W7VXuqHrjg==",
-            "dependencies": {
-                "loader-utils": "^1.1.0",
-                "mime": "^2.0.3",
-                "schema-utils": "^1.0.0"
-            },
-            "engines": {
-                "node": ">= 6.9.0"
-            }
-        },
-        "node_modules/url-loader/node_modules/mime": {
-            "version": "2.4.4",
-            "resolved": "https://registry.npmjs.org/mime/-/mime-2.4.4.tgz",
-            "integrity": "sha512-LRxmNwziLPT828z+4YkNzloCFC2YM4wrB99k+AV5ZbEyfGNWfG8SO1FUXLmLDBSo89NrJZ4DIWeLjy1CHGhMGA==",
-            "bin": {
-                "mime": "cli.js"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/url-loader/node_modules/schema-utils": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
-            "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
-            "dependencies": {
-                "ajv": "^6.1.0",
-                "ajv-errors": "^1.0.0",
-                "ajv-keywords": "^3.1.0"
-            },
-            "engines": {
-                "node": ">= 4"
-            }
-        },
-        "node_modules/url-parse": {
-            "version": "1.4.7",
-            "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.4.7.tgz",
-            "integrity": "sha512-d3uaVyzDB9tQoSXFvuSUNFibTd9zxd2bkVrDRvF5TmvWWQwqE4lgYJ5m+x1DbecWkw+LK4RNl2CU1hHuOKPVlg==",
-            "dev": true,
-            "dependencies": {
-                "querystringify": "^2.1.1",
-                "requires-port": "^1.0.0"
-            }
-        },
-        "node_modules/url-parse-lax": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-1.0.0.tgz",
-            "integrity": "sha1-evjzA2Rem9eaJy56FKxovAYJ2nM=",
-            "dependencies": {
-                "prepend-http": "^1.0.1"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/url-template": {
-            "version": "2.0.8",
-            "resolved": "https://registry.npmjs.org/url-template/-/url-template-2.0.8.tgz",
-            "integrity": "sha1-/FZaPMy/93MMd19WQflVV5FDnyE="
-        },
-        "node_modules/url/node_modules/punycode": {
-            "version": "1.3.2",
-            "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
-            "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0=",
-            "dev": true
-        },
-        "node_modules/use": {
-            "version": "3.1.1",
-            "resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz",
-            "integrity": "sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/use-asset": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/use-asset/-/use-asset-1.0.4.tgz",
-            "integrity": "sha512-7/hqDrWa0iMnCoET9W1T07EmD4Eg/Wmoj/X8TGBc++ECRK4m5yTsjP4O6s0yagbxfqIOuUkIxe2/sA+VR2GxZA==",
-            "dependencies": {
-                "fast-deep-equal": "^3.1.3"
-            }
-        },
-        "node_modules/use-asset/node_modules/fast-deep-equal": {
-            "version": "3.1.3",
-            "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
-            "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="
-        },
-        "node_modules/use-memo-one": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/use-memo-one/-/use-memo-one-1.1.1.tgz",
-            "integrity": "sha512-oFfsyun+bP7RX8X2AskHNTxu+R3QdE/RC5IefMbqptmACAA/gfol1KDD5KRzPsGMa62sWxGZw+Ui43u6x4ddoQ=="
-        },
-        "node_modules/util": {
-            "version": "0.11.1",
-            "resolved": "https://registry.npmjs.org/util/-/util-0.11.1.tgz",
-            "integrity": "sha512-HShAsny+zS2TZfaXxD9tYj4HQGlBezXZMZuM/S5PKLLoZkShZiGk9o5CzukI1LVHZvjdvZ2Sj1aW/Ndn2NB/HQ==",
-            "dev": true,
-            "dependencies": {
-                "inherits": "2.0.3"
-            }
-        },
-        "node_modules/util-deprecate": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-            "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
-        },
-        "node_modules/util/node_modules/inherits": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
-            "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
-            "dev": true
-        },
-        "node_modules/utility-types": {
-            "version": "3.10.0",
-            "resolved": "https://registry.npmjs.org/utility-types/-/utility-types-3.10.0.tgz",
-            "integrity": "sha512-O11mqxmi7wMKCo6HKFt5AhO4BwY3VV68YU07tgxfz8zJTIxr4BpsezN49Ffwy9j3ZpwwJp4fkRwjRzq3uWE6Rg==",
-            "engines": {
-                "node": ">= 4"
-            }
-        },
-        "node_modules/utils-merge": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
-            "integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM=",
-            "engines": {
-                "node": ">= 0.4.0"
-            }
-        },
-        "node_modules/uuid": {
-            "version": "3.4.0",
-            "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz",
-            "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==",
-            "bin": {
-                "uuid": "bin/uuid"
-            }
-        },
-        "node_modules/v8-compile-cache": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.1.1.tgz",
-            "integrity": "sha512-8OQ9CL+VWyt3JStj7HX7/ciTL2V3Rl1Wf5OL+SNTm0yK1KvtReVulksyeRnCANHHuUxHlQig+JJDlUhBt1NQDQ==",
-            "dev": true
-        },
-        "node_modules/valid-url": {
-            "version": "1.0.9",
-            "resolved": "https://registry.npmjs.org/valid-url/-/valid-url-1.0.9.tgz",
-            "integrity": "sha1-HBRHm0DxOXp1eC8RXkCGRHQzogA="
-        },
-        "node_modules/validate-npm-package-license": {
-            "version": "3.0.4",
-            "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz",
-            "integrity": "sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==",
-            "dependencies": {
-                "spdx-correct": "^3.0.0",
-                "spdx-expression-parse": "^3.0.0"
-            }
-        },
-        "node_modules/validator": {
-            "version": "10.11.0",
-            "resolved": "https://registry.npmjs.org/validator/-/validator-10.11.0.tgz",
-            "integrity": "sha512-X/p3UZerAIsbBfN/IwahhYaBbY68EN/UQBWHtsbXGT5bfrH/p4NQzUCG1kF/rtKaNpnJ7jAu6NGTdSNtyNIXMw==",
-            "engines": {
-                "node": ">= 0.10"
-            }
-        },
-        "node_modules/vary": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
-            "integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=",
-            "engines": {
-                "node": ">= 0.8"
-            }
-        },
-        "node_modules/verror": {
-            "version": "1.10.0",
-            "resolved": "https://registry.npmjs.org/verror/-/verror-1.10.0.tgz",
-            "integrity": "sha1-OhBcoXBTr1XW4nDB+CiGguGNpAA=",
-            "engines": [
-                "node >=0.6.0"
-            ],
-            "dependencies": {
-                "assert-plus": "^1.0.0",
-                "core-util-is": "1.0.2",
-                "extsprintf": "^1.2.0"
-            }
-        },
-        "node_modules/vm-browserify": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-1.1.2.tgz",
-            "integrity": "sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==",
-            "dev": true
-        },
-        "node_modules/void-elements": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-2.0.1.tgz",
-            "integrity": "sha1-wGavtYK7HLQSjWDqkjkulNXp2+w=",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/vscode-jsonrpc": {
-            "version": "5.0.1",
-            "resolved": "https://registry.npmjs.org/vscode-jsonrpc/-/vscode-jsonrpc-5.0.1.tgz",
-            "integrity": "sha512-JvONPptw3GAQGXlVV2utDcHx0BiY34FupW/kI6mZ5x06ER5DdPG/tXWMVHjTNULF5uKPOUUD0SaXg5QaubJL0A==",
-            "engines": {
-                "node": ">=8.0.0 || >=10.0.0"
-            }
-        },
-        "node_modules/vscode-languageserver": {
-            "version": "5.3.0-next.10",
-            "resolved": "https://registry.npmjs.org/vscode-languageserver/-/vscode-languageserver-5.3.0-next.10.tgz",
-            "integrity": "sha512-QL7Fe1FT6PdLtVzwJeZ78pTic4eZbzLRy7yAQgPb9xalqqgZESR0+yDZPwJrM3E7PzOmwHBceYcJR54eQZ7Kng==",
-            "dependencies": {
-                "vscode-languageserver-protocol": "^3.15.0-next.8",
-                "vscode-textbuffer": "^1.0.0"
-            },
-            "bin": {
-                "installServerIntoExtension": "bin/installServerIntoExtension"
-            }
-        },
-        "node_modules/vscode-languageserver-protocol": {
-            "version": "3.15.3",
-            "resolved": "https://registry.npmjs.org/vscode-languageserver-protocol/-/vscode-languageserver-protocol-3.15.3.tgz",
-            "integrity": "sha512-zrMuwHOAQRhjDSnflWdJG+O2ztMWss8GqUUB8dXLR/FPenwkiBNkMIJJYfSN6sgskvsF0rHAoBowNQfbyZnnvw==",
-            "dependencies": {
-                "vscode-jsonrpc": "^5.0.1",
-                "vscode-languageserver-types": "3.15.1"
-            }
-        },
-        "node_modules/vscode-languageserver-types": {
-            "version": "3.15.1",
-            "resolved": "https://registry.npmjs.org/vscode-languageserver-types/-/vscode-languageserver-types-3.15.1.tgz",
-            "integrity": "sha512-+a9MPUQrNGRrGU630OGbYVQ+11iOIovjCkqxajPa9w57Sd5ruK8WQNsslzpa0x/QJqC8kRc2DUxWjIFwoNm4ZQ=="
-        },
-        "node_modules/vscode-textbuffer": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/vscode-textbuffer/-/vscode-textbuffer-1.0.0.tgz",
-            "integrity": "sha512-zPaHo4urgpwsm+PrJWfNakolRpryNja18SUip/qIIsfhuEqEIPEXMxHOlFPjvDC4JgTaimkncNW7UMXRJTY6ow=="
-        },
-        "node_modules/vscode-uri": {
-            "version": "1.0.8",
-            "resolved": "https://registry.npmjs.org/vscode-uri/-/vscode-uri-1.0.8.tgz",
-            "integrity": "sha512-obtSWTlbJ+a+TFRYGaUumtVwb+InIUVI0Lu0VBUAPmj2cU5JutEXg3xUE0c2J5Tcy7h2DEKVJBFi+Y9ZSFzzPQ=="
-        },
-        "node_modules/vue-template-compiler": {
-            "version": "2.6.11",
-            "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.6.11.tgz",
-            "integrity": "sha512-KIq15bvQDrcCjpGjrAhx4mUlyyHfdmTaoNfeoATHLAiWB+MU3cx4lOzMwrnUh9cCxy0Lt1T11hAFY6TQgroUAA==",
-            "dependencies": {
-                "de-indent": "^1.0.2",
-                "he": "^1.1.0"
-            }
-        },
-        "node_modules/w3c-hr-time": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz",
-            "integrity": "sha512-z8P5DvDNjKDoFIHK7q8r8lackT6l+jo/Ye3HOle7l9nICP9lf1Ci25fy9vHd0JOWewkIFzXIEig3TdKT7JQ5fQ==",
-            "dev": true,
-            "dependencies": {
-                "browser-process-hrtime": "^1.0.0"
-            }
-        },
-        "node_modules/w3c-keyname": {
-            "version": "2.2.4",
-            "resolved": "https://registry.npmjs.org/w3c-keyname/-/w3c-keyname-2.2.4.tgz",
-            "integrity": "sha512-tOhfEwEzFLJzf6d1ZPkYfGj+FWhIpBux9ppoP3rlclw3Z0BZv3N7b7030Z1kYth+6rDuAsXUFr+d0VE6Ed1ikw=="
-        },
-        "node_modules/w3c-xmlserializer": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-1.1.2.tgz",
-            "integrity": "sha512-p10l/ayESzrBMYWRID6xbuCKh2Fp77+sA0doRuGn4tTIMrrZVeqfpKjXHY+oDh3K4nLdPgNwMTVP6Vp4pvqbNg==",
-            "dev": true,
-            "dependencies": {
-                "domexception": "^1.0.1",
-                "webidl-conversions": "^4.0.2",
-                "xml-name-validator": "^3.0.0"
-            }
-        },
-        "node_modules/walkdir": {
-            "version": "0.4.1",
-            "resolved": "https://registry.npmjs.org/walkdir/-/walkdir-0.4.1.tgz",
-            "integrity": "sha512-3eBwRyEln6E1MSzcxcVpQIhRG8Q1jLvEqRmCZqS3dsfXEDR/AhOF4d+jHg1qvDCpYaVRZjENPQyrVxAkQqxPgQ==",
-            "engines": {
-                "node": ">=6.0.0"
-            }
-        },
-        "node_modules/warning": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/warning/-/warning-3.0.0.tgz",
-            "integrity": "sha1-MuU3fLVy3kqwR1O9+IIcAe1gW3w=",
-            "dependencies": {
-                "loose-envify": "^1.0.0"
-            }
-        },
-        "node_modules/watchpack": {
-            "version": "1.7.5",
-            "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz",
-            "integrity": "sha512-9P3MWk6SrKjHsGkLT2KHXdQ/9SNkyoJbabxnKOoJepsvJjJG8uYTR3yTPxPQvNDI3w4Nz1xnE0TLHK4RIVe/MQ==",
-            "dev": true,
-            "dependencies": {
-                "graceful-fs": "^4.1.2",
-                "neo-async": "^2.5.0"
-            },
-            "optionalDependencies": {
-                "chokidar": "^3.4.1",
-                "watchpack-chokidar2": "^2.0.1"
-            }
-        },
-        "node_modules/watchpack-chokidar2": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/watchpack-chokidar2/-/watchpack-chokidar2-2.0.1.tgz",
-            "integrity": "sha512-nCFfBIPKr5Sh61s4LPpy1Wtfi0HE8isJ3d2Yb5/Ppw2P2B/3eVSEBjKfN0fmHJSK14+31KwMKmcrzs2GM4P0Ww==",
-            "dev": true,
-            "optional": true,
-            "dependencies": {
-                "chokidar": "^2.1.8"
-            }
-        },
-        "node_modules/watchpack/node_modules/anymatch": {
-            "version": "3.1.2",
-            "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz",
-            "integrity": "sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==",
-            "dev": true,
-            "optional": true,
-            "dependencies": {
-                "normalize-path": "^3.0.0",
-                "picomatch": "^2.0.4"
-            },
-            "engines": {
-                "node": ">= 8"
-            }
-        },
-        "node_modules/watchpack/node_modules/binary-extensions": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
-            "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
-            "dev": true,
-            "optional": true,
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/watchpack/node_modules/braces": {
-            "version": "3.0.2",
-            "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
-            "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
-            "dev": true,
-            "optional": true,
-            "dependencies": {
-                "fill-range": "^7.0.1"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/watchpack/node_modules/chokidar": {
-            "version": "3.5.1",
-            "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.1.tgz",
-            "integrity": "sha512-9+s+Od+W0VJJzawDma/gvBNQqkTiqYTWLuZoyAsivsI4AaWTCzHG06/TMjsf1cYe9Cb97UCEhjz7HvnPk2p/tw==",
-            "dev": true,
-            "optional": true,
-            "dependencies": {
-                "anymatch": "~3.1.1",
-                "braces": "~3.0.2",
-                "fsevents": "~2.3.1",
-                "glob-parent": "~5.1.0",
-                "is-binary-path": "~2.1.0",
-                "is-glob": "~4.0.1",
-                "normalize-path": "~3.0.0",
-                "readdirp": "~3.5.0"
-            },
-            "engines": {
-                "node": ">= 8.10.0"
-            }
-        },
-        "node_modules/watchpack/node_modules/fill-range": {
-            "version": "7.0.1",
-            "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
-            "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
-            "dev": true,
-            "optional": true,
-            "dependencies": {
-                "to-regex-range": "^5.0.1"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/watchpack/node_modules/fsevents": {
-            "version": "2.3.2",
-            "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
-            "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
-            "dev": true,
-            "optional": true,
-            "os": [
-                "darwin"
-            ],
-            "engines": {
-                "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
-            }
-        },
-        "node_modules/watchpack/node_modules/glob-parent": {
-            "version": "5.1.2",
-            "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
-            "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
-            "dev": true,
-            "optional": true,
-            "dependencies": {
-                "is-glob": "^4.0.1"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/watchpack/node_modules/is-binary-path": {
-            "version": "2.1.0",
-            "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
-            "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
-            "dev": true,
-            "optional": true,
-            "dependencies": {
-                "binary-extensions": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/watchpack/node_modules/is-number": {
-            "version": "7.0.0",
-            "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
-            "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
-            "dev": true,
-            "optional": true,
-            "engines": {
-                "node": ">=0.12.0"
-            }
-        },
-        "node_modules/watchpack/node_modules/readdirp": {
-            "version": "3.5.0",
-            "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.5.0.tgz",
-            "integrity": "sha512-cMhu7c/8rdhkHXWsY+osBhfSy0JikwpHK/5+imo+LpeasTF8ouErHrlYkwT0++njiyuDvc7OFY5T3ukvZ8qmFQ==",
-            "dev": true,
-            "optional": true,
-            "dependencies": {
-                "picomatch": "^2.2.1"
-            },
-            "engines": {
-                "node": ">=8.10.0"
-            }
-        },
-        "node_modules/watchpack/node_modules/to-regex-range": {
-            "version": "5.0.1",
-            "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
-            "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
-            "dev": true,
-            "optional": true,
-            "dependencies": {
-                "is-number": "^7.0.0"
-            },
-            "engines": {
-                "node": ">=8.0"
-            }
-        },
-        "node_modules/wbuf": {
-            "version": "1.7.3",
-            "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.3.tgz",
-            "integrity": "sha512-O84QOnr0icsbFGLS0O3bI5FswxzRr8/gHwWkDlQFskhSPryQXvrTMxjxGP4+iWYoauLoBvfDpkrOauZ+0iZpDA==",
-            "dev": true,
-            "dependencies": {
-                "minimalistic-assert": "^1.0.0"
-            }
-        },
-        "node_modules/web-request": {
-            "version": "1.0.7",
-            "resolved": "https://registry.npmjs.org/web-request/-/web-request-1.0.7.tgz",
-            "integrity": "sha1-twxCs81FV3noLbaIYlOySR8r1Wk=",
-            "dependencies": {
-                "request": "^2.69.0"
-            }
-        },
-        "node_modules/webidl-conversions": {
-            "version": "4.0.2",
-            "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-4.0.2.tgz",
-            "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg==",
-            "dev": true
-        },
-        "node_modules/webpack": {
-            "version": "4.46.0",
-            "resolved": "https://registry.npmjs.org/webpack/-/webpack-4.46.0.tgz",
-            "integrity": "sha512-6jJuJjg8znb/xRItk7bkT0+Q7AHCYjjFnvKIWQPkNIOyRqoCGvkOs0ipeQzrqz4l5FtN5ZI/ukEHroeX/o1/5Q==",
-            "dev": true,
-            "dependencies": {
-                "@webassemblyjs/ast": "1.9.0",
-                "@webassemblyjs/helper-module-context": "1.9.0",
-                "@webassemblyjs/wasm-edit": "1.9.0",
-                "@webassemblyjs/wasm-parser": "1.9.0",
-                "acorn": "^6.4.1",
-                "ajv": "^6.10.2",
-                "ajv-keywords": "^3.4.1",
-                "chrome-trace-event": "^1.0.2",
-                "enhanced-resolve": "^4.5.0",
-                "eslint-scope": "^4.0.3",
-                "json-parse-better-errors": "^1.0.2",
-                "loader-runner": "^2.4.0",
-                "loader-utils": "^1.2.3",
-                "memory-fs": "^0.4.1",
-                "micromatch": "^3.1.10",
-                "mkdirp": "^0.5.3",
-                "neo-async": "^2.6.1",
-                "node-libs-browser": "^2.2.1",
-                "schema-utils": "^1.0.0",
-                "tapable": "^1.1.3",
-                "terser-webpack-plugin": "^1.4.3",
-                "watchpack": "^1.7.4",
-                "webpack-sources": "^1.4.1"
-            },
-            "bin": {
-                "webpack": "bin/webpack.js"
-            },
-            "engines": {
-                "node": ">=6.11.5"
-            }
-        },
-        "node_modules/webpack-cli": {
-            "version": "3.3.12",
-            "resolved": "https://registry.npmjs.org/webpack-cli/-/webpack-cli-3.3.12.tgz",
-            "integrity": "sha512-NVWBaz9k839ZH/sinurM+HcDvJOTXwSjYp1ku+5XKeOC03z8v5QitnK/x+lAxGXFyhdayoIf/GOpv85z3/xPag==",
-            "dev": true,
-            "dependencies": {
-                "chalk": "^2.4.2",
-                "cross-spawn": "^6.0.5",
-                "enhanced-resolve": "^4.1.1",
-                "findup-sync": "^3.0.0",
-                "global-modules": "^2.0.0",
-                "import-local": "^2.0.0",
-                "interpret": "^1.4.0",
-                "loader-utils": "^1.4.0",
-                "supports-color": "^6.1.0",
-                "v8-compile-cache": "^2.1.1",
-                "yargs": "^13.3.2"
-            },
-            "bin": {
-                "webpack-cli": "bin/cli.js"
-            },
-            "engines": {
-                "node": ">=6.11.5"
-            }
-        },
-        "node_modules/webpack-cli/node_modules/cross-spawn": {
-            "version": "6.0.5",
-            "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
-            "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
-            "dev": true,
-            "dependencies": {
-                "nice-try": "^1.0.4",
-                "path-key": "^2.0.1",
-                "semver": "^5.5.0",
-                "shebang-command": "^1.2.0",
-                "which": "^1.2.9"
-            },
-            "engines": {
-                "node": ">=4.8"
-            }
-        },
-        "node_modules/webpack-cli/node_modules/interpret": {
-            "version": "1.4.0",
-            "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.4.0.tgz",
-            "integrity": "sha512-agE4QfB2Lkp9uICn7BAqoscw4SZP9kTE2hxiFI3jBPmXJfdqiahTbUuKGsMoN2GtqL9AxhYioAcVvgsb1HvRbA==",
-            "dev": true,
-            "engines": {
-                "node": ">= 0.10"
-            }
-        },
-        "node_modules/webpack-cli/node_modules/supports-color": {
-            "version": "6.1.0",
-            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz",
-            "integrity": "sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==",
-            "dev": true,
-            "dependencies": {
-                "has-flag": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/webpack-dev-middleware": {
-            "version": "3.7.3",
-            "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-3.7.3.tgz",
-            "integrity": "sha512-djelc/zGiz9nZj/U7PTBi2ViorGJXEWo/3ltkPbDyxCXhhEXkW0ce99falaok4TPj+AsxLiXJR0EBOb0zh9fKQ==",
-            "dev": true,
-            "dependencies": {
-                "memory-fs": "^0.4.1",
-                "mime": "^2.4.4",
-                "mkdirp": "^0.5.1",
-                "range-parser": "^1.2.1",
-                "webpack-log": "^2.0.0"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/webpack-dev-middleware/node_modules/memory-fs": {
-            "version": "0.4.1",
-            "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
-            "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
-            "dev": true,
-            "dependencies": {
-                "errno": "^0.1.3",
-                "readable-stream": "^2.0.1"
-            }
-        },
-        "node_modules/webpack-dev-middleware/node_modules/mime": {
-            "version": "2.5.2",
-            "resolved": "https://registry.npmjs.org/mime/-/mime-2.5.2.tgz",
-            "integrity": "sha512-tqkh47FzKeCPD2PUiPB6pkbMzsCasjxAfC62/Wap5qrUWcb+sFasXUC5I3gYM5iBM8v/Qpn4UK0x+j0iHyFPDg==",
-            "dev": true,
-            "bin": {
-                "mime": "cli.js"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/webpack-dev-middleware/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/webpack-dev-middleware/node_modules/webpack-log": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/webpack-log/-/webpack-log-2.0.0.tgz",
-            "integrity": "sha512-cX8G2vR/85UYG59FgkoMamwHUIkSSlV3bBMRsbxVXVUk2j6NleCKjQ/WE9eYg9WY4w25O9w8wKP4rzNZFmUcUg==",
-            "dev": true,
-            "dependencies": {
-                "ansi-colors": "^3.0.0",
-                "uuid": "^3.3.2"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/webpack-dev-server": {
-            "version": "3.11.0",
-            "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.11.0.tgz",
-            "integrity": "sha512-PUxZ+oSTxogFQgkTtFndEtJIPNmml7ExwufBZ9L2/Xyyd5PnOL5UreWe5ZT7IU25DSdykL9p1MLQzmLh2ljSeg==",
-            "dev": true,
-            "dependencies": {
-                "ansi-html": "0.0.7",
-                "bonjour": "^3.5.0",
-                "chokidar": "^2.1.8",
-                "compression": "^1.7.4",
-                "connect-history-api-fallback": "^1.6.0",
-                "debug": "^4.1.1",
-                "del": "^4.1.1",
-                "express": "^4.17.1",
-                "html-entities": "^1.3.1",
-                "http-proxy-middleware": "0.19.1",
-                "import-local": "^2.0.0",
-                "internal-ip": "^4.3.0",
-                "ip": "^1.1.5",
-                "is-absolute-url": "^3.0.3",
-                "killable": "^1.0.1",
-                "loglevel": "^1.6.8",
-                "opn": "^5.5.0",
-                "p-retry": "^3.0.1",
-                "portfinder": "^1.0.26",
-                "schema-utils": "^1.0.0",
-                "selfsigned": "^1.10.7",
-                "semver": "^6.3.0",
-                "serve-index": "^1.9.1",
-                "sockjs": "0.3.20",
-                "sockjs-client": "1.4.0",
-                "spdy": "^4.0.2",
-                "strip-ansi": "^3.0.1",
-                "supports-color": "^6.1.0",
-                "url": "^0.11.0",
-                "webpack-dev-middleware": "^3.7.2",
-                "webpack-log": "^2.0.0",
-                "ws": "^6.2.1",
-                "yargs": "^13.3.2"
-            },
-            "bin": {
-                "webpack-dev-server": "bin/webpack-dev-server.js"
-            },
-            "engines": {
-                "node": ">= 6.11.5"
-            }
-        },
-        "node_modules/webpack-dev-server/node_modules/ansi-regex": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-            "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/webpack-dev-server/node_modules/debug": {
-            "version": "4.1.1",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-            "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-            "dev": true,
-            "dependencies": {
-                "ms": "^2.1.1"
-            }
-        },
-        "node_modules/webpack-dev-server/node_modules/semver": {
-            "version": "6.3.0",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-            "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
-            "dev": true,
-            "bin": {
-                "semver": "bin/semver.js"
-            }
-        },
-        "node_modules/webpack-dev-server/node_modules/strip-ansi": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-            "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
-            "dev": true,
-            "dependencies": {
-                "ansi-regex": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/webpack-dev-server/node_modules/supports-color": {
-            "version": "6.1.0",
-            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz",
-            "integrity": "sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==",
-            "dev": true,
-            "dependencies": {
-                "has-flag": "^3.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/webpack-dev-server/node_modules/webpack-log": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/webpack-log/-/webpack-log-2.0.0.tgz",
-            "integrity": "sha512-cX8G2vR/85UYG59FgkoMamwHUIkSSlV3bBMRsbxVXVUk2j6NleCKjQ/WE9eYg9WY4w25O9w8wKP4rzNZFmUcUg==",
-            "dev": true,
-            "dependencies": {
-                "ansi-colors": "^3.0.0",
-                "uuid": "^3.3.2"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/webpack-dev-server/node_modules/ws": {
-            "version": "6.2.1",
-            "resolved": "https://registry.npmjs.org/ws/-/ws-6.2.1.tgz",
-            "integrity": "sha512-GIyAXC2cB7LjvpgMt9EKS2ldqr0MTrORaleiOno6TweZ6r3TKtoFQWay/2PceJ3RuBasOHzXNn5Lrw1X0bEjqA==",
-            "dev": true,
-            "dependencies": {
-                "async-limiter": "~1.0.0"
-            }
-        },
-        "node_modules/webpack-hot-middleware": {
-            "version": "2.25.0",
-            "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.25.0.tgz",
-            "integrity": "sha512-xs5dPOrGPCzuRXNi8F6rwhawWvQQkeli5Ro48PRuQh8pYPCPmNnltP9itiUPT4xI8oW+y0m59lyyeQk54s5VgA==",
-            "dev": true,
-            "dependencies": {
-                "ansi-html": "0.0.7",
-                "html-entities": "^1.2.0",
-                "querystring": "^0.2.0",
-                "strip-ansi": "^3.0.0"
-            }
-        },
-        "node_modules/webpack-hot-middleware/node_modules/ansi-regex": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-            "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/webpack-hot-middleware/node_modules/strip-ansi": {
-            "version": "3.0.1",
-            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-            "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
-            "dev": true,
-            "dependencies": {
-                "ansi-regex": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/webpack-log": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/webpack-log/-/webpack-log-1.2.0.tgz",
-            "integrity": "sha512-U9AnICnu50HXtiqiDxuli5gLB5PGBo7VvcHx36jRZHwK4vzOYLbImqT4lwWwoMHdQWwEKw736fCHEekokTEKHA==",
-            "dev": true,
-            "dependencies": {
-                "chalk": "^2.1.0",
-                "log-symbols": "^2.1.0",
-                "loglevelnext": "^1.0.1",
-                "uuid": "^3.1.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/webpack-sources": {
-            "version": "1.4.3",
-            "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.4.3.tgz",
-            "integrity": "sha512-lgTS3Xhv1lCOKo7SA5TjKXMjpSM4sBjNV5+q2bqesbSPs5FjGmU6jjtBSkX9b4qW87vDIsCIlUPOEhbZrMdjeQ==",
-            "dev": true,
-            "dependencies": {
-                "source-list-map": "^2.0.0",
-                "source-map": "~0.6.1"
-            }
-        },
-        "node_modules/webpack-sources/node_modules/source-map": {
-            "version": "0.6.1",
-            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-            "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/webpack/node_modules/acorn": {
-            "version": "6.4.2",
-            "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.2.tgz",
-            "integrity": "sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ==",
-            "dev": true,
-            "bin": {
-                "acorn": "bin/acorn"
-            },
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/webpack/node_modules/enhanced-resolve": {
-            "version": "4.5.0",
-            "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-4.5.0.tgz",
-            "integrity": "sha512-Nv9m36S/vxpsI+Hc4/ZGRs0n9mXqSWGGq49zxb/cJfPAQMbUtttJAlNPS4AQzaBdw/pKskw5bMbekT/Y7W/Wlg==",
-            "dev": true,
-            "dependencies": {
-                "graceful-fs": "^4.1.2",
-                "memory-fs": "^0.5.0",
-                "tapable": "^1.0.0"
-            },
-            "engines": {
-                "node": ">=6.9.0"
-            }
-        },
-        "node_modules/webpack/node_modules/enhanced-resolve/node_modules/memory-fs": {
-            "version": "0.5.0",
-            "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.5.0.tgz",
-            "integrity": "sha512-jA0rdU5KoQMC0e6ppoNRtpp6vjFq6+NY7r8hywnC7V+1Xj/MtHwGIbB1QaK/dunyjWteJzmkpd7ooeWg10T7GA==",
-            "dev": true,
-            "dependencies": {
-                "errno": "^0.1.3",
-                "readable-stream": "^2.0.1"
-            },
-            "engines": {
-                "node": ">=4.3.0 <5.0.0 || >=5.10"
-            }
-        },
-        "node_modules/webpack/node_modules/memory-fs": {
-            "version": "0.4.1",
-            "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
-            "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
-            "dev": true,
-            "dependencies": {
-                "errno": "^0.1.3",
-                "readable-stream": "^2.0.1"
-            }
-        },
-        "node_modules/webpack/node_modules/readable-stream": {
-            "version": "2.3.7",
-            "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-            "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
-            "dependencies": {
-                "core-util-is": "~1.0.0",
-                "inherits": "~2.0.3",
-                "isarray": "~1.0.0",
-                "process-nextick-args": "~2.0.0",
-                "safe-buffer": "~5.1.1",
-                "string_decoder": "~1.1.1",
-                "util-deprecate": "~1.0.1"
-            }
-        },
-        "node_modules/webrtc-adapter": {
-            "version": "7.6.3",
-            "resolved": "https://registry.npmjs.org/webrtc-adapter/-/webrtc-adapter-7.6.3.tgz",
-            "integrity": "sha512-DCMiS6cy29PknSuBz779twM6/VsPdoQNAU/I/q4VCEVSlCQ88xiwqGD5/osVO6UMyXCnTBiOl8kd+1cJi6Pkig==",
-            "dependencies": {
-                "rtcpeerconnection-shim": "^1.2.15",
-                "sdp": "^2.12.0"
-            },
-            "engines": {
-                "node": ">=6.0.0",
-                "npm": ">=3.10.0"
-            }
-        },
-        "node_modules/websocket-driver": {
-            "version": "0.6.5",
-            "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.6.5.tgz",
-            "integrity": "sha1-XLJVbOuF9Dc8bYI4qmkchFThOjY=",
-            "dev": true,
-            "dependencies": {
-                "websocket-extensions": ">=0.1.1"
-            },
-            "engines": {
-                "node": ">=0.6.0"
-            }
-        },
-        "node_modules/websocket-extensions": {
-            "version": "0.1.4",
-            "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.4.tgz",
-            "integrity": "sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.8.0"
-            }
-        },
-        "node_modules/whatwg-encoding": {
-            "version": "1.0.5",
-            "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-1.0.5.tgz",
-            "integrity": "sha512-b5lim54JOPN9HtzvK9HFXvBma/rnfFeqsic0hSpjtDbVxR3dJKLc+KB4V6GgiGOvl7CY/KNh8rxSo9DKQrnUEw==",
-            "dev": true,
-            "dependencies": {
-                "iconv-lite": "0.4.24"
-            }
-        },
-        "node_modules/whatwg-fetch": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.0.0.tgz",
-            "integrity": "sha512-9GSJUgz1D4MfyKU7KRqwOjXCXTqWdFNvEr7eUBYchQiVc744mqK/MzXPNR2WsPkmkOa4ywfg8C2n8h+13Bey1Q=="
-        },
-        "node_modules/whatwg-mimetype": {
-            "version": "2.3.0",
-            "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz",
-            "integrity": "sha512-M4yMwr6mAnQz76TbJm914+gPpB/nCwvZbJU28cUD6dR004SAxDLOOSUaB1JDRqLtaOV/vi0IC5lEAGFgrjGv/g==",
-            "dev": true
-        },
-        "node_modules/whatwg-url": {
-            "version": "7.1.0",
-            "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-7.1.0.tgz",
-            "integrity": "sha512-WUu7Rg1DroM7oQvGWfOiAK21n74Gg+T4elXEQYkOhtyLeWiJFoOGLXPKI/9gzIie9CtwVLm8wtw6YJdKyxSjeg==",
-            "dev": true,
-            "dependencies": {
-                "lodash.sortby": "^4.7.0",
-                "tr46": "^1.0.1",
-                "webidl-conversions": "^4.0.2"
-            }
-        },
-        "node_modules/which": {
-            "version": "1.3.1",
-            "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
-            "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
-            "dependencies": {
-                "isexe": "^2.0.0"
-            },
-            "bin": {
-                "which": "bin/which"
-            }
-        },
-        "node_modules/which-module": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz",
-            "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho="
-        },
-        "node_modules/which-pm-runs": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/which-pm-runs/-/which-pm-runs-1.0.0.tgz",
-            "integrity": "sha1-Zws6+8VS4LVd9rd4DKdGFfI60cs="
-        },
-        "node_modules/wide-align": {
-            "version": "1.1.3",
-            "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.3.tgz",
-            "integrity": "sha512-QGkOQc8XL6Bt5PwnsExKBPuMKBxnGxWWW3fU55Xt4feHozMUhdUMaBCk290qpm/wG5u/RSKzwdAC4i51YigihA==",
-            "dependencies": {
-                "string-width": "^1.0.2 || 2"
-            }
-        },
-        "node_modules/widest-line": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-2.0.1.tgz",
-            "integrity": "sha512-Ba5m9/Fa4Xt9eb2ELXt77JxVDV8w7qQrH0zS/TWSJdLyAwQjWoOzpzj5lwVftDz6n/EOu3tNACS84v509qwnJA==",
-            "dependencies": {
-                "string-width": "^2.1.1"
-            },
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/wikijs": {
-            "version": "6.0.1",
-            "resolved": "https://registry.npmjs.org/wikijs/-/wikijs-6.0.1.tgz",
-            "integrity": "sha512-67ZtXyVPspYM5/B5ci0NIwvPJyG23HPk33QQLgLbCcORQ6N0I3Mhxd/KsPRh3xyly87KDs/bh1xuIG6PVTCKGw==",
-            "dependencies": {
-                "cheerio": "^1.0.0-rc.3",
-                "cross-fetch": "^3.0.2",
-                "infobox-parser": "3.3.1"
-            },
-            "engines": {
-                "node": ">=0.10.4"
-            }
-        },
-        "node_modules/window-size": {
-            "version": "0.1.0",
-            "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
-            "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0=",
-            "engines": {
-                "node": ">= 0.8.0"
-            }
-        },
-        "node_modules/with": {
-            "version": "5.1.1",
-            "resolved": "https://registry.npmjs.org/with/-/with-5.1.1.tgz",
-            "integrity": "sha1-+k2qktrzLE6pTtRTyB8EaGtXXf4=",
-            "dependencies": {
-                "acorn": "^3.1.0",
-                "acorn-globals": "^3.0.0"
-            }
-        },
-        "node_modules/word-wrap": {
-            "version": "1.2.3",
-            "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz",
-            "integrity": "sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
-        "node_modules/words-to-numbers": {
-            "version": "1.5.1",
-            "resolved": "https://registry.npmjs.org/words-to-numbers/-/words-to-numbers-1.5.1.tgz",
-            "integrity": "sha512-uvz7zSCKmmA7o5f5zp4Z5l24RQhy6HSNu10URhNxQWv1I82RsFaZX3qD07RLFUMJsCV38oAuaca13AvhO+9yGw==",
-            "dependencies": {
-                "babel-runtime": "6.x.x",
-                "clj-fuzzy": "^0.3.2",
-                "its-set": "^1.1.5"
-            }
-        },
-        "node_modules/wordwrap": {
-            "version": "0.0.2",
-            "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-            "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8=",
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/wordwrapjs": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/wordwrapjs/-/wordwrapjs-3.0.0.tgz",
-            "integrity": "sha512-mO8XtqyPvykVCsrwj5MlOVWvSnCdT+C+QVbm6blradR7JExAhbkZ7hZ9A+9NUtwzSqrlUo9a67ws0EiILrvRpw==",
-            "dependencies": {
-                "reduce-flatten": "^1.0.1",
-                "typical": "^2.6.1"
-            },
-            "engines": {
-                "node": ">=4.0.0"
-            }
-        },
-        "node_modules/worker-farm": {
-            "version": "1.7.0",
-            "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.7.0.tgz",
-            "integrity": "sha512-rvw3QTZc8lAxyVrqcSGVm5yP/IJ2UcB3U0graE3LCFoZ0Yn2x4EoVSqJKdB/T5M+FLcRPjz4TDacRf3OCfNUzw==",
-            "dev": true,
-            "dependencies": {
-                "errno": "~0.1.7"
-            }
-        },
-        "node_modules/worker-rpc": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/worker-rpc/-/worker-rpc-0.1.1.tgz",
-            "integrity": "sha512-P1WjMrUB3qgJNI9jfmpZ/htmBEjFh//6l/5y8SD9hg1Ef5zTTVVoRjTrTEzPrNBQvmhMxkoTsjOXN10GWU7aCg==",
-            "dev": true,
-            "dependencies": {
-                "microevent.ts": "~0.1.1"
-            }
-        },
-        "node_modules/wrap-ansi": {
-            "version": "5.1.0",
-            "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-5.1.0.tgz",
-            "integrity": "sha512-QC1/iN/2/RPVJ5jYK8BGttj5z83LmSKmvbvrXPNCLZSEb32KKVDJDl/MOt2N01qU2H/FkzEa9PKto1BqDjtd7Q==",
-            "dependencies": {
-                "ansi-styles": "^3.2.0",
-                "string-width": "^3.0.0",
-                "strip-ansi": "^5.0.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/wrap-ansi/node_modules/ansi-regex": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
-            "integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/wrap-ansi/node_modules/string-width": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
-            "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
-            "dependencies": {
-                "emoji-regex": "^7.0.1",
-                "is-fullwidth-code-point": "^2.0.0",
-                "strip-ansi": "^5.1.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/wrap-ansi/node_modules/strip-ansi": {
-            "version": "5.2.0",
-            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
-            "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
-            "dependencies": {
-                "ansi-regex": "^4.1.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/wrappy": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-            "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
-        },
-        "node_modules/write-file-atomic": {
-            "version": "2.4.3",
-            "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.4.3.tgz",
-            "integrity": "sha512-GaETH5wwsX+GcnzhPgKcKjJ6M2Cq3/iZp1WyY/X1CSqrW+jVNM9Y7D8EC2sM4ZG/V8wZlSniJnCKWPmBYAucRQ==",
-            "dependencies": {
-                "graceful-fs": "^4.1.11",
-                "imurmurhash": "^0.1.4",
-                "signal-exit": "^3.0.2"
-            }
-        },
-        "node_modules/ws": {
-            "version": "7.2.5",
-            "resolved": "https://registry.npmjs.org/ws/-/ws-7.2.5.tgz",
-            "integrity": "sha512-C34cIU4+DB2vMyAbmEKossWq2ZQDr6QEyuuCzWrM9zfw1sGc0mYiJ0UnG9zzNykt49C2Fi34hvr2vssFQRS6EA==",
-            "engines": {
-                "node": ">=8.3.0"
-            }
-        },
-        "node_modules/xdg-basedir": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz",
-            "integrity": "sha1-SWsswQnsqNus/i3HK2A8F8WHCtQ=",
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/xml-name-validator": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-3.0.0.tgz",
-            "integrity": "sha512-A5CUptxDsvxKJEU3yO6DuWBSJz/qizqzJKOMIfUJHETbBw/sFaDxgd6fxm1ewUaM0jZ444Fc5vC5ROYurg/4Pw==",
-            "dev": true
-        },
-        "node_modules/xmlbuilder": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-4.0.0.tgz",
-            "integrity": "sha1-mLj2UcowqmJANvEn0RzGbce5B6M=",
-            "dependencies": {
-                "lodash": "^3.5.0"
-            },
-            "engines": {
-                "node": ">=0.8.0"
-            }
-        },
-        "node_modules/xmlbuilder/node_modules/lodash": {
-            "version": "3.10.1",
-            "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
-            "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
-        },
-        "node_modules/xmlchars": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz",
-            "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
-            "dev": true
-        },
-        "node_modules/xmldom": {
-            "version": "0.1.31",
-            "resolved": "https://registry.npmjs.org/xmldom/-/xmldom-0.1.31.tgz",
-            "integrity": "sha512-yS2uJflVQs6n+CyjHoaBmVSqIDevTAWrzMmjG1Gc7h1qQ7uVozNhEPJAwZXWyGQ/Gafo3fCwrcaokezLPupVyQ==",
-            "engines": {
-                "node": ">=0.1"
-            }
-        },
-        "node_modules/xmlhttprequest-ssl": {
-            "version": "1.5.5",
-            "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.5.tgz",
-            "integrity": "sha1-wodrBhaKrcQOV9l+gRkayPQ5iz4=",
-            "engines": {
-                "node": ">=0.4.0"
-            }
-        },
-        "node_modules/xoauth2": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/xoauth2/-/xoauth2-1.2.0.tgz",
-            "integrity": "sha1-8u76wRRyyXHqO8RuVU60sSMhRuU="
-        },
-        "node_modules/xregexp": {
-            "version": "4.3.0",
-            "resolved": "https://registry.npmjs.org/xregexp/-/xregexp-4.3.0.tgz",
-            "integrity": "sha512-7jXDIFXh5yJ/orPn4SXjuVrWWoi4Cr8jfV1eHv9CixKSbU+jY4mxfrBwAuDvupPNKpMUY+FeIqsVw/JLT9+B8g==",
-            "dependencies": {
-                "@babel/runtime-corejs3": "^7.8.3"
-            }
-        },
-        "node_modules/xtend": {
-            "version": "4.0.2",
-            "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
-            "integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.4"
-            }
-        },
-        "node_modules/y18n": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.0.tgz",
-            "integrity": "sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w=="
-        },
-        "node_modules/yallist": {
-            "version": "3.1.1",
-            "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
-            "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g=="
-        },
-        "node_modules/yaml": {
-            "version": "1.10.0",
-            "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.0.tgz",
-            "integrity": "sha512-yr2icI4glYaNG+KWONODapy2/jDdMSDnrONSjblABjD9B4Z5LgiircSt8m8sRZFNi08kG9Sm0uSHtEmP3zaEGg==",
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/yargs": {
-            "version": "13.3.2",
-            "resolved": "https://registry.npmjs.org/yargs/-/yargs-13.3.2.tgz",
-            "integrity": "sha512-AX3Zw5iPruN5ie6xGRIDgqkT+ZhnRlZMLMHAs8tg7nRruy2Nb+i5o9bwghAogtM08q1dpr2LVoS8KSTMYpWXUw==",
-            "dependencies": {
-                "cliui": "^5.0.0",
-                "find-up": "^3.0.0",
-                "get-caller-file": "^2.0.1",
-                "require-directory": "^2.1.1",
-                "require-main-filename": "^2.0.0",
-                "set-blocking": "^2.0.0",
-                "string-width": "^3.0.0",
-                "which-module": "^2.0.0",
-                "y18n": "^4.0.0",
-                "yargs-parser": "^13.1.2"
-            }
-        },
-        "node_modules/yargs-parser": {
-            "version": "13.1.2",
-            "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-13.1.2.tgz",
-            "integrity": "sha512-3lbsNRf/j+A4QuSZfDRA7HRSfWrzO0YjqTJd5kjAq37Zep1CEgaYmrH9Q3GwPiB9cHyd1Y1UwggGhJGoxipbzg==",
-            "dependencies": {
-                "camelcase": "^5.0.0",
-                "decamelize": "^1.2.0"
-            }
-        },
-        "node_modules/yargs-unparser": {
-            "version": "1.6.0",
-            "resolved": "https://registry.npmjs.org/yargs-unparser/-/yargs-unparser-1.6.0.tgz",
-            "integrity": "sha512-W9tKgmSn0DpSatfri0nx52Joq5hVXgeLiqR/5G0sZNDoLZFOr/xjBUDcShCOGNsBnEMNo1KAMBkTej1Hm62HTw==",
-            "dependencies": {
-                "flat": "^4.1.0",
-                "lodash": "^4.17.15",
-                "yargs": "^13.3.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/yargs/node_modules/ansi-regex": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
-            "integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==",
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/yargs/node_modules/string-width": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
-            "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
-            "dependencies": {
-                "emoji-regex": "^7.0.1",
-                "is-fullwidth-code-point": "^2.0.0",
-                "strip-ansi": "^5.1.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/yargs/node_modules/strip-ansi": {
-            "version": "5.2.0",
-            "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
-            "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
-            "dependencies": {
-                "ansi-regex": "^4.1.0"
-            },
-            "engines": {
-                "node": ">=6"
-            }
-        },
-        "node_modules/yauzl": {
-            "version": "2.10.0",
-            "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-2.10.0.tgz",
-            "integrity": "sha1-x+sXyT4RLLEIb6bY5R+wZnt5pfk=",
-            "dependencies": {
-                "buffer-crc32": "~0.2.3",
-                "fd-slicer": "~1.1.0"
-            }
-        },
-        "node_modules/yeast": {
-            "version": "0.1.2",
-            "resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz",
-            "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
-        },
-        "node_modules/yn": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/yn/-/yn-2.0.0.tgz",
-            "integrity": "sha1-5a2ryKz0CPY4X8dklWhMiOavaJo=",
-            "dev": true,
-            "engines": {
-                "node": ">=4"
-            }
-        },
-        "node_modules/zip-stream": {
-            "version": "2.1.3",
-            "resolved": "https://registry.npmjs.org/zip-stream/-/zip-stream-2.1.3.tgz",
-            "integrity": "sha512-EkXc2JGcKhO5N5aZ7TmuNo45budRaFGHOmz24wtJR7znbNqDPmdZtUauKX6et8KAVseAMBOyWJqEpXcHTBsh7Q==",
-            "dependencies": {
-                "archiver-utils": "^2.1.0",
-                "compress-commons": "^2.1.1",
-                "readable-stream": "^3.4.0"
-            },
-            "engines": {
-                "node": ">= 6"
-            }
-        },
-        "node_modules/zustand": {
-            "version": "3.4.1",
-            "resolved": "https://registry.npmjs.org/zustand/-/zustand-3.4.1.tgz",
-            "integrity": "sha512-Kb91vSjy5vwBQ/PQ1a5GE6naS3gCxCgpkujT9zqZSO85+gnvmzgqraMW3ao1I0jR4PwHBXtLTf26r9j7EXoUiQ=="
-        }
-    },
     "dependencies": {
         "@babel/code-frame": {
             "version": "7.8.3",
@@ -26608,14 +3688,6 @@
                             "bundled": true,
                             "optional": true
                         },
-                        "string_decoder": {
-                            "version": "1.1.1",
-                            "bundled": true,
-                            "optional": true,
-                            "requires": {
-                                "safe-buffer": "~5.1.0"
-                            }
-                        },
                         "string-width": {
                             "version": "1.0.2",
                             "bundled": true,
@@ -26626,6 +3698,14 @@
                                 "strip-ansi": "^3.0.0"
                             }
                         },
+                        "string_decoder": {
+                            "version": "1.1.1",
+                            "bundled": true,
+                            "optional": true,
+                            "requires": {
+                                "safe-buffer": "~5.1.0"
+                            }
+                        },
                         "strip-ansi": {
                             "version": "3.0.1",
                             "bundled": true,
@@ -30614,7 +7694,7 @@
             "resolved": "https://registry.npmjs.org/image-size-stream/-/image-size-stream-1.1.0.tgz",
             "integrity": "sha1-Ivou2mbG31AQh0bacUkmSy0l+Gs=",
             "requires": {
-                "image-size": "github:netroy/image-size#da2c863807a3e9602617bdd357b0de3ab4a064c1",
+                "image-size": "image-size@github:netroy/image-size#da2c863807a3e9602617bdd357b0de3ab4a064c1",
                 "readable-stream": "^1.0.33",
                 "tryit": "^1.0.1"
             },
@@ -33045,6 +10125,7 @@
             "resolved": "https://registry.npmjs.org/npm/-/npm-6.14.5.tgz",
             "integrity": "sha512-CDwa3FJd0XJpKDbWCST484H+mCNjF26dPrU+xnREW+upR0UODjMEfXPl3bxWuAwZIX6c2ASg1plLO7jP8ehWeA==",
             "requires": {
+                "JSONStream": "^1.3.5",
                 "abbrev": "~1.1.1",
                 "ansicolors": "~0.3.2",
                 "ansistyles": "~0.1.3",
@@ -33085,7 +10166,6 @@
                 "init-package-json": "^1.10.3",
                 "is-cidr": "^3.0.0",
                 "json-parse-better-errors": "^1.0.2",
-                "JSONStream": "^1.3.5",
                 "lazy-property": "~1.0.0",
                 "libcipm": "^4.0.7",
                 "libnpm": "^3.0.1",
@@ -33170,6 +10250,14 @@
                 "write-file-atomic": "^2.4.3"
             },
             "dependencies": {
+                "JSONStream": {
+                    "version": "1.3.5",
+                    "bundled": true,
+                    "requires": {
+                        "jsonparse": "^1.2.0",
+                        "through": ">=2.2.7 <3"
+                    }
+                },
                 "abbrev": {
                     "version": "1.1.1",
                     "bundled": true
@@ -34416,14 +11504,6 @@
                     "version": "1.3.1",
                     "bundled": true
                 },
-                "JSONStream": {
-                    "version": "1.3.5",
-                    "bundled": true,
-                    "requires": {
-                        "jsonparse": "^1.2.0",
-                        "through": ">=2.2.7 <3"
-                    }
-                },
                 "jsprim": {
                     "version": "1.4.1",
                     "bundled": true,
@@ -35000,9 +12080,9 @@
                     "version": "4.0.4",
                     "bundled": true,
                     "requires": {
+                        "JSONStream": "^1.3.4",
                         "bluebird": "^3.5.1",
                         "figgy-pudding": "^3.4.1",
-                        "JSONStream": "^1.3.4",
                         "lru-cache": "^5.1.1",
                         "make-fetch-happen": "^5.0.0",
                         "npm-package-arg": "^6.1.0",
@@ -35748,19 +12828,6 @@
                     "version": "2.0.0",
                     "bundled": true
                 },
-                "string_decoder": {
-                    "version": "1.3.0",
-                    "bundled": true,
-                    "requires": {
-                        "safe-buffer": "~5.2.0"
-                    },
-                    "dependencies": {
-                        "safe-buffer": {
-                            "version": "5.2.0",
-                            "bundled": true
-                        }
-                    }
-                },
                 "string-width": {
                     "version": "2.1.1",
                     "bundled": true,
@@ -35786,6 +12853,19 @@
                         }
                     }
                 },
+                "string_decoder": {
+                    "version": "1.3.0",
+                    "bundled": true,
+                    "requires": {
+                        "safe-buffer": "~5.2.0"
+                    },
+                    "dependencies": {
+                        "safe-buffer": {
+                            "version": "5.2.0",
+                            "bundled": true
+                        }
+                    }
+                },
                 "stringify-package": {
                     "version": "1.0.1",
                     "bundled": true
@@ -38299,6 +15379,21 @@
                 "tough-cookie": "^2.3.3"
             }
         },
+        "require-directory": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+            "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I="
+        },
+        "require-main-filename": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
+            "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg=="
+        },
+        "require-package-name": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/require-package-name/-/require-package-name-2.0.1.tgz",
+            "integrity": "sha1-wR6XJ2tluOKSP3Xav1+y7ww4Qbk="
+        },
         "require_optional": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/require_optional/-/require_optional-1.0.1.tgz",
@@ -38315,21 +15410,6 @@
                 }
             }
         },
-        "require-directory": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
-            "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I="
-        },
-        "require-main-filename": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
-            "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg=="
-        },
-        "require-package-name": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/require-package-name/-/require-package-name-2.0.1.tgz",
-            "integrity": "sha1-wR6XJ2tluOKSP3Xav1+y7ww4Qbk="
-        },
         "requires-port": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
@@ -39612,14 +16692,6 @@
             "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-2.0.0.tgz",
             "integrity": "sha1-ucczDHBChi9rFC3CdLvMWGbONUY="
         },
-        "string_decoder": {
-            "version": "1.1.1",
-            "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-            "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
-            "requires": {
-                "safe-buffer": "~5.1.0"
-            }
-        },
         "string-width": {
             "version": "2.1.1",
             "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
@@ -39672,6 +16744,14 @@
                 "es-abstract": "^1.17.5"
             }
         },
+        "string_decoder": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
+            "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
+            "requires": {
+                "safe-buffer": "~5.1.0"
+            }
+        },
         "stringify-parameters": {
             "version": "0.0.4",
             "resolved": "https://registry.npmjs.org/stringify-parameters/-/stringify-parameters-0.0.4.tgz",
diff --git a/src/client/views/collections/CollectionLinearView.scss b/src/client/views/collections/CollectionLinearView.scss
index ec8805907..632f8dbab 100644
--- a/src/client/views/collections/CollectionLinearView.scss
+++ b/src/client/views/collections/CollectionLinearView.scss
@@ -20,6 +20,7 @@
         }
 
         .bottomPopup-background {
+            background: rgb(173, 216, 230);
             padding-right: 14px;
             height: 35;
             transform: translate3d(6px, 5px, 0px);
@@ -29,10 +30,11 @@
         }
 
         .bottomPopup-text {
+            color: black;
             display: inline;
             white-space: nowrap;
             padding-left: 8px;
-            padding-right: 4px;
+            padding-right: 20px;
             vertical-align: middle;
             font-size: 12.5px;
         }
@@ -43,8 +45,8 @@
             padding-left: 8px;
             padding-right: 8px;
             vertical-align: middle;
-            background-color: lightgrey;
-            border-radius: 5.5px;
+            background-color: #efefef;
+            border-radius: 3px;
             color: black;
             margin-right: 5px;
         }
@@ -55,8 +57,8 @@
             padding-left: 8px;
             padding-right: 8px;
             vertical-align: middle;
-            background-color: lightgrey;
-            border-radius: 5.5px;
+            background-color: #f3b6b6;
+            border-radius: 3px;
             color: black;
         }
 
diff --git a/src/client/views/collections/CollectionLinearView.tsx b/src/client/views/collections/CollectionLinearView.tsx
index e0b90304b..8d81471d0 100644
--- a/src/client/views/collections/CollectionLinearView.tsx
+++ b/src/client/views/collections/CollectionLinearView.tsx
@@ -167,7 +167,6 @@ export class CollectionLinearView extends CollectionSubView(LinearDocument) {
                     })}
                 </div>
                 {DocumentLinksButton.StartLink ? <span className="bottomPopup-background" style={{
-                    background: backgroundColor === color ? "black" : backgroundColor,
                     pointerEvents: "all"
                 }}
                     onPointerDown={e => e.stopPropagation()} >
@@ -184,7 +183,7 @@ export class CollectionLinearView extends CollectionSubView(LinearDocument) {
 
                     <Tooltip title={<><div className="dash-tooltip">Exit link clicking mode </div></>} placement="top">
                         <span className="bottomPopup-exit" onClick={this.exitLongLinks}>
-                            Clear
+                            Stop
                         </span>
                     </Tooltip>
 
diff --git a/src/client/views/linking/LinkMenu.scss b/src/client/views/linking/LinkMenu.scss
index a2ea42999..bcd93aed1 100644
--- a/src/client/views/linking/LinkMenu.scss
+++ b/src/client/views/linking/LinkMenu.scss
@@ -7,20 +7,20 @@
     z-index: 2001;
 
     .linkMenu-list,
-    .linkMenu-listEditor
-     {
+    .linkMenu-listEditor {
         display: inline-block;
         position: relative;
-        border: 1px solid black;
-        box-shadow: 3px 3px 1.5px grey;
+        border: 1px solid #e4e4e4;
+        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
         background: white;
 
         min-width: 170px;
         max-height: 170px;
         overflow-y: scroll;
         z-index: 10;
-     }
-     .linkMenu-list {
+    }
+
+    .linkMenu-list {
         white-space: nowrap;
         overflow-x: hidden;
         width: 240px;
@@ -46,12 +46,12 @@
     }
 
     .linkMenu-group-name {
+        padding: 10px;
 
 
         &:hover {
             p {
                 background-color: lightgray;
-
             }
 
             p.expand-one {
@@ -65,10 +65,9 @@
 
         p {
             width: 100%;
-            //padding: 4px 6px;
             line-height: 12px;
             border-radius: 5px;
-            font-weight: bold;
+            text-transform: capitalize;
         }
 
         .linkEditor-tableButton {
diff --git a/src/client/views/linking/LinkMenuGroup.tsx b/src/client/views/linking/LinkMenuGroup.tsx
index 74af78234..c7586a467 100644
--- a/src/client/views/linking/LinkMenuGroup.tsx
+++ b/src/client/views/linking/LinkMenuGroup.tsx
@@ -40,7 +40,7 @@ export class LinkMenuGroup extends React.Component<LinkMenuGroupProps> {
         return (
             <div className="linkMenu-group" ref={this._menuRef}>
                 <div className="linkMenu-group-name">
-                    <p className={this.props.groupType === "*" || this.props.groupType === "" ? "" : "expand-one"} > {this.props.groupType}:</p>
+                    <p className={this.props.groupType === "*" || this.props.groupType === "" ? "" : "expand-one"}> {this.props.groupType}:</p>
                 </div>
                 <div className="linkMenu-group-wrapper">
                     {groupItems}
diff --git a/src/client/views/linking/LinkMenuItem.scss b/src/client/views/linking/LinkMenuItem.scss
index 4f9881565..38363c2c4 100644
--- a/src/client/views/linking/LinkMenuItem.scss
+++ b/src/client/views/linking/LinkMenuItem.scss
@@ -4,7 +4,7 @@
     // border-top: 0.5px solid $medium-gray; 
     position: relative;
     display: flex;
-    border-bottom: 0.5px solid black;
+    border-top: 0.5px solid #cdcdcd;
 
     padding-left: 6.5px;
     padding-right: 2px;
diff --git a/src/client/views/linking/LinkPopup.scss b/src/client/views/linking/LinkPopup.scss
index 519044e5e..8ae65158d 100644
--- a/src/client/views/linking/LinkPopup.scss
+++ b/src/client/views/linking/LinkPopup.scss
@@ -1,5 +1,3 @@
-@import "../globalCssVariables";
-
 .linkPopup-container {
     background: white;
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx
index 046a8c856..4b4079670 100644
--- a/src/client/views/nodes/DocumentLinksButton.tsx
+++ b/src/client/views/nodes/DocumentLinksButton.tsx
@@ -143,7 +143,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
                 } else if (DocumentLinksButton.StartLink && DocumentLinksButton.StartLink !== this.props.View.props.Document) {
                     const sourceDoc = DocumentLinksButton.StartLink;
                     const targetDoc = this.props.View.ComponentView?.getAnchor?.() || this.props.View.Document;
-                    const linkDoc = DocUtils.MakeLink({ doc: sourceDoc }, { doc: targetDoc }, "long drag"); //why is long drag here when this is used for completing links by clicking?
+                    const linkDoc = DocUtils.MakeLink({ doc: sourceDoc }, { doc: targetDoc }, "link"); //why is long drag here when this is used for completing links by clicking?
 
                     LinkManager.currentLink = linkDoc;
 
@@ -186,7 +186,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
         } else if (startLink !== endLink) {
             endLink = endLinkView?.docView?._componentView?.getAnchor?.() || endLink;
             startLink = DocumentLinksButton.StartLinkView?.docView?._componentView?.getAnchor?.() || startLink;
-            const linkDoc = DocUtils.MakeLink({ doc: startLink }, { doc: endLink }, DocumentLinksButton.AnnotationId ? "hypothes.is annotation" : "long drag", undefined, undefined, true);
+            const linkDoc = DocUtils.MakeLink({ doc: startLink }, { doc: endLink }, DocumentLinksButton.AnnotationId ? "hypothes.is annotation" : "link", undefined, undefined, true);
 
             LinkManager.currentLink = linkDoc;
 
-- 
cgit v1.2.3-70-g09d2


From 26e9e0a554ee5aff001e2bc10b6802a4e830b63c Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Mon, 26 Jul 2021 12:35:25 -0400
Subject: cleaned up pile view a bit so that it doesn't scale up huge when
 there's one document.  made the pile be round and drop-shadowed.   made the
 pile go away immediately if there are no documents.  made it work with undo.

---
 src/client/documents/Documents.ts                         |  2 --
 src/client/views/StyleProvider.tsx                        | 15 ++++++++-------
 src/client/views/collections/CollectionPileView.tsx       | 15 +++++++++------
 src/client/views/collections/CollectionSubView.tsx        |  2 +-
 .../CollectionFreeFormLayoutEngines.tsx                   |  5 +++--
 5 files changed, 21 insertions(+), 18 deletions(-)

(limited to 'src')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index c2cdf7f72..f1db3e32c 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -1333,9 +1333,7 @@ export namespace DocUtils {
         newCollection.x = NumCast(newCollection.x) + NumCast(newCollection._width) / 2 - 55;
         newCollection.y = NumCast(newCollection.y) + NumCast(newCollection._height) / 2 - 55;
         newCollection._width = newCollection._height = 110;
-        //newCollection.borderRounding = "40px";
         newCollection._jitterRotation = 10;
-        newCollection._backgroundColor = "gray";
         return newCollection;
     }
 
diff --git a/src/client/views/StyleProvider.tsx b/src/client/views/StyleProvider.tsx
index 55f6b8e3c..6b94539c9 100644
--- a/src/client/views/StyleProvider.tsx
+++ b/src/client/views/StyleProvider.tsx
@@ -107,7 +107,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
             if (colsum / col.alpha() > 400 || col.alpha() < 0.25) return Colors.DARK_GRAY;
             return Colors.WHITE;
         case StyleProp.Hidden: return BoolCast(doc?._hidden);
-        case StyleProp.BorderRounding: return StrCast(doc?.[fieldKey + "borderRounding"]);
+        case StyleProp.BorderRounding: return StrCast(doc?.[fieldKey + "borderRounding"], doc?._viewType === CollectionViewType.Pile ? "50%" : "");
         case StyleProp.TitleHeight: return 15;
         case StyleProp.BorderPath: return comicStyle() && props?.renderDepth ? { path: wavyBorderPath(props?.PanelWidth?.() || 0, props?.PanelHeight?.() || 0), fill: wavyBorderPath(props?.PanelWidth?.() || 0, props?.PanelHeight?.() || 0, .08), width: 3 } : { path: undefined, width: 0 };
         case StyleProp.JitterRotation: return comicStyle() ? random(-1, 1, NumCast(doc?.x), NumCast(doc?.y)) * ((props?.PanelWidth() || 0) > (props?.PanelHeight() || 0) ? 5 : 10) : 0;
@@ -136,14 +136,14 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
                 case DocumentType.VID: docColor = docColor || (darkScheme() ? Colors.DARK_GRAY : Colors.LIGHT_GRAY); break;
                 case DocumentType.COL:
                     if (StrCast(Doc.LayoutField(doc)).includes("SliderBox")) break;
-                    docColor = docColor ? Colors.DARK_GRAY :
-                        doc?._isGroup ? "#00000004" : // very faint highlight to show bounds of group
-                            (Doc.IsSystem(doc) ? (darkScheme() ? Colors.DARK_GRAY : Colors.LIGHT_GRAY) : // system docs (seen in treeView) get a grayish background
+                    docColor = docColor ||
+                        (doc?._isGroup ? "#00000004" : // very faint highlight to show bounds of group
+                            (doc?._viewType === CollectionViewType.Pile || Doc.IsSystem(doc) ? (darkScheme() ? Colors.DARK_GRAY : Colors.LIGHT_GRAY) : // system docs (seen in treeView) get a grayish background
                                 isBackground() ? "cyan" : // ?? is there a good default for a background collection
                                     doc.annotationOn ? "#00000015" : // faint interior for collections on PDFs, images, etc
                                         StrCast((props?.renderDepth || 0) > 0 ?
                                             Doc.UserDoc().activeCollectionNestedBackground :
-                                            Doc.UserDoc().activeCollectionBackground));
+                                            Doc.UserDoc().activeCollectionBackground)));
                     break;
                 //if (doc._viewType !== CollectionViewType.Freeform && doc._viewType !== CollectionViewType.Time) return "rgb(62,62,62)";
                 default: docColor = docColor || (darkScheme() ? Colors.DARK_GRAY : Colors.WHITE); break;
@@ -159,8 +159,9 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
             switch (doc?.type) {
                 case DocumentType.COL:
                     return StrCast(doc?.boxShadow,
-                        isBackground() || doc?._isGroup || docProps?.LayoutTemplateString ? undefined : // groups have no drop shadow -- they're supposed to be "invisible".  LayoutString's imply collection is being rendered as something else (e.g., title of a Slide)
-                            `${darkScheme() ? Colors.DARK_GRAY : Colors.MEDIUM_GRAY} ${StrCast(doc.boxShadow, "0.2vw 0.2vw 0.8vw")}`);
+                        doc?._viewType === CollectionViewType.Pile ? "4px 4px 10px 2px" :
+                            isBackground() || doc?._isGroup || docProps?.LayoutTemplateString ? undefined : // groups have no drop shadow -- they're supposed to be "invisible".  LayoutString's imply collection is being rendered as something else (e.g., title of a Slide)
+                                `${darkScheme() ? Colors.DARK_GRAY : Colors.MEDIUM_GRAY} ${StrCast(doc.boxShadow, "0.2vw 0.2vw 0.8vw")}`);
 
                 case DocumentType.LABEL:
                     if (doc?.annotationOn !== undefined) return "black 2px 2px 1px";
diff --git a/src/client/views/collections/CollectionPileView.tsx b/src/client/views/collections/CollectionPileView.tsx
index 6baf633dd..bc1407c53 100644
--- a/src/client/views/collections/CollectionPileView.tsx
+++ b/src/client/views/collections/CollectionPileView.tsx
@@ -1,12 +1,12 @@
-import { action, computed } from "mobx";
+import { action, computed, IReactionDisposer, reaction } from "mobx";
 import { observer } from "mobx-react";
 import { Doc, HeightSym, WidthSym } from "../../../fields/Doc";
 import { NumCast, StrCast } from "../../../fields/Types";
-import { emptyFunction, setupMoveUpEvents, returnTrue } from "../../../Utils";
+import { emptyFunction, returnTrue, setupMoveUpEvents } from "../../../Utils";
 import { DocUtils } from "../../documents/Documents";
 import { SelectionManager } from "../../util/SelectionManager";
 import { SnappingManager } from "../../util/SnappingManager";
-import { UndoManager, undoBatch } from "../../util/UndoManager";
+import { undoBatch, UndoManager } from "../../util/UndoManager";
 import { CollectionFreeFormView } from "./collectionFreeForm/CollectionFreeFormView";
 import "./CollectionPileView.scss";
 import { CollectionSubView } from "./CollectionSubView";
@@ -15,6 +15,7 @@ import React = require("react");
 @observer
 export class CollectionPileView extends CollectionSubView(doc => doc) {
     _originalChrome: any = "";
+    _disposers: { [name: string]: IReactionDisposer } = {};
 
     componentDidMount() {
         if (this.layoutEngine() !== "pass" && this.layoutEngine() !== "starburst") {
@@ -22,9 +23,14 @@ export class CollectionPileView extends CollectionSubView(doc => doc) {
         }
         this._originalChrome = this.layoutDoc._chromeHidden;
         this.layoutDoc._chromeHidden = true;
+
+        // pileups are designed to go away when they are empty.  
+        this._disposers.selected = reaction(() => this.childDocs.length,
+            (num) => !num && this.props.ContainingCollectionView?.removeDocument(this.props.Document));
     }
     componentWillUnmount() {
         this.layoutDoc._chromeHidden = this._originalChrome;
+        Object.values(this._disposers).forEach(disposer => disposer?.());
     }
 
     layoutEngine = () => StrCast(this.Document._pileLayoutEngine);
@@ -107,9 +113,6 @@ export class CollectionPileView extends CollectionSubView(doc => doc) {
             this._undoBatch?.end();
             this._undoBatch = undefined;
             SnappingManager.SetIsDragging(false);
-            if (!this.childDocs.length) {
-                this.props.ContainingCollectionView?.removeDocument(this.props.Document);
-            }
         }, emptyFunction, e.shiftKey && this.layoutEngine() === "pass", this.layoutEngine() === "pass" && e.shiftKey); // this sets _doubleTap
     }
 
diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx
index ca45536f4..f39443ae2 100644
--- a/src/client/views/collections/CollectionSubView.tsx
+++ b/src/client/views/collections/CollectionSubView.tsx
@@ -453,7 +453,7 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
                     generatedDocuments.length > 1 ? generatedDocuments.map(d => { DocUtils.iconify(d); return d; }) : [];
                 if (completed) completed(set);
                 else {
-                    if (isFreeformView) {
+                    if (isFreeformView && generatedDocuments.length > 1) {
                         addDocument(DocUtils.pileup(generatedDocuments, options.x!, options.y!)!);
                     } else {
                         generatedDocuments.forEach(addDocument);
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLayoutEngines.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLayoutEngines.tsx
index afc1babeb..37444a9dc 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLayoutEngines.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLayoutEngines.tsx
@@ -126,7 +126,8 @@ export function computerStarburstLayout(
             replica: ""
         });
     });
-    return normalizeResults(scaleDim, 12, docMap, poolData, viewDefsToJSX, [], 0, []);
+    const divider = { type: "div", color: "transparent", x: -burstRadius[0] / 3, y: 0, width: 15, height: 15, payload: undefined };
+    return normalizeResults(scaleDim, 12, docMap, poolData, viewDefsToJSX, [], 0, [divider]);
 }
 
 
@@ -399,7 +400,7 @@ function normalizeResults(
 ): ViewDefResult[] {
     const grpEles = groupNames.map(gn => ({ x: gn.x, y: gn.y, width: gn.width, height: gn.height }) as ViewDefBounds);
     const docEles = Array.from(docMap.entries()).map(ele => ele[1]);
-    const aggBounds = aggregateBounds(grpEles.concat(docEles.map(de => ({ ...de, type: "doc", payload: "" }))).filter(e => e.zIndex !== -99), 0, 0);
+    const aggBounds = aggregateBounds(extras.concat(grpEles.concat(docEles.map(de => ({ ...de, type: "doc", payload: "" })))).filter(e => e.zIndex !== -99), 0, 0);
     aggBounds.r = Math.max(minWidth, aggBounds.r - aggBounds.x);
     const wscale = panelDim[0] / (aggBounds.r - aggBounds.x);
     let scale = wscale * (aggBounds.b - aggBounds.y) > panelDim[1] ? (panelDim[1]) / (aggBounds.b - aggBounds.y) : wscale;
-- 
cgit v1.2.3-70-g09d2


From ee06e72dab596ead6903c3ab3432ecab458613cb Mon Sep 17 00:00:00 2001
From: dinhanhtruong <70963346+dinhanhtruong@users.noreply.github.com>
Date: Mon, 26 Jul 2021 18:45:28 -0400
Subject: Link editor menu UI cleanup + color changes + temp removal of
 linkpopup for PR

---
 src/client/views/collections/CollectionLinearView.scss |  4 ++--
 src/client/views/linking/LinkEditor.scss               |  8 ++++----
 src/client/views/linking/LinkMenu.scss                 |  9 ++++-----
 src/client/views/linking/LinkMenuItem.scss             |  6 +++---
 src/client/views/linking/LinkPopup.tsx                 |  3 +--
 src/client/views/nodes/DocumentLinksButton.scss        |  1 +
 src/client/views/nodes/DocumentLinksButton.tsx         |  4 ++--
 src/client/views/pdf/AnchorMenu.tsx                    | 13 +++++++------
 8 files changed, 24 insertions(+), 24 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionLinearView.scss b/src/client/views/collections/CollectionLinearView.scss
index 632f8dbab..dd1e1fbe8 100644
--- a/src/client/views/collections/CollectionLinearView.scss
+++ b/src/client/views/collections/CollectionLinearView.scss
@@ -20,10 +20,10 @@
         }
 
         .bottomPopup-background {
-            background: rgb(173, 216, 230);
+            background: $light-blue;
             padding-right: 14px;
             height: 35;
-            transform: translate3d(6px, 5px, 0px);
+            transform: translate3d(6px, 0px, 0px);
             padding-top: 6.5px;
             padding-bottom: 7px;
             padding-left: 5px;
diff --git a/src/client/views/linking/LinkEditor.scss b/src/client/views/linking/LinkEditor.scss
index 839ebf894..9fddede65 100644
--- a/src/client/views/linking/LinkEditor.scss
+++ b/src/client/views/linking/LinkEditor.scss
@@ -22,7 +22,7 @@
 .linkEditor-info {
     //border-bottom: 0.5px solid $light-gray;
     //padding-bottom: 1px;
-    padding-top: 5px;
+    padding: 12px;
     padding-left: 5px;
     //margin-bottom: 6px;
     display: flex;
@@ -61,7 +61,7 @@
 }
 
 .linkEditor-description {
-    padding-left: 6.5px;
+    padding-left: 26px;
     padding-right: 6.5px;
     padding-bottom: 3.5px;
 
@@ -107,9 +107,9 @@
 }
 
 .linkEditor-followingDropdown {
-    padding-left: 6.5px;
+    padding-left: 26px;
     padding-right: 6.5px;
-    padding-bottom: 6px;
+    padding-bottom: 15cpx;
 
     &:hover {
         cursor: pointer;
diff --git a/src/client/views/linking/LinkMenu.scss b/src/client/views/linking/LinkMenu.scss
index bcd93aed1..19c6463d3 100644
--- a/src/client/views/linking/LinkMenu.scss
+++ b/src/client/views/linking/LinkMenu.scss
@@ -13,9 +13,8 @@
         border: 1px solid #e4e4e4;
         box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
         background: white;
-
         min-width: 170px;
-        max-height: 170px;
+        max-height: 230px;
         overflow-y: scroll;
         z-index: 10;
     }
@@ -50,9 +49,9 @@
 
 
         &:hover {
-            p {
-                background-color: lightgray;
-            }
+            // p {
+            //     background-color: lightgray;
+            // }
 
             p.expand-one {
                 width: calc(100% + 20px);
diff --git a/src/client/views/linking/LinkMenuItem.scss b/src/client/views/linking/LinkMenuItem.scss
index 38363c2c4..90722daf9 100644
--- a/src/client/views/linking/LinkMenuItem.scss
+++ b/src/client/views/linking/LinkMenuItem.scss
@@ -55,8 +55,8 @@
 
                 .linkMenu-destination-title {
                     text-decoration: none;
-                    color: rgb(85, 120, 196);
-                    font-size: 14px;
+                    color: #4476F7;
+                    font-size: 16px;
                     padding-bottom: 2px;
                     padding-right: 4px;
                     margin-right: 4px;
@@ -76,7 +76,7 @@
                 text-decoration: none;
                 font-style: italic;
                 color: rgb(95, 97, 102);
-                font-size: 10px;
+                font-size: 9px;
                 margin-left: 20px;
                 max-width: 125px;
                 height: auto;
diff --git a/src/client/views/linking/LinkPopup.tsx b/src/client/views/linking/LinkPopup.tsx
index 89d5b7272..2c4b718f4 100644
--- a/src/client/views/linking/LinkPopup.tsx
+++ b/src/client/views/linking/LinkPopup.tsx
@@ -42,14 +42,13 @@ interface LinkPopupProps {
 export class LinkPopup extends React.Component<LinkPopupProps> {
     @observable private linkURL: string = "";
     @observable public view?: EditorView;
-    private Instance: LinkPopup = this;
 
 
 
     // TODO: should check for valid URL
     @undoBatch
     makeLinkToURL = (target: string, lcoation: string) => {
-        ((this as any)?.TextView as FormattedTextBox).makeLinkAnchor(undefined, "onRadd:rightight", target, target);
+        ((this.view as any)?.TextView as FormattedTextBox).makeLinkAnchor(undefined, "onRadd:rightight", target, target);
     }
 
     @action
diff --git a/src/client/views/nodes/DocumentLinksButton.scss b/src/client/views/nodes/DocumentLinksButton.scss
index daffaf9e7..93e1737fe 100644
--- a/src/client/views/nodes/DocumentLinksButton.scss
+++ b/src/client/views/nodes/DocumentLinksButton.scss
@@ -6,6 +6,7 @@
     min-height: 20;
     position: absolute;
 }
+
 .documentLinksButton,
 .documentLinksButton-endLink,
 .documentLinksButton-startLink {
diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx
index 4b4079670..ddc36daa1 100644
--- a/src/client/views/nodes/DocumentLinksButton.tsx
+++ b/src/client/views/nodes/DocumentLinksButton.tsx
@@ -143,7 +143,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
                 } else if (DocumentLinksButton.StartLink && DocumentLinksButton.StartLink !== this.props.View.props.Document) {
                     const sourceDoc = DocumentLinksButton.StartLink;
                     const targetDoc = this.props.View.ComponentView?.getAnchor?.() || this.props.View.Document;
-                    const linkDoc = DocUtils.MakeLink({ doc: sourceDoc }, { doc: targetDoc }, "link"); //why is long drag here when this is used for completing links by clicking?
+                    const linkDoc = DocUtils.MakeLink({ doc: sourceDoc }, { doc: targetDoc }, "links"); //why is long drag here when this is used for completing links by clicking?
 
                     LinkManager.currentLink = linkDoc;
 
@@ -257,7 +257,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
             <div className={"documentLinksButton"}
                 onPointerDown={this.onLinkButtonDown} onClick={this.onLinkClick}
                 style={{
-                    backgroundColor: this.props.InMenu ? "" : "#add8e6",
+                    backgroundColor: this.props.InMenu ? "" : '#BDDDF5',
                     color: this.props.InMenu ? "white" : "black",
                     width: btnDim,
                     height: btnDim,
diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx
index f9e12f462..70ca19842 100644
--- a/src/client/views/pdf/AnchorMenu.tsx
+++ b/src/client/views/pdf/AnchorMenu.tsx
@@ -147,12 +147,13 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
                     </button>
                 </Tooltip>,
 
-                <Tooltip key="link" title={<div className="dash-tooltip">{"Link selected text to document or URL"}</div>}>
-                    <button className="antimodeMenu-button link" onPointerDown={this.toggleLinkPopup} style={{}}>
-                        <FontAwesomeIcon icon="link" size="lg" />
-                    </button>
-                </Tooltip>,
-                <LinkPopup showPopup={this._showLinkPopup} />
+                //NOTE: link popup is currently incomplete
+                // <Tooltip key="link" title={<div className="dash-tooltip">{"Link selected text to document or URL"}</div>}>
+                //     <button className="antimodeMenu-button link" onPointerDown={this.toggleLinkPopup} style={{}}>
+                //         <FontAwesomeIcon icon="link" size="lg" />
+                //     </button>
+                // </Tooltip>,
+                // <LinkPopup showPopup={this._showLinkPopup} />
             ] : [
                 <Tooltip key="trash" title={<div className="dash-tooltip">{"Remove Link Anchor"}</div>}>
                     <button className="antimodeMenu-button" onPointerDown={this.Delete}>
-- 
cgit v1.2.3-70-g09d2


From 8717e90d12c8caa16984f5a55eb8f442dcf5cbab Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Tue, 27 Jul 2021 14:31:30 -0400
Subject: fixe MakeClone to handle links properly.  fixed cloning richtext to
 update rich text references to documents properly.  fixed dragging to call
 MakeClone properly.

---
 src/client/util/DragManager.ts                     | 12 +++----
 src/client/util/LinkManager.ts                     | 38 ++++++++--------------
 src/client/util/Scripting.ts                       |  2 +-
 src/client/views/StyleProvider.tsx                 |  2 +-
 src/client/views/collections/CollectionSubView.tsx |  2 +-
 .../collections/collectionFreeForm/MarqueeView.tsx |  4 +--
 .../collectionSchema/CollectionSchemaCells.tsx     | 20 ++++++------
 src/fields/Doc.ts                                  | 33 ++++++++++++-------
 8 files changed, 55 insertions(+), 58 deletions(-)

(limited to 'src')

diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index ab58f25e9..dd50727dd 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -210,16 +210,16 @@ export namespace DragManager {
             dropDoc instanceof Doc && DocUtils.MakeLinkToActiveAudio(() => dropDoc);
             return dropDoc;
         };
-        const finishDrag = (e: DragCompleteEvent) => {
+        const finishDrag = async (e: DragCompleteEvent) => {
             const docDragData = e.docDragData;
             dropEvent?.(); // glr: optional additional function to be called - in this case with presentation trails
             if (docDragData && !docDragData.droppedDocuments.length) {
                 docDragData.dropAction = dragData.userDropAction || dragData.dropAction;
                 docDragData.droppedDocuments =
-                    dragData.draggedDocuments.map(d => !dragData.isSelectionMove && !dragData.userDropAction && ScriptCast(d.onDragStart) ? addAudioTag(ScriptCast(d.onDragStart).script.run({ this: d }).result) :
+                    await Promise.all(dragData.draggedDocuments.map(async d => !dragData.isSelectionMove && !dragData.userDropAction && ScriptCast(d.onDragStart) ? addAudioTag(ScriptCast(d.onDragStart).script.run({ this: d }).result) :
                         docDragData.dropAction === "alias" ? Doc.MakeAlias(d) :
                             docDragData.dropAction === "proto" ? Doc.GetProto(d) :
-                                docDragData.dropAction === "copy" ? Doc.MakeClone(d) : d);
+                                docDragData.dropAction === "copy" ? (await Doc.MakeClone(d)).clone : d));
                 !["same", "proto"].includes(docDragData.dropAction as any) && docDragData.droppedDocuments.forEach((drop: Doc, i: number) => {
                     const dragProps = Cast(dragData.draggedDocuments[i].removeDropProperties, listSpec("string"), []);
                     const remProps = (dragData?.removeDropProperties || []).concat(Array.from(dragProps));
@@ -509,7 +509,7 @@ export namespace DragManager {
                 `translate(${(xs[i] += moveVec.x) + (options?.offsetX || 0)}px, ${(ys[i] += moveVec.y) + (options?.offsetY || 0)}px)  scale(${scaleXs[i]}, ${scaleYs[i]})`)
             );
         };
-        const upHandler = (e: PointerEvent) => {
+        const upHandler = async (e: PointerEvent) => {
             dispatchDrag(document.elementFromPoint(e.x, e.y) || document.body, e, new DragCompleteEvent(false, dragData), snapDrag(e, xFromLeft, yFromTop, xFromRight, yFromBottom), finishDrag, options);
             endDrag();
         };
@@ -517,7 +517,7 @@ export namespace DragManager {
         document.addEventListener("pointerup", upHandler);
     }
 
-    function dispatchDrag(target: Element, e: PointerEvent, complete: DragCompleteEvent, pos: { x: number, y: number }, finishDrag?: (e: DragCompleteEvent) => void, options?: DragOptions) {
+    async function dispatchDrag(target: Element, e: PointerEvent, complete: DragCompleteEvent, pos: { x: number, y: number }, finishDrag?: (e: DragCompleteEvent) => void, options?: DragOptions) {
         const dropArgs = {
             bubbles: true,
             detail: {
@@ -531,7 +531,7 @@ export namespace DragManager {
             }
         };
         target.dispatchEvent(new CustomEvent<DropEvent>("dashPreDrop", dropArgs));
-        finishDrag?.(complete);
+        await finishDrag?.(complete);
         target.dispatchEvent(new CustomEvent<DropEvent>("dashOnDrop", dropArgs));
         options?.dragComplete?.(complete);
     }
diff --git a/src/client/util/LinkManager.ts b/src/client/util/LinkManager.ts
index 3c3d5c3b8..08f4ac9b7 100644
--- a/src/client/util/LinkManager.ts
+++ b/src/client/util/LinkManager.ts
@@ -1,15 +1,14 @@
+import { observable, observe, action } from "mobx";
 import { computedFn } from "mobx-utils";
-import { Doc, DocListCast, Opt, DirectLinksSym, Field } from "../../fields/Doc";
-import { BoolCast, Cast, StrCast, PromiseValue } from "../../fields/Types";
+import { DirectLinksSym, Doc, DocListCast, Field, Opt } from "../../fields/Doc";
+import { List } from "../../fields/List";
+import { ProxyField } from "../../fields/Proxy";
+import { BoolCast, Cast, PromiseValue, StrCast } from "../../fields/Types";
 import { LightboxView } from "../views/LightboxView";
 import { DocumentViewSharedProps, ViewAdjustment } from "../views/nodes/DocumentView";
 import { DocumentManager } from "./DocumentManager";
 import { SharingManager } from "./SharingManager";
 import { UndoManager } from "./UndoManager";
-import { observe, observable, reaction } from "mobx";
-import { listSpec } from "../../fields/Schema";
-import { List } from "../../fields/List";
-import { ProxyField } from "../../fields/Proxy";
 
 type CreateViewFunc = (doc: Doc, followLinkLocation: string, finished?: () => void) => void;
 /* 
@@ -34,7 +33,7 @@ export class LinkManager {
         LinkManager._instance = this;
         setTimeout(() => {
             LinkManager.userDocs = [Doc.LinkDBDoc().data as Doc, ...SharingManager.Instance.users.map(user => user.linkDatabase)];
-            const addLinkToDoc = (link: Doc): any => {
+            const addLinkToDoc = action((link: Doc): any => {
                 const a1 = link?.anchor1;
                 const a2 = link?.anchor2;
                 if (a1 instanceof Promise || a2 instanceof Promise) return PromiseValue(a1).then(a1 => PromiseValue(a2).then(a2 => addLinkToDoc(link)));
@@ -43,8 +42,8 @@ export class LinkManager {
                     Doc.GetProto(a2)[DirectLinksSym].add(link);
                     Doc.GetProto(link)[DirectLinksSym].add(link);
                 }
-            };
-            const remLinkFromDoc = (link: Doc): any => {
+            });
+            const remLinkFromDoc = action((link: Doc): any => {
                 const a1 = link?.anchor1;
                 const a2 = link?.anchor2;
                 if (a1 instanceof Promise || a2 instanceof Promise) return PromiseValue(a1).then(a1 => PromiseValue(a2).then(a2 => remLinkFromDoc(link)));
@@ -53,7 +52,7 @@ export class LinkManager {
                     Doc.GetProto(a2)[DirectLinksSym].delete(link);
                     Doc.GetProto(link)[DirectLinksSym].delete(link);
                 }
-            };
+            });
             const watchUserLinks = (userLinks: List<Doc>) => {
                 const toRealField = (field: Field) => field instanceof ProxyField ? field.value() : field;  // see List.ts.  data structure is not a simple list of Docs, but a list of ProxyField/Fields
                 observe(userLinks, change => {
@@ -75,8 +74,10 @@ export class LinkManager {
         });
     }
 
-    public addLink(linkDoc: Doc) {
-        return Doc.AddDocToList(Doc.LinkDBDoc(), "data", linkDoc);
+    public addLink(linkDoc: Doc, checkExists = false) {
+        if (!checkExists || !DocListCast(Doc.LinkDBDoc().data).includes(linkDoc)) {
+            Doc.AddDocToList(Doc.LinkDBDoc(), "data", linkDoc);
+        }
     }
     public deleteLink(linkDoc: Doc) { return Doc.RemoveDocFromList(Doc.LinkDBDoc(), "data", linkDoc); }
     public deleteAllLinksOnAnchor(anchor: Doc) { LinkManager.Instance.relatedLinker(anchor).forEach(linkDoc => LinkManager.Instance.deleteLink(linkDoc)); }
@@ -85,19 +86,6 @@ export class LinkManager {
     public getAllDirectLinks(anchor: Doc): Doc[] {
         return Array.from(Doc.GetProto(anchor)[DirectLinksSym]);
     } // finds all links that contain the given anchor
-    public getAllLinks(): Doc[] { return []; }//this.allLinks(); }
-
-    // allLinks = computedFn(function allLinks(this: any): Doc[] {
-    //     const linkData = Doc.LinkDBDoc().data;
-    //     const lset = new Set<Doc>(DocListCast(linkData));
-    //     SharingManager.Instance.users.forEach(user => DocListCast(user.linkDatabase?.data).forEach(doc => lset.add(doc)));
-    //     LinkManager.Instance.allLinks().filter(link => {
-    //         const a1 = Cast(link?.anchor1, Doc, null);
-    //         const a2 = Cast(link?.anchor2, Doc, null);
-    //         return link && ((a1?.author !== undefined && a2?.author !== undefined) || link.author === Doc.CurrentUserEmail) && (Doc.AreProtosEqual(anchor, a1) || Doc.AreProtosEqual(anchor, a2) || Doc.AreProtosEqual(link, anchor));
-    //     });
-    //     return Array.from(lset);
-    // }, true);
 
     relatedLinker = computedFn(function relatedLinker(this: any, anchor: Doc): Doc[] {
         const lfield = Doc.LayoutFieldKey(anchor);
diff --git a/src/client/util/Scripting.ts b/src/client/util/Scripting.ts
index c3c3083be..f981f84cd 100644
--- a/src/client/util/Scripting.ts
+++ b/src/client/util/Scripting.ts
@@ -181,7 +181,7 @@ function Run(script: string | undefined, customParams: string[], diagnostics: an
             if (batch) {
                 batch.end();
             }
-            onError?.(error);
+            onError?.(script + " " + error);
             return { success: false, error, result: errorVal };
         }
     };
diff --git a/src/client/views/StyleProvider.tsx b/src/client/views/StyleProvider.tsx
index 6b94539c9..32ddc140c 100644
--- a/src/client/views/StyleProvider.tsx
+++ b/src/client/views/StyleProvider.tsx
@@ -101,7 +101,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
             const backColor = backgroundCol();
             if (!backColor) return undefined;
             const nonAlphaColor = backColor.startsWith("#") ? (backColor as string).substring(0, 7) :
-                backColor.startsWith("rgba") ? backColor.replace(/,.[^,]*\)/, ")").replace("rgba", "rgb") : backColor
+                backColor.startsWith("rgba") ? backColor.replace(/,.[^,]*\)/, ")").replace("rgba", "rgb") : backColor;
             const col = Color(nonAlphaColor).rgb();
             const colsum = (col.red() + col.green() + col.blue());
             if (colsum / col.alpha() > 400 || col.alpha() < 0.25) return Colors.DARK_GRAY;
diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx
index f39443ae2..a5d27f038 100644
--- a/src/client/views/collections/CollectionSubView.tsx
+++ b/src/client/views/collections/CollectionSubView.tsx
@@ -454,7 +454,7 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
                 if (completed) completed(set);
                 else {
                     if (isFreeformView && generatedDocuments.length > 1) {
-                        addDocument(DocUtils.pileup(generatedDocuments, options.x!, options.y!)!);
+                        addDocument(DocUtils.pileup(generatedDocuments, options.x!, options.y!));
                     } else {
                         generatedDocuments.forEach(addDocument);
                     }
diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
index b1f2750c3..1f4fcb2a5 100644
--- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
+++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
@@ -368,8 +368,8 @@ export class MarqueeView extends React.Component<SubCollectionViewProps & Marque
         SelectionManager.DeselectAll();
         selected.forEach(d => this.props.removeDocument?.(d));
         const newCollection = DocUtils.pileup(selected, this.Bounds.left + this.Bounds.width / 2, this.Bounds.top + this.Bounds.height / 2);
-        this.props.addDocument?.(newCollection!);
-        this.props.selectDocuments([newCollection!]);
+        this.props.addDocument?.(newCollection);
+        this.props.selectDocuments([newCollection]);
         MarqueeOptionsMenu.Instance.fadeOut(true);
         this.hideMarquee();
     }
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx
index 90f64f163..0c434eae5 100644
--- a/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaCells.tsx
@@ -246,13 +246,13 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                     } else {
                                         // check if the input is a number
                                         let inputIsNum = true;
-                                        for (let s of value) {
-                                            if (isNaN(parseInt(s)) && !(s == ".") && !(s == ",")) {
+                                        for (const s of value) {
+                                            if (isNaN(parseInt(s)) && !(s === ".") && !(s === ",")) {
                                                 inputIsNum = false;
                                             }
                                         }
                                         // check if the input is a boolean
-                                        let inputIsBool: boolean = value == "false" || value == "true";
+                                        const inputIsBool: boolean = value === "false" || value === "true";
                                         // what to do in the case 
                                         if (!inputIsNum && !inputIsBool && !value.startsWith("=")) {
                                             // if it's not a number, it's a string, and should be processed as such
@@ -263,12 +263,12 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                                 const vsqLength = valueSansQuotes.length;
                                                 // get rid of outer quotes
                                                 valueSansQuotes = valueSansQuotes.substring(value.startsWith("\"") ? 1 : 0,
-                                                    valueSansQuotes.charAt(vsqLength - 1) == "\"" ? vsqLength - 1 : vsqLength);
+                                                    valueSansQuotes.charAt(vsqLength - 1) === "\"" ? vsqLength - 1 : vsqLength);
                                             }
                                             let inputAsString = '"';
                                             // escape any quotes in the string
                                             for (const i of valueSansQuotes) {
-                                                if (i == '"') {
+                                                if (i === '"') {
                                                     inputAsString += '\\"';
                                                 } else {
                                                     inputAsString += i;
@@ -278,7 +278,7 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                             inputAsString += '"';
                                             //two options here: we can strip off outer quotes or we can figure out what's going on with the script
                                             const script = CompileScript(inputAsString, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            const changeMade = inputAsString.length !== value.length || inputAsString.length - 2 !== value.length
+                                            const changeMade = inputAsString.length !== value.length || inputAsString.length - 2 !== value.length;
                                             script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
                                             // handle numbers and expressions
                                         } else if (inputIsNum || value.startsWith("=")) {
@@ -286,18 +286,18 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
                                             const inputscript = value.substring(value.startsWith("=") ? 1 : 0);
                                             // if commas are not stripped, the parser only considers the numbers after the last comma
                                             let inputSansCommas = "";
-                                            for (let s of inputscript) {
-                                                if (!(s == ",")) {
+                                            for (const s of inputscript) {
+                                                if (!(s === ",")) {
                                                     inputSansCommas += s;
                                                 }
                                             }
                                             const script = CompileScript(inputSansCommas, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
+                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length;
                                             script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
                                             // handle booleans
                                         } else if (inputIsBool) {
                                             const script = CompileScript(value, { requiredType: type, typecheck: false, editable: true, addReturn: true, params: { this: Doc.name, $r: "number", $c: "number", $: "any" } });
-                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length
+                                            const changeMade = value.length !== value.length || value.length - 2 !== value.length;
                                             script.compiled && (retVal = this.applyToDoc(changeMade ? this._rowDoc : this._rowDataDoc, this.props.row, this.props.col, script.run));
                                         }
                                     }
diff --git a/src/fields/Doc.ts b/src/fields/Doc.ts
index 464a8ad05..7993af149 100644
--- a/src/fields/Doc.ts
+++ b/src/fields/Doc.ts
@@ -516,30 +516,30 @@ export namespace Doc {
         return alias;
     }
 
-    export async function makeClone(doc: Doc, cloneMap: Map<string, Doc>, rtfs: { copy: Doc, key: string, field: RichTextField }[], exclusions: string[], dontCreate: boolean, asBranch: boolean): Promise<Doc> {
+    export async function makeClone(doc: Doc, cloneMap: Map<string, Doc>, linkMap: Map<Doc, Doc>, rtfs: { copy: Doc, key: string, field: RichTextField }[], exclusions: string[], dontCreate: boolean, asBranch: boolean): Promise<Doc> {
         if (Doc.IsBaseProto(doc)) return doc;
         if (cloneMap.get(doc[Id])) return cloneMap.get(doc[Id])!;
         const copy = dontCreate ? asBranch ? (Cast(doc.branchMaster, Doc, null) || doc) : doc : new Doc(undefined, true);
         cloneMap.set(doc[Id], copy);
-        if (LinkManager.Instance.getAllLinks().includes(doc) && LinkManager.Instance.getAllLinks().indexOf(copy) === -1) LinkManager.Instance.addLink(copy);
-        const filter = [...exclusions, ...Cast(doc.cloneFieldFilter, listSpec("string"), [])];
-        await Promise.all([...Object.keys(doc), "links"].map(async key => {
+        const fieldExclusions = (doc.type === DocumentType.TEXTANCHOR) ? exclusions.filter(ex => ex !== "annotationOn") : exclusions;
+        const filter = [...fieldExclusions, ...Cast(doc.cloneFieldFilter, listSpec("string"), [])];
+        await Promise.all(Object.keys(doc).map(async key => {
             if (filter.includes(key)) return;
             const assignKey = (val: any) => !dontCreate && (copy[key] = val);
             const cfield = ComputedField.WithoutComputed(() => FieldValue(doc[key]));
-            const field = key === "links" && Doc.IsPrototype(doc) ? doc[key] : ProxyField.WithoutProxy(() => doc[key]);
+            const field = ProxyField.WithoutProxy(() => doc[key]);
             const copyObjectField = async (field: ObjectField) => {
                 const list = Cast(doc[key], listSpec(Doc));
                 const docs = list && (await DocListCastAsync(list))?.filter(d => d instanceof Doc);
                 if (docs !== undefined && docs.length) {
-                    const clones = await Promise.all(docs.map(async d => Doc.makeClone(d, cloneMap, rtfs, exclusions, dontCreate, asBranch)));
+                    const clones = await Promise.all(docs.map(async d => Doc.makeClone(d, cloneMap, linkMap, rtfs, exclusions, dontCreate, asBranch)));
                     !dontCreate && assignKey(new List<Doc>(clones));
                 } else if (doc[key] instanceof Doc) {
-                    assignKey(key.includes("layout[") ? undefined : key.startsWith("layout") ? doc[key] as Doc : await Doc.makeClone(doc[key] as Doc, cloneMap, rtfs, exclusions, dontCreate, asBranch)); // reference documents except copy documents that are expanded teplate fields 
+                    assignKey(key.includes("layout[") ? undefined : key.startsWith("layout") ? doc[key] as Doc : await Doc.makeClone(doc[key] as Doc, cloneMap, linkMap, rtfs, exclusions, dontCreate, asBranch)); // reference documents except copy documents that are expanded teplate fields 
                 } else {
                     !dontCreate && assignKey(ObjectField.MakeCopy(field));
                     if (field instanceof RichTextField) {
-                        if (field.Data.includes('"docid":') || field.Data.includes('"targetId":') || field.Data.includes('"linkId":')) {
+                        if (field.Data.includes('"audioId":') || field.Data.includes('"textId":') || field.Data.includes('"anchorId":')) {
                             rtfs.push({ copy, key, field });
                         }
                     }
@@ -547,14 +547,17 @@ export namespace Doc {
             };
             if (key === "proto") {
                 if (doc[key] instanceof Doc) {
-                    assignKey(await Doc.makeClone(doc[key]!, cloneMap, rtfs, exclusions, dontCreate, asBranch));
+                    assignKey(await Doc.makeClone(doc[key] as Doc, cloneMap, linkMap, rtfs, exclusions, dontCreate, asBranch));
+                }
+            } else if (key === "anchor1" || key === "anchor2") {
+                if (doc[key] instanceof Doc) {
+                    assignKey(await Doc.makeClone(doc[key] as Doc, cloneMap, linkMap, rtfs, exclusions, true, asBranch));
                 }
             } else {
                 if (field instanceof RefField) {
                     assignKey(field);
                 } else if (cfield instanceof ComputedField) {
                     !dontCreate && assignKey(ComputedField.MakeFunction(cfield.script.originalScript));
-                    (key === "links" && field instanceof ObjectField) && await copyObjectField(field);
                 } else if (field instanceof ObjectField) {
                     await copyObjectField(field);
                 } else if (field instanceof Promise) {
@@ -564,6 +567,10 @@ export namespace Doc {
                 }
             }
         }));
+        for (const link of Array.from(doc[DirectLinksSym])) {
+            const linkClone = await Doc.makeClone(link, cloneMap, linkMap, rtfs, exclusions, dontCreate, asBranch);
+            linkMap.set(link, linkClone);
+        }
         if (!dontCreate) {
             Doc.SetInPlace(copy, "title", (asBranch ? "BRANCH: " : "CLONE: ") + doc.title, true);
             asBranch ? (copy.branchOf = doc) : (copy.cloneOf = doc);
@@ -576,8 +583,10 @@ export namespace Doc {
     }
     export async function MakeClone(doc: Doc, dontCreate: boolean = false, asBranch = false) {
         const cloneMap = new Map<string, Doc>();
+        const linkMap = new Map<Doc, Doc>();
         const rtfMap: { copy: Doc, key: string, field: RichTextField }[] = [];
-        const copy = await Doc.makeClone(doc, cloneMap, rtfMap, ["context", "annotationOn", "cloneOf", "branches", "branchOf"], dontCreate, asBranch);
+        const copy = await Doc.makeClone(doc, cloneMap, linkMap, rtfMap, ["context", "annotationOn", "cloneOf", "branches", "branchOf"], dontCreate, asBranch);
+        Array.from(linkMap.entries()).map((links: Doc[]) => LinkManager.Instance.addLink(links[1], true));
         rtfMap.map(({ copy, key, field }) => {
             const replacer = (match: any, attr: string, id: string, offset: any, string: any) => {
                 const mapped = cloneMap.get(id);
@@ -589,7 +598,7 @@ export namespace Doc {
             };
             const regex = `(${Utils.prepend("/doc/")})([^"]*)`;
             const re = new RegExp(regex, "g");
-            copy[key] = new RichTextField(field.Data.replace(/("docid":|"targetId":|"linkId":)"([^"]+)"/g, replacer).replace(re, replacer2), field.Text);
+            copy[key] = new RichTextField(field.Data.replace(/("textId":|"audioId":|"anchorId":)"([^"]+)"/g, replacer).replace(re, replacer2), field.Text);
         });
         return { clone: copy, map: cloneMap };
     }
-- 
cgit v1.2.3-70-g09d2


From 16c2a900e9116474caa67e4d5de15e2c51477292 Mon Sep 17 00:00:00 2001
From: vkalev <vjk1883@gmail.com>
Date: Tue, 27 Jul 2021 18:54:53 -0400
Subject: changing format of controls/handles + adding color enums

---
 src/client/views/InkControls.tsx        | 73 ++++++++++++++++++---------------
 src/client/views/InkHandles.tsx         | 13 +++---
 src/client/views/InkStrokeProperties.ts | 38 +++++++++--------
 src/client/views/InkingStroke.tsx       | 40 +++++++-----------
 4 files changed, 84 insertions(+), 80 deletions(-)

(limited to 'src')

diff --git a/src/client/views/InkControls.tsx b/src/client/views/InkControls.tsx
index 23f22c774..090af10cc 100644
--- a/src/client/views/InkControls.tsx
+++ b/src/client/views/InkControls.tsx
@@ -6,8 +6,13 @@ import { setupMoveUpEvents, emptyFunction } from "../../Utils";
 import { UndoManager } from "../util/UndoManager";
 import { ControlPoint, InkData, PointData } from "../../fields/InkField";
 import { Transform } from "../util/Transform";
+import { Colors } from "./global/globalEnums";
+import { Doc } from "../../fields/Doc";
+import { listSpec } from "../../fields/Schema";
+import { Cast } from "../../fields/Types";
 
 export interface InkControlProps {
+    inkDoc: Doc;
     data: InkData;
     addedPoints: PointData[];
     format: number[];
@@ -30,19 +35,22 @@ export class InkControls extends React.Component<InkControlProps> {
             const controlUndo = UndoManager.StartBatch("DocDecs set radius");
             const screenScale = this.props.ScreenToLocalTransform().Scale;
             const order = controlIndex % 4;
-            const handleIndexA  = order === 2 ? controlIndex - 1 : controlIndex - 2;
+            const handleIndexA = order === 2 ? controlIndex - 1 : controlIndex - 2;
             const handleIndexB = order === 2 ? controlIndex + 2 : controlIndex + 1;
+            const brokenIndices = Cast(this.props.inkDoc, listSpec("number"));
             setupMoveUpEvents(this, e,
                 (e: PointerEvent, down: number[], delta: number[]) => {
                     InkStrokeProperties.Instance?.moveControl(-delta[0] * screenScale, -delta[1] * screenScale, controlIndex);
                     return false;
                 },
-                () => controlUndo?.end(), 
-                emptyFunction);
-                // action((e: PointerEvent, doubleTap: boolean | undefined) =>
-                // { if (doubleTap && InkStrokeProperties.Instance?._brokenIndices.includes(controlIndex)) {
-                //     InkStrokeProperties.Instance?.snapHandleTangent(controlIndex, handleIndexA, handleIndexB);
-                // }}));
+                () => controlUndo?.end(),
+                brokenIndices ?
+                    action((e: PointerEvent, doubleTap: boolean | undefined) => {
+                        if (doubleTap && brokenIndices.includes(controlIndex)) {
+                            InkStrokeProperties.Instance?.snapHandleTangent(controlIndex, handleIndexA, handleIndexB);
+                        }
+                    })
+                    : emptyFunction);
         }
     }
 
@@ -75,7 +83,7 @@ export class InkControls extends React.Component<InkControlProps> {
     @action onLeaveControl = () => { this._overControl = -1; };
     @action onEnterAddPoint = (i: number) => { this._overAddPoint = i; };
     @action onLeaveAddPoint = () => { this._overAddPoint = -1; };
- 
+
     render() {
         const formatInstance = InkStrokeProperties.Instance;
         if (!formatInstance) return (null);
@@ -90,41 +98,42 @@ export class InkControls extends React.Component<InkControlProps> {
             }
         }
         const addedPoints = this.props.addedPoints;
-        const [left, top, scaleX, scaleY, strokeWidth, dotsize] = this.props.format;
+        const [left, top, scaleX, scaleY, strokeWidth] = this.props.format;
 
         return (
             <>
                 {addedPoints.map((pts, i) =>
                     <svg height="10" width="10" key={`add${i}`}>
-                        <circle 
-                            cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2} 
-                            cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2} 
-                            r={strokeWidth / 2} 
-                            stroke={this._overAddPoint === i ? "#1F85DE" : "transparent"} 
-                            strokeWidth={dotsize / 4} fill={this._overAddPoint === i ? "#1F85DE" : "transparent"}
-                            onPointerDown={() => { formatInstance?.addPoints(pts.X, pts.Y, addedPoints, i, controlPoints); }} 
-                            onMouseEnter={() => this.onEnterAddPoint(i)} 
-                            onMouseLeave={this.onLeaveAddPoint} 
-                            pointerEvents="all" 
+                        <circle
+                            cx={(pts.X - left - strokeWidth / 2) * scaleX + strokeWidth / 2}
+                            cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
+                            r={strokeWidth / 1.5}
+                            stroke={this._overAddPoint === i ? Colors.MEDIUM_BLUE : "transparent"}
+                            strokeWidth={0} fill={this._overAddPoint === i ? Colors.MEDIUM_BLUE : "transparent"}
+                            onPointerDown={() => { formatInstance?.addPoints(pts.X, pts.Y, addedPoints, i, controlPoints); }}
+                            onMouseEnter={() => this.onEnterAddPoint(i)}
+                            onMouseLeave={this.onLeaveAddPoint}
+                            pointerEvents="all"
                             cursor="all-scroll"
                         />
                     </svg>
                 )}
                 {controlPoints.map((control, i) =>
                     <svg height="10" width="10" key={`ctrl${i}`}>
-                        <rect 
-                            x={(control.X - left - strokeWidth / 2) * scaleX} 
-                            y={(control.Y - top - strokeWidth / 2) * scaleY} 
-                            height={this._overControl === i ? strokeWidth * 1.5 : strokeWidth} 
-                            width={this._overControl === i ? strokeWidth * 1.5 : strokeWidth} 
-                            strokeWidth={strokeWidth / 6} stroke="#1F85DE" 
-                            fill={formatInstance?._currentPoint === control.I ? "#1F85DE" : "white"}
-                            onPointerDown={(e) => { 
-                                this.changeCurrPoint(control.I); 
-                                this.onControlDown(e, control.I); }} 
-                            onMouseEnter={() => this.onEnterControl(i)} 
-                            onMouseLeave={this.onLeaveControl} 
-                            pointerEvents="all" 
+                        <rect
+                            x={(control.X - left - strokeWidth / 2) * scaleX}
+                            y={(control.Y - top - strokeWidth / 2) * scaleY}
+                            height={this._overControl === i ? strokeWidth * 1.5 : strokeWidth}
+                            width={this._overControl === i ? strokeWidth * 1.5 : strokeWidth}
+                            strokeWidth={strokeWidth / 6} stroke={Colors.MEDIUM_BLUE}
+                            fill={formatInstance?._currentPoint === control.I ? Colors.MEDIUM_BLUE : Colors.WHITE}
+                            onPointerDown={(e) => {
+                                this.changeCurrPoint(control.I);
+                                this.onControlDown(e, control.I);
+                            }}
+                            onMouseEnter={() => this.onEnterControl(i)}
+                            onMouseLeave={this.onLeaveControl}
+                            pointerEvents="all"
                             cursor="default"
                         />
                     </svg>
diff --git a/src/client/views/InkHandles.tsx b/src/client/views/InkHandles.tsx
index 28b6dd820..6e890e184 100644
--- a/src/client/views/InkHandles.tsx
+++ b/src/client/views/InkHandles.tsx
@@ -10,6 +10,7 @@ import { Doc } from "../../fields/Doc";
 import { listSpec } from "../../fields/Schema";
 import { List } from "../../fields/List";
 import { Cast } from "../../fields/Types";
+import { Colors } from "./global/globalEnums";
 
 export interface InkHandlesProps {
     inkDoc: Doc;
@@ -80,7 +81,7 @@ export class InkHandles extends React.Component<InkHandlesProps> {
                 handleLines.push({ X1: data[i].X, Y1: data[i].Y, X2: data[i + 1].X, Y2: data[i + 1].Y, X3: data[i + 3].X, Y3: data[i + 3].Y, dot1: i + 1, dot2: i + 2 });
             }
         }
-        const [left, top, scaleX, scaleY, strokeWidth, dotsize] = this.props.format;
+        const [left, top, scaleX, scaleY, strokeWidth] = this.props.format;
 
         return (
             <>
@@ -91,7 +92,7 @@ export class InkHandles extends React.Component<InkHandlesProps> {
                             cy={(pts.Y - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
                             r={strokeWidth / 2}
                             strokeWidth={0}
-                            fill="#1F85DE"
+                            fill={Colors.MEDIUM_BLUE}
                             onPointerDown={(e) => this.onHandleDown(e, pts.I)}
                             pointerEvents="all"
                             cursor="default"
@@ -104,16 +105,16 @@ export class InkHandles extends React.Component<InkHandlesProps> {
                             y1={(pts.Y1 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
                             x2={(pts.X2 - left - strokeWidth / 2) * scaleX + strokeWidth / 2}
                             y2={(pts.Y2 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
-                            stroke="#1F85DE"
-                            strokeWidth={dotsize / 8}
+                            stroke={Colors.MEDIUM_BLUE}
+                            strokeWidth={strokeWidth / 4}
                             display={(pts.dot1 === formatInstance._currentPoint || pts.dot2 === formatInstance._currentPoint) ? "inherit" : "none"} />
                         <line
                             x1={(pts.X2 - left - strokeWidth / 2) * scaleX + strokeWidth / 2}
                             y1={(pts.Y2 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
                             x2={(pts.X3 - left - strokeWidth / 2) * scaleX + strokeWidth / 2}
                             y2={(pts.Y3 - top - strokeWidth / 2) * scaleY + strokeWidth / 2}
-                            stroke="#1F85DE"
-                            strokeWidth={dotsize / 8}
+                            stroke={Colors.MEDIUM_BLUE}
+                            strokeWidth={strokeWidth / 4}
                             display={(pts.dot1 === formatInstance._currentPoint || pts.dot2 === formatInstance._currentPoint) ? "inherit" : "none"} />
                     </svg>)}
             </>
diff --git a/src/client/views/InkStrokeProperties.ts b/src/client/views/InkStrokeProperties.ts
index 1a3585f3e..de8cf80bd 100644
--- a/src/client/views/InkStrokeProperties.ts
+++ b/src/client/views/InkStrokeProperties.ts
@@ -35,7 +35,7 @@ export class InkStrokeProperties {
      * @param func The inputted function.
      * @param requireCurrPoint Indicates whether the current selected point is needed.
      */
-     applyFunction = (func: (doc: Doc, ink: InkData, ptsXscale: number, ptsYscale: number) => { X: number, Y: number }[] | undefined, requireCurrPoint: boolean = false) => {
+    applyFunction = (func: (doc: Doc, ink: InkData, ptsXscale: number, ptsYscale: number) => { X: number, Y: number }[] | undefined, requireCurrPoint: boolean = false) => {
         var appliedFunc = false;
         this.selectedInk?.forEach(action(inkView => {
             if (this.selectedInk?.length === 1 && (!requireCurrPoint || this._currentPoint !== -1)) {
@@ -91,16 +91,16 @@ export class InkStrokeProperties {
                     });
                 }
             }
-            if (end === 0) end = points.length-1;
+            if (end === 0) end = points.length - 1;
             // Index of new control point with regards to the ink data.
             const newIndex = Math.floor(counter / 2) * 4 + 2;
             // Creating new ink data with the new control point and handle points inputted.
             for (let i = 0; i < ink.length; i++) {
-                if (i === newIndex) { 
-                    const [handleA, handleB] = this.getNewHandlePoints(points.slice(start, index+1), points.slice(index, end), newControl);
+                if (i === newIndex) {
+                    const [handleA, handleB] = this.getNewHandlePoints(points.slice(start, index + 1), points.slice(index, end), newControl);
                     newPoints.push(handleA, newControl, newControl, handleB);
                     // Adjusting the magnitude of the left handle line of the right neighboring control point.
-                    const [rightControl, rightHandle]  = [points[end], ink[i]];
+                    const [rightControl, rightHandle] = [points[end], ink[i]];
                     const scaledVector = this.getScaledHandlePoint(false, start, end, index, rightControl, rightHandle);
                     rightHandle && newPoints.push({ X: rightControl.X - scaledVector.X, Y: rightControl.Y - scaledVector.Y });
                 } else if (i === newIndex - 1) {
@@ -111,14 +111,14 @@ export class InkStrokeProperties {
                 } else {
                     ink[i] && newPoints.push({ X: ink[i].X, Y: ink[i].Y });
                 }
-                
+
             }
             let brokenIndices = Cast(doc.brokenInkIndices, listSpec("number"));
             // Updating the indices of the control points whose handle tangency has been broken.
             if (brokenIndices) {
-                brokenIndices = new List(brokenIndices.map((control) => { 
+                brokenIndices = new List(brokenIndices.map((control) => {
                     if (control >= newIndex) {
-                        return control + 4; 
+                        return control + 4;
                     } else {
                         return control;
                     }
@@ -158,7 +158,7 @@ export class InkStrokeProperties {
     getNewHandlePoints = (C: PointData[], D: PointData[], newControl: PointData) => {
         const [m, n] = [C.length, D.length];
         let handleSizeA = Math.sqrt((Math.pow(newControl.X - C[0].X, 2)) + (Math.pow(newControl.Y - C[0].Y, 2)));
-        let handleSizeB = Math.sqrt((Math.pow(D[n-1].X - newControl.X, 2)) + (Math.pow(D[n-1].Y - newControl.Y, 2)));
+        let handleSizeB = Math.sqrt((Math.pow(D[n - 1].X - newControl.X, 2)) + (Math.pow(D[n - 1].Y - newControl.Y, 2)));
         // Scaling adjustments to improve the ratio between the magnitudes of the two handle lines.
         // (Ensures that the new point added doesn't augment the inital shape of the curve much).
         if (handleSizeA < 75 && handleSizeB < 75) {
@@ -173,7 +173,7 @@ export class InkStrokeProperties {
             handleSizeB *= 2;
         }
         // Finding the last leg of the derivative curve of C.
-        const dC = { X: (handleSizeA / n) * (C[m-1].X - C[m-2].X), Y: (handleSizeA / n) * (C[m-1].Y - C[m-2].Y) };
+        const dC = { X: (handleSizeA / n) * (C[m - 1].X - C[m - 2].X), Y: (handleSizeA / n) * (C[m - 1].Y - C[m - 2].Y) };
         // Finding the first leg of the derivative curve of D. 
         const dD = { X: (handleSizeB / m) * (D[1].X - D[0].X), Y: (handleSizeB / m) * (D[1].Y - D[0].Y) };
         const handleA = { X: newControl.X - dC.X, Y: newControl.Y - dC.Y };
@@ -259,13 +259,17 @@ export class InkStrokeProperties {
 
     snapHandleTangent = (controlIndex: number, handleIndexA: number, handleIndexB: number) => {
         this.applyFunction((doc: Doc, ink: InkData) => {
-            // doc.brokenIndices.splice(this._brokenIndices.indexOf(controlIndex), 1);
-            const [controlPoint, handleA, handleB] = [ink[controlIndex], ink[handleIndexA], ink[handleIndexB]];
-            const oppositeHandleA = this.rotatePoint(handleA, controlPoint, Math.PI);
-            const angleDifference = this.angleChange(handleB, oppositeHandleA, controlPoint);
-            const newHandleB = this.rotatePoint(handleB, controlPoint, angleDifference);
-            ink[handleIndexB] = newHandleB;
-            return ink;
+            const brokenIndices = Cast(doc.brokenInkIndices, listSpec("number"));
+            if (brokenIndices) {
+                brokenIndices.splice(brokenIndices.indexOf(controlIndex), 1);
+                doc.brokenInkIndices = brokenIndices;
+                const [controlPoint, handleA, handleB] = [ink[controlIndex], ink[handleIndexA], ink[handleIndexB]];
+                const oppositeHandleA = this.rotatePoint(handleA, controlPoint, Math.PI);
+                const angleDifference = this.angleChange(handleB, oppositeHandleA, controlPoint);
+                const newHandleB = this.rotatePoint(handleB, controlPoint, angleDifference);
+                ink[handleIndexB] = newHandleB;
+                return ink;
+            }
         });
     }
 
diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx
index bd71aaf19..a8f32118c 100644
--- a/src/client/views/InkingStroke.tsx
+++ b/src/client/views/InkingStroke.tsx
@@ -19,6 +19,7 @@ import { InkStrokeProperties } from "./InkStrokeProperties";
 import { CurrentUserUtils } from "../util/CurrentUserUtils";
 import { InkControls } from "./InkControls";
 import { InkHandles } from "./InkHandles";
+import { Colors } from "./global/globalEnums";
 
 type InkDocument = makeInterface<[typeof documentSchema]>;
 const InkDocument = makeInterface(documentSchema);
@@ -66,6 +67,9 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
 
     render() {
         TraceMobx();
+        // if (!this.props.isSelected() && this._properties) {
+        //     this._properties._controlButton = false;
+        // }
         // Extracting the ink data and formatting information of the current ink stroke.
         const data: InkData = Cast(this.dataDoc[this.fieldKey], InkField)?.inkData ?? [];
         const inkDoc: Doc = this.layoutDoc;
@@ -86,32 +90,17 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         const dotsize = Math.max(width * scaleX, height * scaleY) / 40;
 
         // Visually renders the polygonal line made by the user.
-        const inkLine = InteractionUtils.CreatePolyline(data, left, top, strokeColor, strokeWidth, strokeWidth,
-            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
-            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
-            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none",
-            this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1,
-            false);
+        const inkLine = InteractionUtils.CreatePolyline(data, left, top, strokeColor, strokeWidth, strokeWidth, StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"), StrCast(this.layoutDoc.strokeStartMarker),
+            StrCast(this.layoutDoc.strokeEndMarker), StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1, false);
         // Thin blue line indicating that the current ink stroke is selected.
-        const selectedLine = InteractionUtils.CreatePolyline(
-            data, lineLeft - strokeWidth * 3, lineTop - strokeWidth * 3, "#1F85DE", strokeWidth / 6,
-            strokeWidth / 6, StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
-            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
-            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none",
-            this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1,
-            false);
+        const selectedLine = InteractionUtils.CreatePolyline(data, left - strokeWidth / 3, top - strokeWidth / 3, Colors.MEDIUM_BLUE, strokeWidth / 6, strokeWidth / 6, StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
+            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker), StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5 && lineBottom - lineTop > 1 && lineRight - lineLeft > 1, false);
         // Invisible polygonal line that enables the ink to be selected by the user.
-        const clickableLine = InteractionUtils.CreatePolyline(data, left, top,
-            this.props.isSelected() && strokeWidth > 5 ? strokeColor : "transparent", strokeWidth,
-            strokeWidth + 15, StrCast(this.layoutDoc.strokeBezier),
-            StrCast(this.layoutDoc.fillColor, "none"), "none", "none", undefined, scaleX, scaleY, "",
-            this.props.layerProvider?.(this.props.Document) === false ? "none" : "visiblepainted", false, true);
+        const clickableLine = InteractionUtils.CreatePolyline(data, left, top, this.props.isSelected() && strokeWidth > 5 ? strokeColor : "transparent", strokeWidth, strokeWidth + 15, StrCast(this.layoutDoc.strokeBezier),
+            StrCast(this.layoutDoc.fillColor, "none"), "none", "none", undefined, scaleX, scaleY, "", this.props.layerProvider?.(this.props.Document) === false ? "none" : "visiblepainted", false, true);
         // Set of points rendered upon the ink that can be added if a user clicks on one.
-        const addedPoints = InteractionUtils.CreatePoints(data, left, top, strokeColor, strokeWidth, strokeWidth,
-            StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"),
-            StrCast(this.layoutDoc.strokeStartMarker), StrCast(this.layoutDoc.strokeEndMarker),
-            StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none",
-            this.props.isSelected() && strokeWidth <= 5, false);
+        const addedPoints = InteractionUtils.CreatePoints(data, left, top, strokeColor, strokeWidth, strokeWidth, StrCast(this.layoutDoc.strokeBezier), StrCast(this.layoutDoc.fillColor, "none"), StrCast(this.layoutDoc.strokeStartMarker),
+            StrCast(this.layoutDoc.strokeEndMarker), StrCast(this.layoutDoc.strokeDash), scaleX, scaleY, "", "none", this.props.isSelected() && strokeWidth <= 5, false);
 
         return (
             <svg className="inkStroke"
@@ -138,14 +127,15 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
                 {this.props.isSelected() && this._properties?._controlButton ?
                     <>
                         <InkControls
+                            inkDoc={inkDoc}
                             data={data}
                             addedPoints={addedPoints}
-                            format={[left, top, scaleX, scaleY, strokeWidth, dotsize]}
+                            format={[left, top, scaleX, scaleY, strokeWidth]}
                             ScreenToLocalTransform={this.props.ScreenToLocalTransform} />
                         <InkHandles
                             inkDoc={inkDoc}
                             data={data}
-                            format={[left, top, scaleX, scaleY, strokeWidth, dotsize]}
+                            format={[left, top, scaleX, scaleY, strokeWidth]}
                             ScreenToLocalTransform={this.props.ScreenToLocalTransform} />
                     </> : ""}
             </svg>
-- 
cgit v1.2.3-70-g09d2


From 61a0064d7ce862e88792112b3d92f59896f9561f Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Tue, 27 Jul 2021 19:43:29 -0400
Subject: from last

---
 src/client/views/nodes/ImageBox.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx
index d876ae818..cfd43bb62 100644
--- a/src/client/views/nodes/ImageBox.tsx
+++ b/src/client/views/nodes/ImageBox.tsx
@@ -340,7 +340,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
     @action
     finishMarquee = () => {
         this._marqueeing = undefined;
-        this.props.select(false)
+        this.props.select(false);
     }
 
     render() {
-- 
cgit v1.2.3-70-g09d2


From b25dac80353e522c74aade90c3df8f01f38de0b7 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Tue, 27 Jul 2021 21:02:49 -0400
Subject: from last - fixes shift-dragging to a new tab

---
 src/client/util/DragManager.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index dd50727dd..c4842e88a 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -427,7 +427,7 @@ export namespace DragManager {
             SnappingManager.clearSnapLines();
             batch.end();
         });
-        const moveHandler = (e: PointerEvent) => {
+        const moveHandler = async (e: PointerEvent) => {
             e.preventDefault(); // required or dragging text menu link item ends up dragging the link button as native drag/drop
             if (dragData instanceof DocumentDragData) {
                 dragData.userDropAction = e.ctrlKey && e.altKey ? "copy" : e.ctrlKey ? "alias" : dragData.defaultDropAction;
@@ -438,7 +438,7 @@ export namespace DragManager {
                     dragData.removeDocument?.(dragData.draggedDocuments[0]);
                 }
                 AbortDrag();
-                finishDrag?.(new DragCompleteEvent(true, dragData));
+                await finishDrag?.(new DragCompleteEvent(true, dragData));
                 DragManager.StartWindowDrag?.({
                     pageX: e.pageX,
                     pageY: e.pageY,
-- 
cgit v1.2.3-70-g09d2


From ea6000690022d43b6bc8e1a546d28729a59faf7b Mon Sep 17 00:00:00 2001
From: vkalev <vjk1883@gmail.com>
Date: Wed, 28 Jul 2021 13:14:10 -0400
Subject: snapping broken tangency added

---
 src/client/views/InkControls.tsx        | 14 ++++++--------
 src/client/views/InkHandles.tsx         |  1 +
 src/client/views/InkStrokeProperties.ts | 18 +++++++++++-------
 3 files changed, 18 insertions(+), 15 deletions(-)

(limited to 'src')

diff --git a/src/client/views/InkControls.tsx b/src/client/views/InkControls.tsx
index 090af10cc..6213a4075 100644
--- a/src/client/views/InkControls.tsx
+++ b/src/client/views/InkControls.tsx
@@ -37,20 +37,18 @@ export class InkControls extends React.Component<InkControlProps> {
             const order = controlIndex % 4;
             const handleIndexA = order === 2 ? controlIndex - 1 : controlIndex - 2;
             const handleIndexB = order === 2 ? controlIndex + 2 : controlIndex + 1;
-            const brokenIndices = Cast(this.props.inkDoc, listSpec("number"));
+            const brokenIndices = Cast(this.props.inkDoc.brokenInkIndices, listSpec("number"));
             setupMoveUpEvents(this, e,
                 (e: PointerEvent, down: number[], delta: number[]) => {
                     InkStrokeProperties.Instance?.moveControl(-delta[0] * screenScale, -delta[1] * screenScale, controlIndex);
                     return false;
                 },
                 () => controlUndo?.end(),
-                brokenIndices ?
-                    action((e: PointerEvent, doubleTap: boolean | undefined) => {
-                        if (doubleTap && brokenIndices.includes(controlIndex)) {
-                            InkStrokeProperties.Instance?.snapHandleTangent(controlIndex, handleIndexA, handleIndexB);
-                        }
-                    })
-                    : emptyFunction);
+                action((e: PointerEvent, doubleTap: boolean | undefined) => {
+                    if (doubleTap && brokenIndices && brokenIndices.includes(controlIndex)) {
+                        InkStrokeProperties.Instance?.snapHandleTangent(controlIndex, handleIndexA, handleIndexB);
+                    }
+                }));
         }
     }
 
diff --git a/src/client/views/InkHandles.tsx b/src/client/views/InkHandles.tsx
index 6e890e184..f1eb4b9db 100644
--- a/src/client/views/InkHandles.tsx
+++ b/src/client/views/InkHandles.tsx
@@ -51,6 +51,7 @@ export class InkHandles extends React.Component<InkHandlesProps> {
     onBreakTangent = (e: KeyboardEvent, controlIndex: number) => {
         const doc: Doc = this.props.inkDoc;
         if (["Alt"].includes(e.key)) {
+            e.stopPropagation();
             if (doc) {
                 const brokenIndices = Cast(doc.brokenInkIndices, listSpec("number")) || new List;
                 if (brokenIndices && !brokenIndices.includes(controlIndex)) {
diff --git a/src/client/views/InkStrokeProperties.ts b/src/client/views/InkStrokeProperties.ts
index de8cf80bd..76ca5b5ec 100644
--- a/src/client/views/InkStrokeProperties.ts
+++ b/src/client/views/InkStrokeProperties.ts
@@ -257,6 +257,11 @@ export class InkStrokeProperties {
             return newPoints;
         })
 
+    /**
+     * Snaps a control point with broken tangency back to synced rotation.
+     * @param handleIndexA The handle point that retains its current position.
+     * @param handleIndexB The handle point that is rotated to be 180 degrees from its opposite.
+     */
     snapHandleTangent = (controlIndex: number, handleIndexA: number, handleIndexB: number) => {
         this.applyFunction((doc: Doc, ink: InkData) => {
             const brokenIndices = Cast(doc.brokenInkIndices, listSpec("number"));
@@ -278,13 +283,12 @@ export class InkStrokeProperties {
      */
     @action
     rotatePoint = (target: PointData, origin: PointData, angle: number) => {
-        target.X -= origin.X;
-        target.Y -= origin.Y;
-        const newX = Math.cos(angle) * target.X - Math.sin(angle) * target.Y;
-        const newY = Math.sin(angle) * target.X + Math.cos(angle) * target.Y;
-        target.X = newX + origin.X;
-        target.Y = newY + origin.Y;
-        return target;
+        let rotatedTarget = { X: target.X - origin.X, Y: target.Y - origin.Y };
+        const newX = Math.cos(angle) * rotatedTarget.X - Math.sin(angle) * rotatedTarget.Y;
+        const newY = Math.sin(angle) * rotatedTarget.X + Math.cos(angle) * rotatedTarget.Y;
+        rotatedTarget.X = newX + origin.X;
+        rotatedTarget.Y = newY + origin.Y;
+        return rotatedTarget;
     }
 
     /**
-- 
cgit v1.2.3-70-g09d2


From 6e0994d6b221ee1045e313554533ecc48c24f65d Mon Sep 17 00:00:00 2001
From: dinhanhtruong <70963346+dinhanhtruong@users.noreply.github.com>
Date: Wed, 28 Jul 2021 14:13:55 -0400
Subject: fixed css typo

---
 src/client/views/linking/LinkEditor.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/linking/LinkEditor.scss b/src/client/views/linking/LinkEditor.scss
index 9fddede65..e45a91d57 100644
--- a/src/client/views/linking/LinkEditor.scss
+++ b/src/client/views/linking/LinkEditor.scss
@@ -109,7 +109,7 @@
 .linkEditor-followingDropdown {
     padding-left: 26px;
     padding-right: 6.5px;
-    padding-bottom: 15cpx;
+    padding-bottom: 15px;
 
     &:hover {
         cursor: pointer;
-- 
cgit v1.2.3-70-g09d2


From 405114b0a2440939e89052539eb91f479e8d4176 Mon Sep 17 00:00:00 2001
From: Aubrey-Li <63608597+Aubrey-Li@users.noreply.github.com>
Date: Wed, 28 Jul 2021 16:07:08 -0700
Subject: fix tree view collection drop shadow

---
 src/client/views/nodes/DocumentView.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 60fa462ad..2b0d8fe91 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -979,7 +979,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
 
         const borderPath = this.props.styleProvider?.(this.props.Document, this.props, StyleProp.BorderPath) || { path: undefined };
         const internal = PresBox.EffectsProvider(this.layoutDoc, this.renderDoc) || this.renderDoc;
-        const boxShadow = highlighting && this.borderRounding && highlightStyle !== "dashed" ? `0 0 0 ${highlightIndex}px ${highlightColor}` :
+        const boxShadow = this.props.treeViewDoc ? undefined : highlighting && this.borderRounding && highlightStyle !== "dashed" ? `0 0 0 ${highlightIndex}px ${highlightColor}` :
             this.boxShadow || (this.props.Document.isTemplateForField ? "black 0.2vw 0.2vw 0.8vw" : undefined);
         return <div className={DocumentView.ROOT_DIV} ref={this._mainCont}
             onContextMenu={this.onContextMenu}
-- 
cgit v1.2.3-70-g09d2


From 09e5f2c58ca87ded318627cbc5dea436989fcff2 Mon Sep 17 00:00:00 2001
From: vkalev <vjk1883@gmail.com>
Date: Thu, 29 Jul 2021 09:51:50 -0400
Subject: deselecting an ink stroke properly exits edit view

---
 src/client/views/InkingStroke.tsx | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

(limited to 'src')

diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx
index a8f32118c..21059b330 100644
--- a/src/client/views/InkingStroke.tsx
+++ b/src/client/views/InkingStroke.tsx
@@ -65,11 +65,19 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         }
     }
 
+    /**
+     * Ensures the ink controls and handles aren't rendered when the current ink stroke is reselected.
+     */
+    @action
+    toggleControlButton = () => {
+        if (!this.props.isSelected() && this._properties) {
+            this._properties._controlButton = false;
+        }
+    }
+
     render() {
         TraceMobx();
-        // if (!this.props.isSelected() && this._properties) {
-        //     this._properties._controlButton = false;
-        // }
+        this.toggleControlButton();
         // Extracting the ink data and formatting information of the current ink stroke.
         const data: InkData = Cast(this.dataDoc[this.fieldKey], InkField)?.inkData ?? [];
         const inkDoc: Doc = this.layoutDoc;
-- 
cgit v1.2.3-70-g09d2


From 795764089a464304be12e5b41dced0045350cc86 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 29 Jul 2021 10:56:37 -0400
Subject: added button to lightbox to create a tab from current document. 
 changed stepInto to first shrinkwrap(), then to step through collection

---
 src/client/views/LightboxView.scss | 30 +++++++++++++++++++++++++++++-
 src/client/views/LightboxView.tsx  | 22 +++++++++++++++-------
 2 files changed, 44 insertions(+), 8 deletions(-)

(limited to 'src')

diff --git a/src/client/views/LightboxView.scss b/src/client/views/LightboxView.scss
index 4ea2dc2d6..5d42cd97f 100644
--- a/src/client/views/LightboxView.scss
+++ b/src/client/views/LightboxView.scss
@@ -1,3 +1,32 @@
+
+    .lightboxView-navBtn {
+        margin: auto;
+        position: absolute;
+        right: 10;
+        top: 10;
+        background: transparent;
+        border-radius: 8;
+        color:white;
+        opacity: 0.7;
+        width: 35; 
+        &:hover {
+            opacity: 1;
+        }
+    }
+    .lightboxView-tabBtn {
+        margin: auto;
+        position: absolute;
+        right: 35;
+        top: 10;
+        background: transparent;
+        border-radius: 8;
+        color:white;
+        opacity: 0.7;
+        width: 35;
+        &:hover {
+            opacity: 1;
+        }
+    }
 .lightboxView-frame {
     position: absolute; 
     top: 0; left: 0;
@@ -15,7 +44,6 @@
             position: relative;
             background: transparent;
             border-radius: 8;
-            color:white;
             opacity: 0.7;
             width: 35;
             &:hover {
diff --git a/src/client/views/LightboxView.tsx b/src/client/views/LightboxView.tsx
index ce36d9182..88739fe91 100644
--- a/src/client/views/LightboxView.tsx
+++ b/src/client/views/LightboxView.tsx
@@ -1,19 +1,20 @@
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { action, computed, observable, trace } from 'mobx';
+import { action, computed, observable } from 'mobx';
 import { observer } from 'mobx-react';
 import "normalize.css";
 import * as React from 'react';
 import { Doc, DocListCast, Opt } from '../../fields/Doc';
 import { Cast, NumCast, StrCast } from '../../fields/Types';
-import { emptyFunction, returnEmptyDoclist, returnEmptyFilter, returnTrue, returnFalse } from '../../Utils';
+import { emptyFunction, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue } from '../../Utils';
 import { DocUtils } from '../documents/Documents';
 import { DocumentManager } from '../util/DocumentManager';
 import { LinkManager } from '../util/LinkManager';
 import { SelectionManager } from '../util/SelectionManager';
 import { Transform } from '../util/Transform';
+import { CollectionDockingView } from './collections/CollectionDockingView';
 import { TabDocView } from './collections/TabDocView';
 import "./LightboxView.scss";
-import { DocumentView, ViewAdjustment } from './nodes/DocumentView';
+import { DocumentView } from './nodes/DocumentView';
 import { DefaultStyleProvider, wavyBorderPath } from './StyleProvider';
 
 interface LightboxViewProps {
@@ -160,7 +161,7 @@ export class LightboxView extends React.Component<LightboxViewProps> {
         const { doc, target } = LightboxView._history?.lastElement();
         const docView = DocumentManager.Instance.getLightboxDocumentView(target || doc);
         if (docView) {
-            LightboxView._docTarget = undefined;
+            LightboxView._docTarget = target;
             const focusSpeed = 1000;
             doc._viewTransition = `transform ${focusSpeed}ms`;
             if (!target) docView.ComponentView?.shrinkWrap?.();
@@ -197,7 +198,6 @@ export class LightboxView extends React.Component<LightboxViewProps> {
                 TabDocView.PinDoc(coll, { hidePresBox: true });
             }
         }
-        setTimeout(LightboxView.Next);
     }
 
     future = () => LightboxView._future;
@@ -228,7 +228,6 @@ export class LightboxView extends React.Component<LightboxViewProps> {
                             const targetView = target && DocumentManager.Instance.getLightboxDocumentView(target);
                             if (doc === r.props.Document && (!target || target === doc)) r.ComponentView?.shrinkWrap?.();
                             else target && targetView?.focus(target, { willZoom: true, scale: 0.9, instant: true });
-                            LightboxView._docTarget = undefined;
                         }));
                     })}
                         Document={LightboxView.LightboxDoc}
@@ -270,7 +269,16 @@ export class LightboxView extends React.Component<LightboxViewProps> {
                         LightboxView.Next();
                     })}
                 <LightboxTourBtn navBtn={this.navBtn} future={this.future} stepInto={this.stepInto} tourMap={this.tourMap} />
-                <div className="lightboxView-navBtn" title={"toggle fit width"} style={{ position: "absolute", right: 10, top: 10, color: "white" }}
+                <div className="lightboxView-tabBtn" title={"open in tab"}
+                    onClick={e => {
+                        e.stopPropagation();
+                        CollectionDockingView.AddSplit(LightboxView._docTarget || LightboxView._doc!, "onRight");
+                        SelectionManager.DeselectAll();
+                        LightboxView.SetLightboxDoc(undefined);
+                    }}>
+                    <FontAwesomeIcon icon={"file-download"} size="2x" />
+                </div>
+                <div className="lightboxView-navBtn" title={"toggle fit width"}
                     onClick={e => { e.stopPropagation(); LightboxView.LightboxDoc!._fitWidth = !LightboxView.LightboxDoc!._fitWidth; }}>
                     <FontAwesomeIcon icon={"arrows-alt-h"} size="2x" />
                 </div>
-- 
cgit v1.2.3-70-g09d2


From 93c06962c18c916518616ab8f53944487e59fc2a Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 29 Jul 2021 12:32:19 -0400
Subject: fixed linking to text in custom text view.

---
 src/client/views/nodes/DocumentView.scss                  | 2 +-
 src/client/views/nodes/formattedText/FormattedTextBox.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/DocumentView.scss b/src/client/views/nodes/DocumentView.scss
index 8f86417d6..281f25fb3 100644
--- a/src/client/views/nodes/DocumentView.scss
+++ b/src/client/views/nodes/DocumentView.scss
@@ -147,7 +147,7 @@
         .documentView-titleWrapper,
         .documentView-titleWrapper-hover {
             overflow: hidden;
-            color: white;
+            color: gray;
             transform-origin: top left;
             top: 0;
             width: 100%;
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 6dd63fb47..8cac21927 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -787,7 +787,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
     }
 
     componentDidMount() {
-        this.props.setContentView?.(this); // this tells the DocumentView that this AudioBox is the "content" of the document.  this allows the DocumentView to indirectly call getAnchor() on the AudioBox when making a link.
+        !this.props.dontSelectOnLoad && this.props.setContentView?.(this); // this tells the DocumentView that this AudioBox is the "content" of the document.  this allows the DocumentView to indirectly call getAnchor() on the AudioBox when making a link.
         this._cachedLinks = DocListCast(this.Document.links);
         this._disposers.breakupDictation = reaction(() => DocumentManager.Instance.RecordingEvent, this.breakupDictation);
         this._disposers.autoHeight = reaction(() => this.autoHeight, autoHeight => autoHeight && this.tryUpdateScrollHeight());
-- 
cgit v1.2.3-70-g09d2


From b33e45f1f839b3c6eaf1076e605abacd1bc6883c Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Thu, 29 Jul 2021 15:35:39 -0400
Subject: lots of updates!

---
 src/client/util/SettingsManager.tsx                |  79 ++++++--
 src/client/views/AntimodeMenu.scss                 |   2 +-
 src/client/views/MainView.scss                     |  27 ---
 src/client/views/MainView.tsx                      |  61 ++----
 src/client/views/_nodeModuleOverrides.scss         |  52 ++++-
 .../views/collections/CollectionDockingView.scss   |  98 +++++++---
 .../views/collections/CollectionDockingView.tsx    |   2 +-
 src/client/views/collections/TabDocView.scss       |  59 +++++-
 src/client/views/collections/TabDocView.tsx        | 107 +++++++----
 src/client/views/global/globalCssVariables.scss    |   4 +-
 src/client/views/global/globalEnums.tsx            |   4 +
 src/client/views/topbar/TopBar.scss                | 211 +++++++++++++++++++++
 src/client/views/topbar/TopBar.tsx                 |  58 ++++++
 src/fields/Doc.ts                                  |   6 +-
 14 files changed, 618 insertions(+), 152 deletions(-)
 create mode 100644 src/client/views/topbar/TopBar.scss
 create mode 100644 src/client/views/topbar/TopBar.tsx

(limited to 'src')

diff --git a/src/client/util/SettingsManager.tsx b/src/client/util/SettingsManager.tsx
index 777394b05..3987497b8 100644
--- a/src/client/util/SettingsManager.tsx
+++ b/src/client/util/SettingsManager.tsx
@@ -18,6 +18,12 @@ const higflyout = require("@hig/flyout");
 export const { anchorPoints } = higflyout;
 export const Flyout = higflyout.default;
 
+export enum ColorScheme {
+    Dark = "Dark",
+    Light = "Light",
+    System = "Match System"
+}
+
 @observer
 export class SettingsManager extends React.Component<{}> {
     public static Instance: SettingsManager;
@@ -32,7 +38,7 @@ export class SettingsManager extends React.Component<{}> {
     @observable activeTab = "Accounts";
 
     @computed get backgroundColor() { return Doc.UserDoc().activeCollectionBackground; }
-
+    @computed get colorScheme() { return Doc.UserDoc().colorScheme; }
 
     constructor(props: {}) {
         super(props);
@@ -69,6 +75,28 @@ export class SettingsManager extends React.Component<{}> {
         else DocServer.Control.makeEditable();
     });
 
+    @undoBatch
+    @action
+    changeColorScheme = action((e: React.ChangeEvent) => {
+        const scheme: ColorScheme = (e.currentTarget as any).value;
+        switch (scheme) {
+            case ColorScheme.Light:
+                Doc.UserDoc().colorScheme = ColorScheme.Light;
+                addStyleSheetRule(SettingsManager._settingsStyle, "lm_header", { background: "#d3d3d3 !important" });
+                break;
+            case ColorScheme.Dark:
+                Doc.UserDoc().colorScheme = ColorScheme.Dark;
+                addStyleSheetRule(SettingsManager._settingsStyle, "lm_header", { background: "black !important" });
+                break;
+            case ColorScheme.System: default:
+                window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', e => {
+                    Doc.UserDoc().colorScheme = e.matches ? ColorScheme.Dark : ColorScheme.Light;
+                });
+                break;
+        }
+    });
+
+
     @computed get colorsContent() {
         const colorBox = (func: (color: ColorState) => void) => <SketchPicker onChange={func} color={StrCast(this.backgroundColor)}
             presetColors={['#D0021B', '#F5A623', '#F8E71C', '#8B572A', '#7ED321', '#417505',
@@ -90,8 +118,7 @@ export class SettingsManager extends React.Component<{}> {
             </Flyout>
         </div>;
 
-        const fontFamilies = ["Times New Roman", "Arial", "Georgia", "Comic Sans MS", "Tahoma", "Impact", "Crimson Text"];
-        const fontSizes = ["7px", "8px", "9px", "10px", "12px", "14px", "16px", "18px", "20px", "24px", "32px", "48px", "72px"];
+        const colorSchemes = [ColorScheme.Light, ColorScheme.Dark, ColorScheme.System];
 
         return <div className="colors-content">
             <div className="preferences-color">
@@ -102,14 +129,11 @@ export class SettingsManager extends React.Component<{}> {
                 <div className="preferences-color-text">Border/Header Color</div>
                 {userColorFlyout}
             </div>
-            <div className="preferences-font">
-                <div className="preferences-font-text">Default Font</div>
-                <div className="preferences-font-controls">
-                    <select className="size-select" onChange={this.changeFontSize} value={StrCast(Doc.UserDoc().fontSize, "7px")}>
-                        {fontSizes.map(size => <option key={size} value={size} defaultValue={StrCast(Doc.UserDoc().fontSize)}> {size} </option>)}
-                    </select>
-                    <select className="font-select" onChange={this.changeFontFamily} value={StrCast(Doc.UserDoc().fontFamily, "Times New Roman")} >
-                        {fontFamilies.map(font => <option key={font} value={font} defaultValue={StrCast(Doc.UserDoc().fontFamily)}> {font} </option>)}
+            <div className="preferences-colorScheme">
+                <div className="preferences-color-text">Color Scheme</div>
+                <div className="preferences-color-controls">
+                    <select className="scheme-select" onChange={this.changeColorScheme} defaultValue={StrCast(Doc.UserDoc().colorScheme)}>
+                        {colorSchemes.map(scheme => <option key={scheme} value={scheme}> {scheme} </option>)}
                     </select>
                 </div>
             </div>
@@ -132,6 +156,16 @@ export class SettingsManager extends React.Component<{}> {
                     checked={BoolCast(Doc.UserDoc()._raiseWhenDragged)} />
                 <div className="preferences-check">Raise on drag</div>
             </div>
+            <div>
+                <input type="checkbox" onChange={e => Doc.UserDoc()._showLabel = !Doc.UserDoc()._showLabel}
+                    checked={BoolCast(Doc.UserDoc()._showLabel)} />
+                <div className="preferences-check">Show tool button labels</div>
+            </div>
+            <div>
+                <input type="checkbox" onChange={e => Doc.UserDoc()._showMenuLabel = !Doc.UserDoc()._showMenuLabel}
+                    checked={BoolCast(Doc.UserDoc()._showMenuLabel)} />
+                <div className="preferences-check">Show menu button labels</div>
+            </div>
         </div>;
     }
 
@@ -149,6 +183,27 @@ export class SettingsManager extends React.Component<{}> {
         </div>;
     }
 
+    @computed get textContent() {
+
+        const fontFamilies = ["Times New Roman", "Arial", "Georgia", "Comic Sans MS", "Tahoma", "Impact", "Crimson Text", "Roboto"];
+        const fontSizes = ["7px", "8px", "9px", "10px", "12px", "14px", "16px", "18px", "20px", "24px", "32px", "48px", "72px"];
+
+        return (
+            <div className="tab-content appearances-content">
+                <div className="preferences-font">
+                    <div className="preferences-font-text">Default Font</div>
+                    <div className="preferences-font-controls">
+                        <select className="size-select" onChange={this.changeFontSize} value={StrCast(Doc.UserDoc().fontSize, "7px")}>
+                            {fontSizes.map(size => <option key={size} value={size} defaultValue={StrCast(Doc.UserDoc().fontSize)}> {size} </option>)}
+                        </select>
+                        <select className="font-select" onChange={this.changeFontFamily} value={StrCast(Doc.UserDoc().fontFamily, "Times New Roman")} >
+                            {fontFamilies.map(font => <option key={font} value={font} defaultValue={StrCast(Doc.UserDoc().fontFamily)}> {font} </option>)}
+                        </select>
+                    </div>
+                </div>
+            </div>);
+    }
+
     @action
     changeVal = (e: React.ChangeEvent, pass: string) => {
         const value = (e.target as any).value;
@@ -228,7 +283,7 @@ export class SettingsManager extends React.Component<{}> {
         // { title: "Accounts", ele: this.accountsContent }, { title: "Preferences", ele: this.preferencesContent }];
 
         const tabs = [{ title: "Accounts", ele: this.accountsContent }, { title: "Modes", ele: this.modesContent },
-        { title: "Appearance", ele: this.appearanceContent }];
+        { title: "Appearance", ele: this.appearanceContent }, { title: "Text", ele: this.textContent }];
 
         return <div className="settings-interface">
             <div className="settings-panel">
diff --git a/src/client/views/AntimodeMenu.scss b/src/client/views/AntimodeMenu.scss
index 2bac03af4..b509f9f54 100644
--- a/src/client/views/AntimodeMenu.scss
+++ b/src/client/views/AntimodeMenu.scss
@@ -6,7 +6,7 @@
     z-index: 10001;
     height: $antimodemenu-height;
     background: $dark-gray;
-    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.25);
+    // box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.25);
     // border-radius: 0px 6px 6px 6px;
     z-index: 1001;
     display: flex;
diff --git a/src/client/views/MainView.scss b/src/client/views/MainView.scss
index 07ca0257c..2069986ad 100644
--- a/src/client/views/MainView.scss
+++ b/src/client/views/MainView.scss
@@ -419,31 +419,4 @@
     display: block;
     width: 500px;
     height: 1000px;
-}
-
-.lm_drag_tab {
-    padding: 0;
-    width: 15px !important;
-    height: 15px !important;
-    position: relative !important;
-    display: inline-flex !important;
-    align-items: center;
-    top: 0 !important;
-    right: unset !important;
-    left: 0 !important;
-}
-.lm_close_tab {
-    padding: 0;
-    width: 15px !important;
-    height: 15px !important;
-    position: relative !important;
-    display: inline-flex !important;
-    align-items: center;
-    top: 0 !important;
-    right: unset !important;
-    left: 0 !important;
-}
-.lm_tab, .lm_tab_active {
-    display: flex !important;
-    padding-right: 0 !important;
 }
\ No newline at end of file
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index f34851b00..7d6bfbd40 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -63,6 +63,7 @@ import { PreviewCursor } from './PreviewCursor';
 import { PropertiesView } from './PropertiesView';
 import { SearchBox } from './search/SearchBox';
 import { DefaultStyleProvider, DashboardStyleProvider, StyleProp } from './StyleProvider';
+import { TopBar } from './topbar/TopBar';
 const _global = (window /* browser */ || global /* node */) as any;
 
 @observer
@@ -78,7 +79,7 @@ export class MainView extends React.Component {
     @observable private _sidebarContent: any = this.userDoc?.sidebar;
     @observable private _flyoutWidth: number = 0;
 
-    @computed private get topOffset() { return (CollectionMenu.Instance?.Pinned ? 35 : 0) + Number(SEARCH_PANEL_HEIGHT.replace("px", "")); }
+    @computed private get topOffset() { return Number(SEARCH_PANEL_HEIGHT.replace("px", "")); } //TODO remove
     @computed private get leftOffset() { return this.menuPanelWidth() - 2; }
     @computed private get userDoc() { return Doc.UserDoc(); }
     @computed private get darkScheme() { return BoolCast(CurrentUserUtils.ActiveDashboard?.darkScheme); }
@@ -180,8 +181,8 @@ export class MainView extends React.Component {
             const targClass = targets[0].className.toString();
             if (SearchBox.Instance._searchbarOpen || SearchBox.Instance.open) {
                 const check = targets.some((thing) =>
-                (thing.className === "collectionSchemaView-searchContainer" || (thing as any)?.dataset.icon === "filter" ||
-                    thing.className === "collectionSchema-header-menuOptions"));
+                    (thing.className === "collectionSchemaView-searchContainer" || (thing as any)?.dataset.icon === "filter" ||
+                        thing.className === "collectionSchema-header-menuOptions"));
                 !check && SearchBox.Instance.resetSearch(true);
             }
             !targClass.includes("contextMenu") && ContextMenu.Instance.closeMenu();
@@ -242,8 +243,9 @@ export class MainView extends React.Component {
     }
 
     getPWidth = () => this._panelWidth - this.propertiesWidth();
-    getPHeight = () => this._panelHeight;
+    getPHeight = () => this._panelHeight - (CollectionMenu.Instance?.Pinned ? 35 : 0);
     getContentsHeight = () => this._panelHeight;
+    getMenuPanelHeight = () => this._panelHeight + (CollectionMenu.Instance?.Pinned ? 35 : 0);
 
     @computed get mainDocView() {
         return <DocumentView key="main"
@@ -275,10 +277,12 @@ export class MainView extends React.Component {
 
     @computed get dockingContent() {
         return <div key="docking" className={`mainContent-div${this._flyoutWidth ? "-flyout" : ""}`} onDrop={e => { e.stopPropagation(); e.preventDefault(); }}
+            // style={{ minWidth: `calc(100% - ${this._flyoutWidth + this.menuPanelWidth() + this.propertiesWidth()}px)`, width: `calc(100% - ${this._flyoutWidth + this.propertiesWidth()}px)` }}>
+            // FIXME update with property panel width
             style={{
                 minWidth: `calc(100% - ${this._flyoutWidth + this.menuPanelWidth() + this.propertiesWidth()}px)`,
                 transform: LightboxView.LightboxDoc ? "scale(0.0001)" : undefined,
-                width: `calc(100% - ${this._flyoutWidth + this.menuPanelWidth() + this.propertiesWidth()}px)`
+                //TODO:glr width: `calc(100% - ${this._flyoutWidth + this.menuPanelWidth() + this.propertiesWidth()}px)`
             }}>
             {!this.mainContainer ? (null) : this.mainDocView}
         </div>;
@@ -358,7 +362,7 @@ export class MainView extends React.Component {
                 removeDocument={returnFalse}
                 ScreenToLocalTransform={this.sidebarScreenToLocal}
                 PanelWidth={this.menuPanelWidth}
-                PanelHeight={this.getContentsHeight}
+                PanelHeight={this.getMenuPanelHeight}
                 renderDepth={0}
                 docViewPath={returnEmptyDoclist}
                 focus={DocUtils.DefaultFocus}
@@ -405,16 +409,19 @@ export class MainView extends React.Component {
             {this.menuPanel}
             <div key="inner" className={`mainView-innerContent${this.darkScheme ? "-dark" : ""}`}>
                 {this.flyout}
-                <div className="mainView-libraryHandle" style={{ display: !this._flyoutWidth ? "none" : undefined, }} onPointerDown={this.onFlyoutPointerDown} >
+                <div className="mainView-libraryHandle" style={{ display: !this._flyoutWidth ? "none" : undefined, left: this._flyoutWidth ? (this._flyoutWidth + this.menuPanelWidth() - 10) : -10 }} onPointerDown={this.onFlyoutPointerDown} >
                     <FontAwesomeIcon icon="chevron-left" color={this.darkScheme ? "white" : "black"} style={{ opacity: "50%" }} size="sm" />
                 </div>
+                <div className="mainView-innerContainer" style={{ width: `calc(100% - ${this.propertiesWidth() + this._flyoutWidth + this.menuPanelWidth()}px)` }}>
+                    <CollectionMenu />
 
-                {this.dockingContent}
+                    {this.dockingContent}
 
-                <div className="mainView-propertiesDragger" key="props" onPointerDown={this.onPropertiesPointerDown} style={{ right: this.propertiesWidth() - 1 }}>
-                    <FontAwesomeIcon icon={this.propertiesWidth() < 10 ? "chevron-left" : "chevron-right"} color={this.darkScheme ? "white" : "black"} size="sm" />
+                    <div className="mainView-propertiesDragger" key="props" onPointerDown={this.onPropertiesPointerDown} style={{ right: this.propertiesWidth() - 1 }}>
+                        <FontAwesomeIcon icon={this.propertiesWidth() < 10 ? "chevron-left" : "chevron-right"} color={this.darkScheme ? "white" : "black"} size="sm" />
+                    </div>
+                    {this.propertiesWidth() < 10 ? (null) : <PropertiesView styleProvider={DefaultStyleProvider} width={this.propertiesWidth()} height={this.getContentsHeight()} />}
                 </div>
-                {this.propertiesWidth() < 10 ? (null) : <PropertiesView styleProvider={DefaultStyleProvider} width={this.propertiesWidth()} height={this.getContentsHeight()} />}
             </div>
         </>;
     }
@@ -525,35 +532,8 @@ export class MainView extends React.Component {
 
     @computed get search() {
         TraceMobx();
-        return <div className="mainView-searchPanel">
-            <SearchBox Document={CurrentUserUtils.MySearchPanelDoc}
-                DataDoc={CurrentUserUtils.MySearchPanelDoc}
-                fieldKey="data"
-                dropAction="move"
-                isSelected={returnTrue}
-                isContentActive={returnTrue}
-                select={returnTrue}
-                setHeight={returnFalse}
-                addDocument={undefined}
-                addDocTab={this.addDocTabFunc}
-                pinToPres={emptyFunction}
-                rootSelected={returnTrue}
-                styleProvider={DefaultStyleProvider}
-                layerProvider={undefined}
-                removeDocument={undefined}
-                ScreenToLocalTransform={Transform.Identity}
-                PanelWidth={this.getPWidth}
-                PanelHeight={this.getPHeight}
-                renderDepth={0}
-                focus={DocUtils.DefaultFocus}
-                docViewPath={returnEmptyDoclist}
-                whenChildContentsActiveChanged={emptyFunction}
-                bringToFront={emptyFunction}
-                docFilters={returnEmptyFilter}
-                docRangeFilters={returnEmptyFilter}
-                searchFilterDocs={returnEmptyDoclist}
-                ContainingCollectionView={undefined}
-                ContainingCollectionDoc={undefined} />
+        return <div className="mainView-topbar">
+            <TopBar />
         </div>;
     }
 
@@ -605,7 +585,6 @@ export class MainView extends React.Component {
             <GoogleAuthenticationManager />
             <DocumentDecorations boundsLeft={this.leftOffset} boundsTop={this.topOffset} />
             {this.search}
-            <CollectionMenu />
             {LinkDescriptionPopup.descriptionPopup ? <LinkDescriptionPopup /> : null}
             {DocumentLinksButton.LinkEditorDocView ? <LinkMenu docView={DocumentLinksButton.LinkEditorDocView} changeFlyout={emptyFunction} /> : (null)}
             {LinkDocPreview.LinkInfo ? <LinkDocPreview {...LinkDocPreview.LinkInfo} /> : (null)}
diff --git a/src/client/views/_nodeModuleOverrides.scss b/src/client/views/_nodeModuleOverrides.scss
index 56346b68b..cb59489c0 100644
--- a/src/client/views/_nodeModuleOverrides.scss
+++ b/src/client/views/_nodeModuleOverrides.scss
@@ -1,8 +1,49 @@
+@import "./global/globalCssVariables";
 // this file is for overriding all the css from installed node modules
 
 // goldenlayout stuff
 div .lm_header {
     background: $dark-gray;
+    overflow: hidden;
+}
+
+/* Width */
+.lm_header::-webkit-scrollbar {
+    -webkit-appearance: none;
+    display: none;
+}
+
+/* Width */
+.lm_header:hover::-webkit-scrollbar {
+    -webkit-appearance: none;
+    display: block;
+    height: 0px;
+}
+
+/* Track */
+.lm_header:hover::-webkit-scrollbar-track {
+    -webkit-appearance: none;
+    display: none;
+}
+
+/* Handle */
+.lm_header:hover::-webkit-scrollbar-thumb {
+    -webkit-appearance: none;
+    background: $dark-gray;
+}
+
+/* Handle on hover */
+.lm_header:hover::-webkit-scrollbar-thumb:hover {
+    -webkit-appearance: none;
+    background: $dark-gray;
+}
+
+.lm_tabs {
+    display: flex;
+    position: absolute;
+    width: calc(100% - 60px);
+    overflow: scroll;
+    background: $dark-gray;
 }
 
 .lm_tab {
@@ -15,7 +56,16 @@ div .lm_header {
 }
 
 .lm_header .lm_controls {
-    right: 1em !important;
+    align-items: center;
+    position: absolute;
+    background-color: #000000;
+    border-radius: 5px;
+    display: flex;
+    top: 2px;
+    justify-content: space-evenly;
+    right: 2px;
+    height: 18px;
+    width: 65px;
 }
 
 // @TODO the ril__navgiation buttons in the img gallery are a lil messed up but I can't figure out
diff --git a/src/client/views/collections/CollectionDockingView.scss b/src/client/views/collections/CollectionDockingView.scss
index a054f0ae1..b8180fe24 100644
--- a/src/client/views/collections/CollectionDockingView.scss
+++ b/src/client/views/collections/CollectionDockingView.scss
@@ -1,40 +1,46 @@
-@import "../../views/global/globalCssVariables.scss";
+@import "../global/globalCssVariables.scss";
 
 
 .lm_title {
-    margin-top: 3px;
-    border-radius: 5px;
-    border: solid 0px dimgray;
-    border-width: 2px 2px 0px;
-    height: 20px;
-    transform: translate(0px, -3px);
+    -webkit-appearance: none;
+    display: inline-block;
+    align-self: center;
+    align-items: center;
+    height: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    background: transparent;
+    border: solid 0px transparent;
     cursor: grab;
+    color: $black;
 }
 
 .lm_title.focus-visible {
+    -webkit-appearance: none;
     cursor: text;
 }
 
 .lm_title_wrap {
     overflow: hidden;
-    height: 19px;
-    margin-top: -2px;
-    display: inline-block;
+    align-items: center;
+    align-self: center;
+    background: transparent;
+    width: max-content;
+    height: 100%;
+    display: flex;
 }
 
 .lm_active .lm_title {
-    border: solid 1px lightgray;
-}
-
-.lm_header .lm_tab .lm_close_tab {
-    position: absolute;
-    text-align: center;
+    -webkit-appearance: none;
+    // font-weight: 700;
 }
 
 .lm_header .lm_tab {
-    padding-right: 20px;
-    margin-top: -1px;
-    border-bottom: 1px black;
+    padding: 0px;
+    opacity: 0.7;
+    box-shadow: none;
+    height: 19px;
+    // border-bottom: 1px black;
 
     .collectionDockingView-gear {
         display: none;
@@ -42,9 +48,13 @@
 }
 
 .lm_header .lm_tab.lm_active {
-    padding-right: 20px;
-    margin-top: 1px;
-    border-bottom: unset;
+    padding: 0;
+    opacity: 1;
+    margin: 0;
+    box-shadow: none;
+    height: 22px;
+    margin-right: 2px;
+    // border-bottom: unset;
 
     .collectionDockingView-gear {
         display: inline-block;
@@ -55,6 +65,41 @@
     display: inline;
 }
 
+.lm_drag_tab {
+    padding: 0;
+    width: 15px !important;
+    height: 15px !important;
+    position: relative !important;
+    display: inline-flex !important;
+    align-items: center;
+    top: 0 !important;
+    right: unset !important;
+    left: 0 !important;
+}
+
+.lm_close_tab {
+    padding: 0;
+    align-self: center;
+    margin-right: 5px;
+    background-color: black;
+    border-radius: 3px;
+    opacity: 1 !important;
+    width: 15px !important;
+    height: 15px !important;
+    position: relative !important;
+    display: inline-flex !important;
+    align-items: center;
+    top: 0 !important;
+    right: unset !important;
+    left: 0 !important;
+}
+
+.lm_tab,
+.lm_tab_active {
+    display: flex !important;
+    padding-right: 0 !important;
+}
+
 .collectiondockingview-container {
     width: 100%;
     height: 100%;
@@ -82,16 +127,17 @@
     }
 
     .lm_content {
-        background: white;
+        background: $white;
     }
 
     .lm_controls>li {
-        opacity: 0.6;
-        transform: scale(1.2);
+        opacity: 1;
+        transform: scale(1);
     }
 
     .lm_controls .lm_popout {
-        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAUCAAAAABHICnvAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QAAKqNIzIAAAAHdElNRQfkCBsXMgbrEyzaAAAAT0lEQVQY02NgIAcIu8tgEW3/u4IDQ5B14/8LQlhFhckVFfCJjIyIOfP/QWpEZGSQJFS05s9fIPj3/z+YmseCTxS7CZS7DI+PsYcOjpAkDAA6H0KZxzDzlgAAACV0RVh0ZGF0ZTpjcmVhdGUAMjAyMC0wOC0yN1QyMzo1MDowNi0wNDowMDvgVpQAAAAldEVYdGRhdGU6bW9kaWZ5ADIwMjAtMDgtMjdUMjM6NTA6MDYtMDQ6MDBKve4oAAAAAElFTkSuQmCC)
+        transform: rotate(45deg);
+        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAQUlEQVR4nHXOQQ4AMAgCQeT/f6aXpsGK3jSTuCVJAAr7iBdoAwCKd0nwfaAdHbYERw5b44+E8JoBjEYGMBq5gAYP3usUDu2IvoUAAAAASUVORK5CYII=);
     }
 
     .lm_maximised .lm_controls .lm_maximise {
diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx
index 388f9a909..a8471f8e2 100644
--- a/src/client/views/collections/CollectionDockingView.tsx
+++ b/src/client/views/collections/CollectionDockingView.tsx
@@ -445,4 +445,4 @@ Scripting.addGlobal(function openInLightbox(doc: any) { LightboxView.AddDocTab(d
     "opens up document in a lightbox", "(doc: any)");
 Scripting.addGlobal(function openOnRight(doc: any) { return CollectionDockingView.AddSplit(doc, "right"); },
     "opens up document in tab on right side of the screen", "(doc: any)");
-Scripting.addGlobal(function useRightSplit(doc: any, shiftKey?: boolean) { CollectionDockingView.ReplaceTab(doc, "right", undefined, shiftKey); });
+Scripting.addGlobal(function useRightSplit(doc: any, shiftKey?: boolean) { CollectionDockingView.ReplaceTab(doc, "right", undefined, shiftKey); });
\ No newline at end of file
diff --git a/src/client/views/collections/TabDocView.scss b/src/client/views/collections/TabDocView.scss
index 9acbc4f85..a963f1cb9 100644
--- a/src/client/views/collections/TabDocView.scss
+++ b/src/client/views/collections/TabDocView.scss
@@ -1,19 +1,62 @@
 input.lm_title:focus,
-input.lm_title
-{
+input.lm_title {
     max-width: unset !important;
+    outline: none;
     transition-delay: unset;
-    width: 100%;
+    width: max-content;
     cursor: text;
 }
+
 input.lm_title {
     transition-delay: 0.35s;
-    width: 100px;
+    width: max-content;
     cursor: pointer;
 }
-.tabDocView-drag {
-    margin: auto;
+
+.lm_iconWrap {
+    display: flex;
+    color: black;
+    width: 15px;
+    height: 15px;
+    align-items: center;
+    align-self: center;
+    justify-content: center;
+    margin: 3px;
+    border-radius: 20%;
+
+    .moreInfoDot {
+        background-color: white;
+        border-radius: 100%;
+        width: 3px;
+        height: 3px;
+        margin: 0.5px;
+    }
+}
+
+.ffMenu {
+    display: grid;
+    grid-auto-rows: 35px;
+    grid-auto-columns: auto auto auto auto auto;
+    right: 10px;
+    bottom: 50px;
+    position: absolute;
+    min-height: 35px;
+    height: max-content;
+    border: solid 2px black;
+    border-radius: 5px;
+    background-color: #bddbe6;
+    width: max-content;
+    min-width: 35px;
+
+    .ffMenuButton {
+        display: flex;
+        width: 35px;
+        height: 35px;
+        align-items: center;
+        justify-content: center;
+    }
 }
+
 .miniMap-hidden,
 .miniMap {
     position: absolute;
@@ -37,6 +80,7 @@ input.lm_title {
         }
     }
 }
+
 .miniMap-hidden {
     position: absolute;
     bottom: 0;
@@ -46,7 +90,8 @@ input.lm_title {
     transform: translate(20px, 20px) rotate(45deg);
     border-radius: 30px;
     padding: 2px;
-    > svg {
+
+    >svg {
         margin-top: 3px;
         transform: translate(0px, 7px);
     }
diff --git a/src/client/views/collections/TabDocView.tsx b/src/client/views/collections/TabDocView.tsx
index 7e2f7811e..0e67bebd8 100644
--- a/src/client/views/collections/TabDocView.tsx
+++ b/src/client/views/collections/TabDocView.tsx
@@ -1,3 +1,4 @@
+import { IconProp } from '@fortawesome/fontawesome-svg-core';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { Tooltip } from '@material-ui/core';
 import 'golden-layout/src/css/goldenlayout-base.css';
@@ -9,9 +10,9 @@ import * as ReactDOM from 'react-dom';
 import { DataSym, Doc, DocListCast, DocListCastAsync, HeightSym, Opt, WidthSym } from "../../../fields/Doc";
 import { Id } from '../../../fields/FieldSymbols';
 import { FieldId } from "../../../fields/RefField";
-import { Cast, NumCast, StrCast, BoolCast } from "../../../fields/Types";
+import { BoolCast, Cast, NumCast, StrCast } from "../../../fields/Types";
 import { TraceMobx } from '../../../fields/util';
-import { emptyFunction, returnEmptyDoclist, returnFalse, returnTrue, setupMoveUpEvents, Utils } from "../../../Utils";
+import { emptyFunction, lightOrDark, returnEmptyDoclist, returnFalse, returnTrue, setupMoveUpEvents, Utils } from "../../../Utils";
 import { DocServer } from "../../DocServer";
 import { DocUtils } from '../../documents/Documents';
 import { DocumentType } from '../../documents/DocumentTypes';
@@ -24,15 +25,15 @@ import { Transform } from '../../util/Transform';
 import { undoBatch, UndoManager } from "../../util/UndoManager";
 import { LightboxView } from '../LightboxView';
 import { DocFocusOptions, DocumentView, DocumentViewProps } from "../nodes/DocumentView";
-import { FieldViewProps } from '../nodes/FieldView';
-import { PinProps, PresBox, PresMovement } from '../nodes/PresBox';
+import { PresBox, PinProps, PresMovement } from '../nodes/PresBox';
 import { DefaultLayerProvider, DefaultStyleProvider, StyleLayers, StyleProp } from '../StyleProvider';
 import { CollectionDockingView } from './CollectionDockingView';
 import { CollectionDockingViewMenu } from './CollectionDockingViewMenu';
 import { CollectionFreeFormView } from './collectionFreeForm/CollectionFreeFormView';
-import { CollectionViewType, CollectionView } from './CollectionView';
+import { CollectionView, CollectionViewType } from './CollectionView';
 import "./TabDocView.scss";
 import React = require("react");
+import Color = require('color');
 const _global = (window /* browser */ || global /* node */) as any;
 
 interface TabDocViewProps {
@@ -52,6 +53,14 @@ export class TabDocView extends React.Component<TabDocViewProps> {
 
     @computed get layoutDoc() { return this._document && Doc.Layout(this._document); }
     @computed get tabColor() { return StrCast(this._document?._backgroundColor, StrCast(this._document?.backgroundColor, DefaultStyleProvider(this._document, undefined, StyleProp.BackgroundColor))); }
+    @computed get tabTextColor() { return this._document?.type === DocumentType.PRES ? "black" : StrCast(this._document?._color, StrCast(this._document?.color, DefaultStyleProvider(this._document, undefined, StyleProp.Color))); }
+    // @computed get renderBounds() {
+    //     const bounds = this._document ? Cast(this._document._renderContentBounds, listSpec("number"), [0, 0, this.returnMiniSize(), this.returnMiniSize()]) : [0, 0, 0, 0];
+    //     const xbounds = bounds[2] - bounds[0];
+    //     const ybounds = bounds[3] - bounds[1];
+    //     const dim = Math.max(xbounds, ybounds);
+    //     return { l: bounds[0] + xbounds / 2 - dim / 2, t: bounds[1] + ybounds / 2 - dim / 2, cx: bounds[0] + xbounds / 2, cy: bounds[1] + ybounds / 2, dim };
+    // }
 
     get stack() { return (this.props as any).glContainer.parent.parent; }
     get tab() { return (this.props as any).glContainer.tab; }
@@ -65,15 +74,25 @@ export class TabDocView extends React.Component<TabDocViewProps> {
             tab.contentItem.config.fixed && (tab.contentItem.parent.config.fixed = true);
             tab.DashDoc = doc;
             CollectionDockingView.Instance.tabMap.add(tab);
-
+            const iconType: IconProp = Doc.toIcon(doc);
             // setup the title element and set its size according to the # of chars in the title.  Show the full title when clicked.
             const titleEle = tab.titleElement[0];
+            const iconWrap = document.createElement("div");
+            const closeWrap = document.createElement("div");
+
+
             titleEle.size = StrCast(doc.title).length + 3;
             titleEle.value = doc.title;
             titleEle.onchange = undoBatch(action((e: any) => {
                 titleEle.size = e.currentTarget.value.length + 3;
                 Doc.GetProto(doc).title = e.currentTarget.value;
             }));
+
+            const dragBtnDown = (e: React.PointerEvent) => {
+                setupMoveUpEvents(this, e, e => !e.defaultPrevented && DragManager.StartDocumentDrag([iconWrap], new DragManager.DocumentDragData([doc], doc.dropAction as dropActionType), e.clientX, e.clientY), returnFalse, emptyFunction);
+            };
+
+
             if (tab.element[0].children[1].children.length === 1) {
                 const toggle = document.createElement("div");
                 toggle.style.width = "10px";
@@ -83,18 +102,42 @@ export class TabDocView extends React.Component<TabDocViewProps> {
                 toggle.style.borderTopRightRadius = "7px";
                 toggle.style.position = "relative";
                 toggle.style.display = "inline-block";
-                toggle.style.background = "gray";
-                toggle.style.borderLeft = "solid 1px black";
+                toggle.style.background = "transparent";
                 toggle.onclick = (e: MouseEvent) => {
                     if (tab.contentItem === tab.header.parent.getActiveContentItem()) {
                         tab.DashDoc.activeLayer = tab.DashDoc.activeLayer ? undefined : StyleLayers.Background;
                     }
                 };
-                tab.element[0].style.borderTopRightRadius = "8px";
-                tab.element[0].children[1].appendChild(toggle);
-                tab._disposers.layerDisposer = reaction(() =>
-                    ({ layer: tab.DashDoc.activeLayer, color: this.tabColor }),
-                    ({ layer, color }) => toggle.style.background = !layer ? color : "dimgrey", { fireImmediately: true });
+                iconWrap.className = "lm_iconWrap";
+                iconWrap.id = "lm_iconWrap";
+                closeWrap.className = "lm_iconWrap";
+                closeWrap.id = "lm_closeWrap";
+                closeWrap.onclick = (e: MouseEvent) => {
+                    tab.header.parent.contentItem.remove();
+                    Doc.AddDocToList(CurrentUserUtils.MyRecentlyClosed, "data", tab.DashDoc, undefined, true, true);
+                };
+                const docIcon = <FontAwesomeIcon onPointerDown={dragBtnDown} icon={iconType} />;
+                const closeIcon = <FontAwesomeIcon icon={"times"} />;
+                ReactDOM.render(docIcon, iconWrap);
+                ReactDOM.render(closeIcon, closeWrap);
+                // tab.element[0].append(closeWrap);
+                tab.element[0].prepend(iconWrap);
+                tab._disposers.layerDisposer = reaction(() => ({ layer: tab.DashDoc.activeLayer, color: this.tabColor }),
+                    ({ layer, color }) => {
+                        const textColor = lightOrDark(this.tabColor); //not working with StyleProp.Color
+                        titleEle.style.color = textColor;
+                        titleEle.style.backgroundColor = "transparent";
+                        iconWrap.style.color = textColor;
+                        closeWrap.style.color = textColor;
+                        moreInfoDrag.style.backgroundColor = textColor;
+                        tab.element[0].style.background = !layer ? color : "dimgrey";
+                    }, { fireImmediately: true });
+                // TODO:glr fix
+                // tab.element[0].style.borderTopRightRadius = "8px";
+                // tab.element[0].children[1].appendChild(toggle);
+                // tab._disposers.layerDisposer = reaction(() =>
+                //     ({ layer: tab.DashDoc.activeLayer, color: this.tabColor }),
+                //     ({ layer, color }) => toggle.style.background = !layer ? color : "dimgrey", { fireImmediately: true });
             }
             // shifts the focus to this tab when another tab is dragged over it
             tab.element[0].onmouseenter = (e: MouseEvent) => {
@@ -103,13 +146,11 @@ export class TabDocView extends React.Component<TabDocViewProps> {
                     tab.setActive(true);
                 }
             };
-            const dragBtnDown = (e: React.PointerEvent) => {
-                setupMoveUpEvents(this, e, e => !e.defaultPrevented && DragManager.StartDocumentDrag([dragHdl], new DragManager.DocumentDragData([doc], doc.dropAction as dropActionType), e.clientX, e.clientY), returnFalse, emptyFunction);
-            };
+
 
             // select the tab document when the tab is directly clicked and activate the tab whenver the tab document is selected
             titleEle.onpointerdown = action((e: any) => {
-                if (e.target.className !== "lm_close_tab") {
+                if (e.target.className !== "lm_iconWrap") {
                     if (this.view) SelectionManager.SelectView(this.view, false);
                     else this._activated = true;
                     if (Date.now() - titleEle.lastClick < 1000) titleEle.select();
@@ -123,25 +164,25 @@ export class TabDocView extends React.Component<TabDocViewProps> {
                     const toggle = tab.element[0].children[1].children[0] as HTMLInputElement;
                     selected && tab.contentItem !== tab.header.parent.getActiveContentItem() &&
                         UndoManager.RunInBatch(() => tab.header.parent.setActiveContentItem(tab.contentItem), "tab switch");
-                    toggle.style.fontWeight = selected ? "bold" : "";
-                    toggle.style.textTransform = selected ? "uppercase" : "";
+                    // toggle.style.fontWeight = selected ? "bold" : "";
+                    // toggle.style.textTransform = selected ? "uppercase" : "";
                 }));
 
             //attach the selection doc buttons menu to the drag handle
             const stack = tab.contentItem.parent;
-            const dragHdl = document.createElement("div");
-            dragHdl.className = "lm_drag_tab";
+            const moreInfoDrag = document.createElement("div");
+            moreInfoDrag.className = "lm_iconWrap";
             tab._disposers.buttonDisposer = reaction(() => this.view, view =>
-                view && [ReactDOM.render(<span className="tabDocView-drag" onPointerDown={dragBtnDown}><CollectionDockingViewMenu views={() => [view]} Stack={stack} /></span>, dragHdl), tab._disposers.buttonDisposer?.()],
+                view && [ReactDOM.render(<span><CollectionDockingViewMenu views={() => [view]} Stack={stack} /></span>, moreInfoDrag), tab._disposers.buttonDisposer?.()],
                 { fireImmediately: true });
-            tab.reactComponents = [dragHdl];
-            tab.closeElement.before(dragHdl);
+            // tab.reactComponents = [moreInfoDrag];
+            // tab.element[0].children[3].before(moreInfoDrag);
 
             // highlight the tab when the tab document is brushed in any part of the UI
             tab._disposers.reactionDisposer = reaction(() => ({ title: doc.title, degree: Doc.IsBrushedDegree(doc) }), ({ title, degree }) => {
                 titleEle.value = title;
-                titleEle.style.padding = degree ? 0 : 2;
-                titleEle.style.border = `${["gray", "gray", "gray"][degree]} ${["none", "dashed", "solid"][degree]} 2px`;
+                // titleEle.style.padding = degree ? 0 : 2;
+                // titleEle.style.border = `${["gray", "gray", "gray"][degree]} ${["none", "dashed", "solid"][degree]} 2px`;
             }, { fireImmediately: true });
 
             // clean up the tab when it is closed
@@ -221,9 +262,9 @@ export class TabDocView extends React.Component<TabDocViewProps> {
         })).observe(this.props.glContainer._element[0]);
         this.props.glContainer.layoutManager.on("activeContentItemChanged", this.onActiveContentItemChanged);
         this.props.glContainer.tab?.isActive && this.onActiveContentItemChanged(undefined);
-        this._tabReaction = reaction(() => ({ selected: this.active(), title: this.tab?.titleElement[0] }),
-            ({ selected, title }) => title && (title.style.backgroundColor = selected ? "white" : ""),
-            { fireImmediately: true });
+        // this._tabReaction = reaction(() => ({ selected: this.active(), title: this.tab?.titleElement[0] }),
+        //     ({ selected, title }) => title && (title.style.backgroundColor = selected ? "white" : ""),
+        //     { fireImmediately: true });
     }
 
     componentWillUnmount() {
@@ -243,10 +284,10 @@ export class TabDocView extends React.Component<TabDocViewProps> {
     }
 
     // adds a tab to the layout based on the locaiton parameter which can be:
-    //  close[:{left,right,top,bottom}]  - e.g., "close" will close the tab, "close:left" will close the left tab, 
+    //  close[:{left,right,top,bottom}]  - e.g., "close" will close the tab, "close:left" will close the left tab,
     //  add[:{left,right,top,bottom}] - e.g., "add" will add a tab to the current stack, "add:right" will add a tab on the right
-    //  replace[:{left,right,top,bottom,<any string>}] - e.g., "replace" will replace the current stack contents, 
-    //                                  "replace:right" - will replace the stack on the right named "right" if it exists, or create a stack on the right with that name, 
+    //  replace[:{left,right,top,bottom,<any string>}] - e.g., "replace" will replace the current stack contents,
+    //                                  "replace:right" - will replace the stack on the right named "right" if it exists, or create a stack on the right with that name,
     //                                   "replace:monkeys" - will replace any tab that has the label 'monkeys', or a tab with that label will be created by default on the right
     //  inPlace - will add the document to any collection along the path from the document to the docking view that has a field isInPlaceContainer. if none is found, inPlace adds a tab to current stack
     addDocTab = (doc: Doc, location: string) => {
@@ -460,4 +501,4 @@ export class TabMinimapView extends React.Component<TabMinimapViewProps> {
                 </div>
             </div>;
     }
-}
\ No newline at end of file
+}
diff --git a/src/client/views/global/globalCssVariables.scss b/src/client/views/global/globalCssVariables.scss
index ead5e166e..a8d4235bd 100644
--- a/src/client/views/global/globalCssVariables.scss
+++ b/src/client/views/global/globalCssVariables.scss
@@ -21,8 +21,6 @@ $large-padding: 32px;
 //icon sizes
 $icon-size: 28px;
 
-$antimodemenu-height: 36px;
-
 // fonts
 $sans-serif: "Noto Sans", sans-serif;
 $large-header: 16px;
@@ -33,6 +31,8 @@ $small-text: 9px;
 // misc values
 $border-radius: 0.3em;
 $search-thumnail-size: 130;
+$topbar-height: 32px;
+$antimodemenu-height: 36px;
 
 // dragged items
 $contextMenu-zindex: 100000; // context menu shows up over everything
diff --git a/src/client/views/global/globalEnums.tsx b/src/client/views/global/globalEnums.tsx
index 1e0381c33..2aeb8e338 100644
--- a/src/client/views/global/globalEnums.tsx
+++ b/src/client/views/global/globalEnums.tsx
@@ -31,4 +31,8 @@ export enum Padding {
 
 export enum IconSizes {
     ICON_SIZE = "28px",
+}
+
+export enum Borders {
+    STANDARD = "solid 1px #9F9F9F"
 }
\ No newline at end of file
diff --git a/src/client/views/topbar/TopBar.scss b/src/client/views/topbar/TopBar.scss
new file mode 100644
index 000000000..324b96dbd
--- /dev/null
+++ b/src/client/views/topbar/TopBar.scss
@@ -0,0 +1,211 @@
+@import "../global/globalCssVariables";
+
+.topbar-container {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    position: relative;
+    font-size: 10px;
+    line-height: 1;
+    overflow-y: auto;
+    overflow-x: visible;
+    background: $dark-gray;
+    overflow: visible;
+    z-index: 1000;
+
+    .topbar-bar {
+        height: $topbar-height;
+        display: grid;
+        grid-auto-columns: 33.3% 33.3% 33.3%;
+        align-items: center;
+        background-color: $dark-gray;
+
+        .topbar-center {
+            grid-column: 2;
+            display: inline-flex;
+            justify-content: center;
+            align-items: center;
+
+            .topbar-lozenge-dashboard {
+                display: flex;
+
+                .topbar-dashboards {
+                    display: none;
+                }
+
+                .topbar-dashSelect {
+                    border: none;
+                    background-color: transparent;
+                    color: black;
+                    font-family: 'Roboto';
+                    font-size: 17;
+                    font-weight: 500;
+
+                    &:hover {
+                        cursor: pointer;
+                    }
+                }
+            }
+
+            .topbar-lozenge-dashboard:hover {
+                .topbar-dashboards {
+                    display: inline-flex;
+                }
+            }
+        }
+
+        .topBar-icon {
+            color: black;
+            cursor: pointer;
+            font-size: 15px;
+            height: 30;
+            width: 30;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            margin-right: 5px;
+            justify-self: center;
+            align-self: center;
+            border-radius: 100%;
+            transition: linear 0.1s;
+            background-color: #92adb900;
+        }
+
+        .topBar-icon:hover {
+            background-color: rgba(0, 0, 0, 0.15);
+        }
+
+        .topbar-right {
+            grid-column: 3;
+            position: relative;
+            display: flex;
+            justify-content: flex-end;
+
+            .topbar-lozenge-user,
+            .topbar-lozenge {
+                height: 23;
+                font-size: 12;
+                color: black;
+                font-family: 'Roboto';
+                font-weight: 400;
+                padding: 4px;
+                align-self: center;
+                margin-right: 7px;
+                display: flex;
+                align-items: center;
+                border: black 1px solid;
+
+                .topbar-logoff {
+                    border-radius: 3px;
+                    background: olivedrab;
+                    color: white;
+                    display: none;
+                    margin-left: 5px;
+                    padding: 1px 2px 1px 2px;
+                    cursor: pointer;
+                }
+
+                .topbar-logoff {
+                    background: red;
+                }
+
+                .topbar-dashSelect {
+                    border: none;
+                    background-color: transparent;
+                    color: black;
+                    font-family: 'Roboto';
+                    font-size: 17;
+                    font-weight: 500;
+
+                    &:hover {
+                        cursor: pointer;
+                    }
+                }
+            }
+
+            .topbar-lozenge-user:hover {
+                .topbar-logoff {
+                    display: inline-block;
+                }
+            }
+
+        }
+
+        .topbar-left {
+            grid-column: 1;
+            color: black;
+            font-family: 'Roboto';
+            position: relative;
+            display: flex;
+            width: 450;
+        }
+
+        .topbar-barChild {
+
+            &.topbar-collection {
+                flex: 0 1 auto;
+                margin-left: 2px;
+                margin-right: 2px
+            }
+
+            &.topbar-input {
+                margin:5px;
+                border-radius:20px;
+                border:$dark-gray;    
+                display: block;
+                width: 130px;
+                -webkit-transition: width 0.4s;
+                transition: width 0.4s;
+                /* align-self: stretch; */
+                outline: none;
+
+                &:focus {
+                    width: 500px;
+                    outline: none;
+                }
+            }
+
+            &.topbar-filter {
+                align-self: stretch;
+
+                button {
+                    transform: none;
+
+                    &:hover {
+                        transform: none;
+                    }
+                }
+            }
+
+            &.topbar-submit {
+                margin-left: 2px;
+                margin-right: 2px
+            }
+
+            &.topbar-close {
+                color: $white;
+                max-height: $topbar-height;
+            }
+        }
+    }
+}
+
+.topbar-results {
+    display: flex;
+    flex-direction: column;
+    top: 300px;
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    overflow: visible;
+
+    .no-result {
+        width: 500px;
+        background: $light-gray;
+        padding: 10px;
+        height: 50px;
+        text-transform: uppercase;
+        text-align: left;
+        font-weight: bold;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/topbar/TopBar.tsx b/src/client/views/topbar/TopBar.tsx
new file mode 100644
index 000000000..79239d4ea
--- /dev/null
+++ b/src/client/views/topbar/TopBar.tsx
@@ -0,0 +1,58 @@
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import * as React from 'react';
+import { Doc, DocListCast } from '../../../fields/Doc';
+import { Id } from '../../../fields/FieldSymbols';
+import { StrCast } from '../../../fields/Types';
+import { Utils } from '../../../Utils';
+import { CurrentUserUtils } from "../../util/CurrentUserUtils";
+import { ColorScheme, SettingsManager } from "../../util/SettingsManager";
+import { undoBatch } from "../../util/UndoManager";
+import "./TopBar.scss";
+import { Colors, Borders } from "../global/globalEnums";
+
+export const TopBar = () => {
+
+    const myDashboards = DocListCast(CurrentUserUtils.MyDashboards.data);
+    return (
+        <div style={{ pointerEvents: "all" }} className="topbar-container">
+            <div className="topbar-bar" style={{ background: Doc.UserDoc().colorScheme === ColorScheme.Dark ? Colors.DARK_GRAY : Colors.LIGHT_GRAY, borderBottom: Borders.STANDARD }}>
+                <div className="topbar-center" >
+                    <div className="topbar-lozenge-dashboard">
+                        <select className="topbar-dashSelect" onChange={e => CurrentUserUtils.openDashboard(Doc.UserDoc(), myDashboards[Number(e.target.value)])}
+                            value={myDashboards.indexOf(CurrentUserUtils.ActiveDashboard)}
+                            style={{ color: Doc.UserDoc().colorScheme === ColorScheme.Dark ? "white" : "black" }}>
+                            {myDashboards.map((dash, i) => <option key={dash[Id]} value={i}> {StrCast(dash.title)} </option>)}
+                        </select>
+                        <div className="topbar-dashboards">
+                            <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.createNewDashboard(Doc.UserDoc()))}
+                                style={{ color: Doc.UserDoc().colorScheme === ColorScheme.Dark ? "white" : "black" }}>
+                                <FontAwesomeIcon icon="plus"></FontAwesomeIcon>
+                            </div>
+                            <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.snapshotDashboard(Doc.UserDoc()))}
+                                style={{ color: Doc.UserDoc().colorScheme === ColorScheme.Dark ? "white" : "black" }}>
+                                <FontAwesomeIcon icon="camera"></FontAwesomeIcon>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div className="topbar-right" >
+                    <div className="topbar-icon"
+                        style={{ color: Doc.UserDoc().colorScheme === ColorScheme.Dark ? "white" : "black" }}>
+                        <FontAwesomeIcon icon="question-circle"></FontAwesomeIcon>
+                    </div>
+                    <div className="topbar-icon" onClick={() => SettingsManager.Instance.open()}
+                        style={{ color: Doc.UserDoc().colorScheme === ColorScheme.Dark ? "white" : "black" }}>
+                        <FontAwesomeIcon icon="cog"></FontAwesomeIcon>
+                    </div>
+                    <div className="topbar-lozenge-user">
+                        {`${Doc.CurrentUserEmail}`}
+                        <div className="topbar-logoff" onClick={() => window.location.assign(Utils.prepend("/logout"))}>
+                            Logoff
+                        </div>
+                    </div>
+                </div>
+
+            </div >
+        </div >
+    );
+}
\ No newline at end of file
diff --git a/src/fields/Doc.ts b/src/fields/Doc.ts
index 464a8ad05..ee8d36f09 100644
--- a/src/fields/Doc.ts
+++ b/src/fields/Doc.ts
@@ -23,6 +23,7 @@ import { Cast, FieldValue, NumCast, StrCast, ToConstructor } from "./Types";
 import { AudioField, ImageField, PdfField, VideoField, WebField } from "./URLField";
 import { deleteProperty, GetEffectiveAcl, getField, getter, makeEditable, makeReadOnly, normalizeEmail, setter, SharingPermissions, updateFunction } from "./util";
 import JSZip = require("jszip");
+import { IconProp } from "@fortawesome/fontawesome-svg-core";
 
 export namespace Field {
     export function toKeyValueString(doc: Doc, key: string): string {
@@ -1184,7 +1185,10 @@ export namespace Doc {
             case DocumentType.IMG: return "image";
             case DocumentType.COMPARISON: return "columns";
             case DocumentType.RTF: return "sticky-note";
-            case DocumentType.COL: return !doc?.isFolder ? "folder" + (isOpen ? "-open" : "") : "chevron-" + (isOpen ? "down" : "right");
+            case DocumentType.COL:
+                const folder: IconProp = isOpen ? "folder-open" : "folder";
+                const chevron: IconProp = isOpen ? "chevron-down" : "chevron-right"
+                return !doc?.isFolder ? folder : chevron;
             case DocumentType.WEB: return "globe-asia";
             case DocumentType.SCREENSHOT: return "photo-video";
             case DocumentType.WEBCAM: return "video";
-- 
cgit v1.2.3-70-g09d2


From a5faca5f510e60ecce125ab59096d4e943352ea5 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 29 Jul 2021 17:49:14 -0400
Subject: fixed issues with following links to anchors in PDFs/etc and getting
 scroll position right.

---
 src/Utils.ts                                                  | 11 ++++++-----
 src/client/views/MarqueeAnnotator.tsx                         | 10 ++++++++--
 src/client/views/StyleProvider.tsx                            |  1 +
 .../collections/collectionFreeForm/CollectionFreeFormView.tsx | 10 +++++-----
 src/client/views/nodes/WebBox.tsx                             |  3 ++-
 src/client/views/pdf/PDFViewer.tsx                            |  3 ++-
 6 files changed, 24 insertions(+), 14 deletions(-)

(limited to 'src')

diff --git a/src/Utils.ts b/src/Utils.ts
index ef9c51b8b..d87c3cc6b 100644
--- a/src/Utils.ts
+++ b/src/Utils.ts
@@ -191,11 +191,12 @@ export namespace Utils {
         return { h: h, s: s, l: l };
     }
 
-    export function scrollIntoView(targetY: number, targetHgt: number, scrollTop: number, contextHgt: number) {
-        if (scrollTop + contextHgt < targetY + targetHgt * 1.1) {
-            return Math.ceil(targetY + targetHgt * 1.1 - contextHgt);
-        } else if (scrollTop > targetY - targetHgt * .1) {
-            return Math.max(0, Math.floor(targetY - targetHgt * .1));
+    export function scrollIntoView(targetY: number, targetHgt: number, scrollTop: number, contextHgt: number, minSpacing: number) {
+        if (scrollTop + contextHgt < targetY + minSpacing + targetHgt) {
+            return Math.ceil(targetY + minSpacing + targetHgt - contextHgt);
+        }
+        if (scrollTop > targetY - minSpacing - targetHgt) {
+            return Math.max(0, Math.floor(targetY - minSpacing - targetHgt));
         }
     }
 
diff --git a/src/client/views/MarqueeAnnotator.tsx b/src/client/views/MarqueeAnnotator.tsx
index 717bd0768..805cda95c 100644
--- a/src/client/views/MarqueeAnnotator.tsx
+++ b/src/client/views/MarqueeAnnotator.tsx
@@ -120,9 +120,11 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
             return marqueeAnno;
         }
 
-        const textRegionAnno = Docs.Create.HTMLAnchorDocument([], { annotationOn: this.props.rootDoc, title: "Selection on " + this.props.rootDoc.title, _width: 1, _height: 1 });
+        const textRegionAnno = Docs.Create.HTMLAnchorDocument([], { annotationOn: this.props.rootDoc, backgroundColor: "transparent", title: "Selection on " + this.props.rootDoc.title });
+        let minX = Number.MAX_VALUE;
         let maxX = -Number.MAX_VALUE;
         let minY = Number.MAX_VALUE;
+        let maxY = -Number.MIN_VALUE;
         const annoDocs: Doc[] = [];
         savedAnnoMap.forEach((value: HTMLDivElement[], key: number) => value.map(anno => {
             const textRegion = new Doc();
@@ -135,12 +137,16 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
             annoDocs.push(textRegion);
             anno.remove();
             minY = Math.min(NumCast(textRegion.y), minY);
+            minX = Math.min(NumCast(textRegion.x), minX);
+            maxY = Math.max(NumCast(textRegion.y) + NumCast(textRegion._height), maxY);
             maxX = Math.max(NumCast(textRegion.x) + NumCast(textRegion._width), maxX);
         }));
 
         const textRegionAnnoProto = Doc.GetProto(textRegionAnno);
         textRegionAnnoProto.y = Math.max(minY, 0);
-        textRegionAnnoProto.x = Math.max(maxX, 0);
+        textRegionAnnoProto.x = Math.max(minX, 0);
+        textRegionAnnoProto.height = Math.max(maxY, 0) - Math.max(minY, 0);
+        textRegionAnnoProto.width = Math.max(maxX, 0) - Math.max(minX, 0);
         // mainAnnoDocProto.text = this._selectionText;
         textRegionAnnoProto.textInlineAnnotations = new List<Doc>(annoDocs);
         savedAnnoMap.clear();
diff --git a/src/client/views/StyleProvider.tsx b/src/client/views/StyleProvider.tsx
index 32ddc140c..dc6ac0366 100644
--- a/src/client/views/StyleProvider.tsx
+++ b/src/client/views/StyleProvider.tsx
@@ -174,6 +174,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
             }
         }
         case StyleProp.PointerEvents:
+            if (doc?.type === DocumentType.HTMLANCHOR) return "none";
             if (props?.pointerEvents === "none") return "none";
             const layer = doc && props?.layerProvider?.(doc);
             if (opacity() === 0 || (doc?.type === DocumentType.INK && !docProps?.treeViewDoc) || doc?.isInkMask) return "none";
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index a4e310e6c..7fa5fd871 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -48,6 +48,7 @@ import { CollectionFreeFormRemoteCursors } from "./CollectionFreeFormRemoteCurso
 import "./CollectionFreeFormView.scss";
 import { MarqueeView } from "./MarqueeView";
 import React = require("react");
+import { DocumentType } from "../../../documents/DocumentTypes";
 
 export const panZoomSchema = createSchema({
     _panX: "number",
@@ -834,10 +835,9 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
                 map(doc => ({ ...this.childDataProvider(doc, ""), ...this.childSizeProvider(doc, "") }));
             if (measuredDocs.length) {
                 const ranges = measuredDocs.reduce(({ xrange, yrange }, { x, y, width, height }) =>  // computes range of content
-                ({
-                    xrange: { min: Math.min(xrange.min, x), max: Math.max(xrange.max, x + width) },
-                    yrange: { min: Math.min(yrange.min, y), max: Math.max(yrange.max, y + height) }
-                })
+                        xrange: { min: Math.min(xrange.min, x), max: Math.max(xrange.max, x + width) },
+                        yrange: { min: Math.min(yrange.min, y), max: Math.max(yrange.max, y + height) }
+                    })
                     , {
                         xrange: { min: Number.MAX_VALUE, max: -Number.MAX_VALUE },
                         yrange: { min: Number.MAX_VALUE, max: -Number.MAX_VALUE }
@@ -1486,7 +1486,7 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
             onDragOver={e => e.preventDefault()}
             onContextMenu={this.onContextMenu}
             style={{
-                pointerEvents: this.backgroundEvents ? "all" : this.props.pointerEvents as any,
+                pointerEvents: this.props.Document.type === DocumentType.HTMLANCHOR ? "none" : this.backgroundEvents ? "all" : this.props.pointerEvents as any,
                 transform: `scale(${this.contentScaling || 1})`,
                 width: `${100 / (this.contentScaling || 1)}%`,
                 height: this.isAnnotationOverlay && this.Document.scrollHeight ? this.Document.scrollHeight : `${100 / (this.contentScaling || 1)}%`// : this.isAnnotationOverlay ? (this.Document.scrollHeight ? this.Document.scrollHeight : "100%") : this.props.PanelHeight()
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index 88e38712a..c60798c6d 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -162,7 +162,8 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
     scrollFocus = (doc: Doc, smooth: boolean) => {
         if (this._sidebarRef?.current?.makeDocUnfiltered(doc)) return 1;
         if (doc !== this.rootDoc && this._outerRef.current) {
-            const scrollTo = doc.type === DocumentType.TEXTANCHOR ? NumCast(doc.y) : Utils.scrollIntoView(NumCast(doc.y), doc[HeightSym](), NumCast(this.layoutDoc._scrollTop), this.props.PanelHeight() / (this.props.scaling?.() || 1));
+            const windowHeight = this.props.PanelHeight() / (this.props.scaling?.() || 1);
+            const scrollTo = doc.type === DocumentType.TEXTANCHOR ? NumCast(doc.y) : Utils.scrollIntoView(NumCast(doc.y), doc[HeightSym](), NumCast(this.layoutDoc._scrollTop), windowHeifht, windowHeight * .1);
             if (scrollTo !== undefined) {
                 const focusSpeed = smooth ? 500 : 0;
                 this._initialScroll !== undefined && (this._initialScroll = scrollTo);
diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx
index 4a50dccf3..e8c7a4ab0 100644
--- a/src/client/views/pdf/PDFViewer.tsx
+++ b/src/client/views/pdf/PDFViewer.tsx
@@ -184,7 +184,8 @@ export class PDFViewer extends React.Component<IViewerProps> {
         const mainCont = this._mainCont.current;
         let focusSpeed: Opt<number>;
         if (doc !== this.props.rootDoc && mainCont && this._pdfViewer) {
-            const scrollTo = Utils.scrollIntoView(NumCast(doc.y), doc[HeightSym](), NumCast(this.props.layoutDoc._scrollTop), this.props.PanelHeight() / (this.props.scaling?.() || 1));
+            const windowHeight = this.props.PanelHeight() / (this.props.scaling?.() || 1);
+            const scrollTo = Utils.scrollIntoView(NumCast(doc.y), doc[HeightSym](), NumCast(this.props.layoutDoc._scrollTop), windowHeight, .1 * windowHeight);
             if (scrollTo !== undefined) {
                 focusSpeed = 500;
 
-- 
cgit v1.2.3-70-g09d2


From e950b1828e2331f840b3b25dc9f8cb332ffe0105 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 29 Jul 2021 17:49:48 -0400
Subject: from last

---
 .../views/collections/collectionFreeForm/CollectionFreeFormView.tsx   | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index 7fa5fd871..35da09af6 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -835,6 +835,7 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
                 map(doc => ({ ...this.childDataProvider(doc, ""), ...this.childSizeProvider(doc, "") }));
             if (measuredDocs.length) {
                 const ranges = measuredDocs.reduce(({ xrange, yrange }, { x, y, width, height }) =>  // computes range of content
+                    ({
                         xrange: { min: Math.min(xrange.min, x), max: Math.max(xrange.max, x + width) },
                         yrange: { min: Math.min(yrange.min, y), max: Math.max(yrange.max, y + height) }
                     })
@@ -1486,7 +1487,8 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
             onDragOver={e => e.preventDefault()}
             onContextMenu={this.onContextMenu}
             style={{
-                pointerEvents: this.props.Document.type === DocumentType.HTMLANCHOR ? "none" : this.backgroundEvents ? "all" : this.props.pointerEvents as any,
+                pointerEvents: this.props.Document.type === DocumentType.HTMLANCHOR ? "none" :  // bcz: ugh.. this is here to prevent htmlanchor's, which render as freeform views, from grabbing events -- need a better approach.
+                    this.backgroundEvents ? "all" : this.props.pointerEvents as any,
                 transform: `scale(${this.contentScaling || 1})`,
                 width: `${100 / (this.contentScaling || 1)}%`,
                 height: this.isAnnotationOverlay && this.Document.scrollHeight ? this.Document.scrollHeight : `${100 / (this.contentScaling || 1)}%`// : this.isAnnotationOverlay ? (this.Document.scrollHeight ? this.Document.scrollHeight : "100%") : this.props.PanelHeight()
-- 
cgit v1.2.3-70-g09d2


From 3d4716badd33afe0776da7fdd907a057ac88d698 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 29 Jul 2021 18:49:02 -0400
Subject: fixed navigating to a PDF anchor from sidebar.

---
 src/client/util/SelectionManager.ts | 3 ++-
 src/client/views/SidebarAnnos.tsx   | 2 +-
 2 files changed, 3 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/client/util/SelectionManager.ts b/src/client/util/SelectionManager.ts
index 00f0894c7..7aeb19391 100644
--- a/src/client/util/SelectionManager.ts
+++ b/src/client/util/SelectionManager.ts
@@ -4,6 +4,7 @@ import { Doc, Opt } from "../../fields/Doc";
 import { CollectionSchemaView } from "../views/collections/collectionSchema/CollectionSchemaView";
 import { CollectionViewType } from "../views/collections/CollectionView";
 import { DocumentView } from "../views/nodes/DocumentView";
+import { DocumentType } from "../documents/DocumentTypes";
 
 export namespace SelectionManager {
 
@@ -22,7 +23,7 @@ export namespace SelectionManager {
         @action
         SelectView(docView: DocumentView, ctrlPressed: boolean): void {
             // if doc is not in SelectedDocuments, add it
-            if (!manager.SelectedViews.get(docView)) {
+            if (!manager.SelectedViews.get(docView) && docView.props.Document.type !== DocumentType.HTMLANCHOR) {
                 if (!ctrlPressed) {
                     this.DeselectAll();
                 }
diff --git a/src/client/views/SidebarAnnos.tsx b/src/client/views/SidebarAnnos.tsx
index 9c5a54574..c5ae82c61 100644
--- a/src/client/views/SidebarAnnos.tsx
+++ b/src/client/views/SidebarAnnos.tsx
@@ -79,7 +79,7 @@ export class SidebarAnnos extends React.Component<FieldViewProps & ExtraProps> {
 
     sidebarStyleProvider = (doc: Opt<Doc>, props: Opt<FieldViewProps | DocumentViewProps>, property: string) => {
         if (property === StyleProp.ShowTitle) {
-            return doc === this.props.rootDoc ? 0 : StrCast(this.props.layoutDoc["sidebar-childShowTitle"], "title");
+            return doc === this.props.rootDoc ? undefined : StrCast(this.props.layoutDoc["sidebar-childShowTitle"], "title");
         }
         return this.props.styleProvider?.(doc, props, property);
     }
-- 
cgit v1.2.3-70-g09d2


From e63ebde5c968f458b4aa8fade0271fbbcaf451c4 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 29 Jul 2021 19:30:16 -0400
Subject: from last

---
 src/client/views/nodes/WebBox.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index c60798c6d..abc3a7d7d 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -163,7 +163,7 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
         if (this._sidebarRef?.current?.makeDocUnfiltered(doc)) return 1;
         if (doc !== this.rootDoc && this._outerRef.current) {
             const windowHeight = this.props.PanelHeight() / (this.props.scaling?.() || 1);
-            const scrollTo = doc.type === DocumentType.TEXTANCHOR ? NumCast(doc.y) : Utils.scrollIntoView(NumCast(doc.y), doc[HeightSym](), NumCast(this.layoutDoc._scrollTop), windowHeifht, windowHeight * .1);
+            const scrollTo = doc.type === DocumentType.TEXTANCHOR ? NumCast(doc.y) : Utils.scrollIntoView(NumCast(doc.y), doc[HeightSym](), NumCast(this.layoutDoc._scrollTop), windowHeight, windowHeight * .1);
             if (scrollTo !== undefined) {
                 const focusSpeed = smooth ? 500 : 0;
                 this._initialScroll !== undefined && (this._initialScroll = scrollTo);
-- 
cgit v1.2.3-70-g09d2


From b6b2057cf28e8c0d3c22b9056074fe5155602d0a Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 29 Jul 2021 20:15:46 -0400
Subject: converted HTMLANCHOR and TEXTANCHOR to MARKER

---
 src/client/documents/DocumentTypes.ts                      |  4 +---
 src/client/documents/Documents.ts                          | 14 +++++---------
 src/client/util/DocumentManager.ts                         |  4 ++--
 src/client/util/SelectionManager.ts                        |  2 +-
 src/client/views/StyleProvider.tsx                         |  2 +-
 src/client/views/collections/CollectionTimeView.tsx        |  2 +-
 .../collectionFreeForm/CollectionFreeFormView.tsx          |  2 +-
 src/client/views/nodes/WebBox.tsx                          |  2 +-
 src/fields/Doc.ts                                          |  2 +-
 9 files changed, 14 insertions(+), 20 deletions(-)

(limited to 'src')

diff --git a/src/client/documents/DocumentTypes.ts b/src/client/documents/DocumentTypes.ts
index 8565784b4..dba7ff907 100644
--- a/src/client/documents/DocumentTypes.ts
+++ b/src/client/documents/DocumentTypes.ts
@@ -18,7 +18,7 @@ export enum DocumentType {
     LABEL = "label",            // simple text label
     BUTTON = "button",          // onClick button
     WEBCAM = "webcam",          // webcam
-    HTMLANCHOR = "htmlanchor",  // text selection anchor in PDF/Web
+    MARKER = "marker",          // generic marker document not intended to be viewed independently of its context (e.g., for text selections in PDF/Web/RTF)
     DATE = "date",              // calendar view of a date
     SCRIPTING = "script",       // script editor
     EQUATION = "equation",      // equation editor
@@ -40,6 +40,4 @@ export enum DocumentType {
     LINKDB = "linkdb",          // database of links  ??? why do we have this
     SCRIPTDB = "scriptdb",      // database of scripts
     GROUPDB = "groupdb",        // database of groups
-
-    TEXTANCHOR = "textanchor"   // selection of text in a text box
 }
\ No newline at end of file
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index f1db3e32c..e863b4198 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -427,7 +427,7 @@ export namespace Docs {
             [DocumentType.PRESELEMENT, {
                 layout: { view: PresElementBox, dataField: defaultDataKey }
             }],
-            [DocumentType.HTMLANCHOR, {
+            [DocumentType.MARKER, {
                 layout: { view: CollectionView, dataField: defaultDataKey },
                 options: { links: ComputedField.MakeFunction("links(self)") as any, hideLinkButton: true }
             }],
@@ -452,10 +452,6 @@ export namespace Docs {
                 layout: { view: EmptyBox, dataField: defaultDataKey },
                 options: { links: ComputedField.MakeFunction("links(self)") as any }
             }],
-            [DocumentType.TEXTANCHOR, {
-                layout: { view: EmptyBox, dataField: defaultDataKey },
-                options: { targetDropAction: "move", links: ComputedField.MakeFunction("links(self)") as any, hideLinkButton: true }
-            }]
         ]);
 
         const suffix = "Proto";
@@ -670,9 +666,9 @@ export namespace Docs {
             viewProps["acl-Override"] = "None";
             viewProps["acl-Public"] = Doc.UserDoc()?.defaultAclPrivate ? SharingPermissions.None : SharingPermissions.Add;
             const viewDoc = Doc.assign(Doc.MakeDelegate(dataDoc, delegId), viewProps, true, true);
-            ![DocumentType.LINK, DocumentType.TEXTANCHOR, DocumentType.LABEL].includes(viewDoc.type as any) && DocUtils.MakeLinkToActiveAudio(() => viewDoc);
+            ![DocumentType.LINK, DocumentType.MARKER, DocumentType.LABEL].includes(viewDoc.type as any) && DocUtils.MakeLinkToActiveAudio(() => viewDoc);
 
-            !Doc.IsSystem(dataDoc) && ![DocumentType.HTMLANCHOR, DocumentType.KVP, DocumentType.LINK, DocumentType.LINKANCHOR, DocumentType.TEXTANCHOR].includes(proto.type as any) &&
+            !Doc.IsSystem(dataDoc) && ![DocumentType.MARKER, DocumentType.KVP, DocumentType.LINK, DocumentType.LINKANCHOR].includes(proto.type as any) &&
                 !dataDoc.isFolder && !dataProps.annotationOn && Doc.AddDocToList(Cast(Doc.UserDoc().myFileOrphans, Doc, null), "data", dataDoc);
 
             return viewDoc;
@@ -802,7 +798,7 @@ export namespace Docs {
         }
 
         export function TextanchorDocument(options: DocumentOptions = {}, id?: string) {
-            return InstanceFromProto(Prototypes.get(DocumentType.TEXTANCHOR), undefined, options, id);
+            return InstanceFromProto(Prototypes.get(DocumentType.MARKER), undefined, options, id);
         }
 
         export function FreeformDocument(documents: Array<Doc>, options: DocumentOptions, id?: string) {
@@ -811,7 +807,7 @@ export namespace Docs {
             return inst;
         }
         export function HTMLAnchorDocument(documents: Array<Doc>, options: DocumentOptions, id?: string) {
-            return InstanceFromProto(Prototypes.get(DocumentType.HTMLANCHOR), new List(documents), options, id);
+            return InstanceFromProto(Prototypes.get(DocumentType.MARKER), new List(documents), options, id);
         }
 
         export function PileDocument(documents: Array<Doc>, options: DocumentOptions, id?: string) {
diff --git a/src/client/util/DocumentManager.ts b/src/client/util/DocumentManager.ts
index 304215a8f..5b092258a 100644
--- a/src/client/util/DocumentManager.ts
+++ b/src/client/util/DocumentManager.ts
@@ -28,7 +28,7 @@ export class DocumentManager {
         DocListCast(view.rootDoc.links).forEach(link => {
             const whichOtherAnchor = view.props.LayoutTemplateString?.includes("anchor2") ? "anchor1" : "anchor2";
             const otherDoc = link && (link[whichOtherAnchor] as Doc);
-            const otherDocAnno = otherDoc?.type === DocumentType.TEXTANCHOR ? otherDoc.annotationOn as Doc : undefined;
+            const otherDocAnno = DocumentType.MARKER === otherDoc?.type ? otherDoc.annotationOn as Doc : undefined;
             otherDoc && DocumentManager.Instance.DocumentViews?.filter(dv => Doc.AreProtosEqual(dv.rootDoc, otherDoc) || Doc.AreProtosEqual(dv.rootDoc, otherDocAnno)).
                 forEach(otherView => {
                     if (otherView.rootDoc.type !== DocumentType.LINK || otherView.props.LayoutTemplateString !== view.props.LayoutTemplateString) {
@@ -162,7 +162,7 @@ export class DocumentManager {
         const contextDoc = contextDocs?.find(doc => Doc.AreProtosEqual(doc, targetDoc) || Doc.AreProtosEqual(doc, annotatedDoc)) ? docContext : undefined;
         const targetDocContext = contextDoc || annotatedDoc;
         const targetDocContextView = targetDocContext && getFirstDocView(targetDocContext);
-        const focusView = !docView && targetDoc.type === DocumentType.TEXTANCHOR && annoContainerView ? annoContainerView : docView;
+        const focusView = !docView && targetDoc.type === DocumentType.MARKER && annoContainerView ? annoContainerView : docView;
         if (!docView && annoContainerView && !focusView) {
             annoContainerView.focus(targetDoc);  // this allows something like a PDF view to remove its doc filters to expose the target so that it can be found in the retry code below
         }
diff --git a/src/client/util/SelectionManager.ts b/src/client/util/SelectionManager.ts
index 7aeb19391..dbcc49f3d 100644
--- a/src/client/util/SelectionManager.ts
+++ b/src/client/util/SelectionManager.ts
@@ -23,7 +23,7 @@ export namespace SelectionManager {
         @action
         SelectView(docView: DocumentView, ctrlPressed: boolean): void {
             // if doc is not in SelectedDocuments, add it
-            if (!manager.SelectedViews.get(docView) && docView.props.Document.type !== DocumentType.HTMLANCHOR) {
+            if (!manager.SelectedViews.get(docView) && docView.props.Document.type !== DocumentType.MARKER) {
                 if (!ctrlPressed) {
                     this.DeselectAll();
                 }
diff --git a/src/client/views/StyleProvider.tsx b/src/client/views/StyleProvider.tsx
index dc6ac0366..c9e532745 100644
--- a/src/client/views/StyleProvider.tsx
+++ b/src/client/views/StyleProvider.tsx
@@ -174,7 +174,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
             }
         }
         case StyleProp.PointerEvents:
-            if (doc?.type === DocumentType.HTMLANCHOR) return "none";
+            if (doc?.type === DocumentType.MARKER) return "none";
             if (props?.pointerEvents === "none") return "none";
             const layer = doc && props?.layerProvider?.(doc);
             if (opacity() === 0 || (doc?.type === DocumentType.INK && !docProps?.treeViewDoc) || doc?.isInkMask) return "none";
diff --git a/src/client/views/collections/CollectionTimeView.tsx b/src/client/views/collections/CollectionTimeView.tsx
index f41043179..339163510 100644
--- a/src/client/views/collections/CollectionTimeView.tsx
+++ b/src/client/views/collections/CollectionTimeView.tsx
@@ -37,7 +37,7 @@ export class CollectionTimeView extends CollectionSubView(doc => doc) {
     @observable _focusRangeFilters: Opt<string[]>;
 
     getAnchor = () => {
-        const anchor = Docs.Create.TextanchorDocument({
+        const anchor = Docs.Create.HTMLAnchorDocument({
             title: ComputedField.MakeFunction(`"${this.pivotField}"])`) as any,
             annotationOn: this.rootDoc
         });
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index 35da09af6..8ef0057bd 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -1487,7 +1487,7 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
             onDragOver={e => e.preventDefault()}
             onContextMenu={this.onContextMenu}
             style={{
-                pointerEvents: this.props.Document.type === DocumentType.HTMLANCHOR ? "none" :  // bcz: ugh.. this is here to prevent htmlanchor's, which render as freeform views, from grabbing events -- need a better approach.
+                pointerEvents: this.props.Document.type === DocumentType.MARKER ? "none" :  // bcz: ugh.. this is here to prevent markers, which render as freeform views, from grabbing events -- need a better approach.
                     this.backgroundEvents ? "all" : this.props.pointerEvents as any,
                 transform: `scale(${this.contentScaling || 1})`,
                 width: `${100 / (this.contentScaling || 1)}%`,
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index abc3a7d7d..f5b1f96f2 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -163,7 +163,7 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
         if (this._sidebarRef?.current?.makeDocUnfiltered(doc)) return 1;
         if (doc !== this.rootDoc && this._outerRef.current) {
             const windowHeight = this.props.PanelHeight() / (this.props.scaling?.() || 1);
-            const scrollTo = doc.type === DocumentType.TEXTANCHOR ? NumCast(doc.y) : Utils.scrollIntoView(NumCast(doc.y), doc[HeightSym](), NumCast(this.layoutDoc._scrollTop), windowHeight, windowHeight * .1);
+            const scrollTo = Utils.scrollIntoView(NumCast(doc.y), doc[HeightSym](), NumCast(this.layoutDoc._scrollTop), windowHeight, windowHeight * .1);
             if (scrollTo !== undefined) {
                 const focusSpeed = smooth ? 500 : 0;
                 this._initialScroll !== undefined && (this._initialScroll = scrollTo);
diff --git a/src/fields/Doc.ts b/src/fields/Doc.ts
index 7993af149..111fd3f0d 100644
--- a/src/fields/Doc.ts
+++ b/src/fields/Doc.ts
@@ -521,7 +521,7 @@ export namespace Doc {
         if (cloneMap.get(doc[Id])) return cloneMap.get(doc[Id])!;
         const copy = dontCreate ? asBranch ? (Cast(doc.branchMaster, Doc, null) || doc) : doc : new Doc(undefined, true);
         cloneMap.set(doc[Id], copy);
-        const fieldExclusions = (doc.type === DocumentType.TEXTANCHOR) ? exclusions.filter(ex => ex !== "annotationOn") : exclusions;
+        const fieldExclusions = doc.type === DocumentType.MARKER ? exclusions.filter(ex => ex !== "annotationOn") : exclusions;
         const filter = [...fieldExclusions, ...Cast(doc.cloneFieldFilter, listSpec("string"), [])];
         await Promise.all(Object.keys(doc).map(async key => {
             if (filter.includes(key)) return;
-- 
cgit v1.2.3-70-g09d2


From c9f379adab864132e6cf044f808a43254601e4bb Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Fri, 30 Jul 2021 13:26:25 -0400
Subject: major UI / updates + refactoring

---
 deploy/assets/favicon.png                          |  Bin 0 -> 22180 bytes
 deploy/index.html                                  |  114 +-
 deploy/loader.css                                  |   85 +
 deploy/loader.js                                   |   14 +
 src/client/documents/Documents.ts                  |    4 +-
 src/client/util/CurrentUserUtils.ts                |   44 +-
 src/client/views/AntimodeMenu.scss                 |    1 +
 src/client/views/DocumentButtonBar.tsx             |    2 +-
 src/client/views/MainView.scss                     |   30 +-
 src/client/views/MainView.tsx                      |   29 +-
 src/client/views/PropertiesView.tsx                |    2 +-
 src/client/views/_nodeModuleOverrides.scss         |    4 +-
 src/client/views/collections/CollectionMenu.scss   |    4 +-
 src/client/views/collections/CollectionMenu.tsx    |    2 +-
 src/client/views/collections/TabDocView.tsx        |    2 +-
 .../collectionFreeForm/CollectionFreeFormView.tsx  |   10 +-
 .../collections/collectionFreeForm/MarqueeView.tsx |    3 +-
 src/client/views/global/globalCssVariables.scss    |    3 +
 src/client/views/nodes/DocumentContentsView.tsx    |    4 +-
 src/client/views/nodes/DocumentView.tsx            |    2 +-
 src/client/views/nodes/FontIconBox.tsx             |    3 +-
 src/client/views/nodes/PresBox.scss                | 1243 ----------
 src/client/views/nodes/PresBox.tsx                 | 2472 --------------------
 .../views/nodes/formattedText/RichTextMenu.tsx     |   10 +-
 src/client/views/nodes/trails/PresBox.scss         | 1243 ++++++++++
 src/client/views/nodes/trails/PresBox.tsx          | 2440 +++++++++++++++++++
 src/client/views/nodes/trails/PresElementBox.scss  |  235 ++
 src/client/views/nodes/trails/PresElementBox.tsx   |  388 +++
 src/client/views/nodes/trails/PresEnums.ts         |   28 +
 src/client/views/nodes/trails/index.ts             |    3 +
 .../views/presentationview/PresElementBox.scss     |  235 --
 .../views/presentationview/PresElementBox.tsx      |  386 ---
 src/client/views/topbar/TopBar.scss                |   12 +-
 src/client/views/topbar/TopBar.tsx                 |   89 +-
 tslint.json                                        |   41 +-
 35 files changed, 4587 insertions(+), 4600 deletions(-)
 create mode 100644 deploy/assets/favicon.png
 create mode 100644 deploy/loader.css
 create mode 100644 deploy/loader.js
 delete mode 100644 src/client/views/nodes/PresBox.scss
 delete mode 100644 src/client/views/nodes/PresBox.tsx
 create mode 100644 src/client/views/nodes/trails/PresBox.scss
 create mode 100644 src/client/views/nodes/trails/PresBox.tsx
 create mode 100644 src/client/views/nodes/trails/PresElementBox.scss
 create mode 100644 src/client/views/nodes/trails/PresElementBox.tsx
 create mode 100644 src/client/views/nodes/trails/PresEnums.ts
 create mode 100644 src/client/views/nodes/trails/index.ts
 delete mode 100644 src/client/views/presentationview/PresElementBox.scss
 delete mode 100644 src/client/views/presentationview/PresElementBox.tsx

(limited to 'src')

diff --git a/deploy/assets/favicon.png b/deploy/assets/favicon.png
new file mode 100644
index 000000000..59595b910
Binary files /dev/null and b/deploy/assets/favicon.png differ
diff --git a/deploy/index.html b/deploy/index.html
index dda0c6457..d96215391 100644
--- a/deploy/index.html
+++ b/deploy/index.html
@@ -1,114 +1,22 @@
 <html style="overflow: hidden;">
 
 <head>
-    <title>Dash Web</title>
-    <link href="https://fonts.googleapis.com/css?family=Fjalla+One|Hind+Siliguri:300" rel="stylesheet">
-    <link href='https://fonts.googleapis.com/css?family=Roboto:300,400,500' rel='stylesheet'>
+    <title>Dash</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link
+        href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&family=Lato:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&family=Merriweather:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&family=Roboto:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&display=swap"
+        rel="stylesheet">
+    <link rel="shortcut icon" type="image/jpg" href="./assets/favicon.png" />
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
         integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
     <script src="https://cdnjs.cloudflare.com/ajax/libs/typescript/3.3.1/typescript.min.js"></script>
-
-    <script>
-        function getCookie(cname) {
-            var name = cname + "=";
-            var ca = document.cookie.split(';');
-            for (var i = 0; i < ca.length; i++) {
-                var c = ca[i];
-                while (c.charAt(0) == ' ') {
-                    c = c.substring(1);
-                }
-                if (c.indexOf(name) == 0) {
-                    return Number(c.substring(name.length, c.length));
-                }
-            }
-            return 3000;
-        } 
-    </script>
-    <style>
-        .dash-loader {
-            display: flex;
-            align-content: center;
-            justify-content: center;
-            background-color: #AEDDF8;
-            transition: 3s;
-            z-index: 10;
-            width: 100vw;
-            height: 100vh;
-        }
-
-        .dash-loader-container {
-            display: grid;
-            grid-auto-rows: auto 30px auto;
-        }
-
-        .dash-progress-bar {
-            width: 200px;
-            height: 5px;
-            align-self: center;
-            margin-top: 20px;
-            background-color: #ececec;
-            border-radius: 5px;
-            overflow: hidden;
-        }
-
-        .dash-progress {
-            width: 0%;
-            height: 20px;
-            background-color: #5b9fdd;
-            transition: 0.1s;
-        }
-
-        .dash-animation-container {
-            width: 10vw;
-            height: 10vw;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            border-radius: 100%;
-            background-color: #5B9FDD;
-            justify-self: center;
-            align-self: flex-end;
-        }
-
-        .dash-loader-text {
-            font-size: 15px;
-            font-family: "Roboto";
-            text-align: center;
-            color: #5B9FDD;
-        }
-
-        .dash-d-path {
-            stroke-dasharray: 1000;
-            stroke-dashoffset: 1000;
-            animation: dash-d-path 3s linear infinite;
-        }
-
-        @keyframes dash-d-path {
-            0% {
-                stroke-dashoffset: 1000;
-            }
-
-            20% {
-                stroke-dashoffset: 0;
-            }
-
-            70% {
-                stroke-dashoffset: 0;
-            }
-
-            90% {
-                stroke-dashoffset: 1000;
-            }
-
-            100% {
-                stroke-dashoffset: 1000;
-            }
-        }
-    </style>
+    <script src="loader.js"></script>
+    <link rel="stylesheet" href="./loader.css" />
 </head>
 
 <body style="display:flex" id="dash-body">
-    <div class="dash-loader" id="loader" style="z-index:10; width:100%; height:100%;">
+    <div class="dash-loader" id="loader">
         <div class="dash-loader-container">
             <div class="dash-animation-container">
                 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100px"
@@ -127,7 +35,7 @@
                     console.log("Last Load = " + load);
                     let dashmesg = (width, msg) => {
                         if (document.getElementById("dash-progress")) document.getElementById("dash-progress").style.width = width
-                        if (document.getElementById("dash-progress")) document.getElementById("dash-progress").innerHTML = msg
+                        if (document.getElementById("dash-progress")) document.getElementById("dash-loader-text").innerHTML = msg
                     }
                     setTimeout(() => dashmesg("10%", "Loading Dash..."), load / 10);
                     setTimeout(() => dashmesg("33%", "Preparing dashboards..."), load / 3);
diff --git a/deploy/loader.css b/deploy/loader.css
new file mode 100644
index 000000000..4be0cc98c
--- /dev/null
+++ b/deploy/loader.css
@@ -0,0 +1,85 @@
+.dash-loader {
+    display: flex;
+    align-content: center;
+    justify-content: center;
+    background-color: #BDDDF5;
+    transition: 3s;
+    z-index: 10;
+    z-index:10; 
+    width:100%;
+    height:100%;
+}
+
+.dash-loader-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    align-content: center;
+}
+
+.dash-progress-bar {
+    width: 200px;
+    height: 5px;
+    align-self: center;
+    margin-top: 20px;
+    background-color: #ececec;
+    border-radius: 5px;
+    overflow: hidden;
+}
+
+.dash-progress {
+    width: 0%;
+    height: 20px;
+    background-color: #4476F7;
+    transition: 0.1s;
+}
+
+.dash-animation-container {
+    width: 10vw;
+    height: 10vw;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 100%;
+    background-color: #4476F7;
+    justify-self: center;
+}
+
+.dash-loader-text {
+    font-size: 15px;
+    font-family: "Roboto";
+    font-weight: bold;
+    text-align: center;
+    color: #4476F7;
+    user-select: none;
+    -webkit-user-select: none;
+}
+
+.dash-d-path {
+    stroke-dasharray: 1000;
+    stroke-dashoffset: 1000;
+    animation: dash-d-path 3s linear infinite;
+}
+
+@keyframes dash-d-path {
+    0% {
+        stroke-dashoffset: 1000;
+    }
+
+    20% {
+        stroke-dashoffset: 0;
+    }
+
+    70% {
+        stroke-dashoffset: 0;
+    }
+
+    90% {
+        stroke-dashoffset: 1000;
+    }
+
+    100% {
+        stroke-dashoffset: 1000;
+    }
+}
\ No newline at end of file
diff --git a/deploy/loader.js b/deploy/loader.js
new file mode 100644
index 000000000..0be421e14
--- /dev/null
+++ b/deploy/loader.js
@@ -0,0 +1,14 @@
+function getCookie(cname) {
+    var name = cname + "=";
+    var ca = document.cookie.split(';');
+    for (var i = 0; i < ca.length; i++) {
+        var c = ca[i];
+        while (c.charAt(0) == ' ') {
+            c = c.substring(1);
+        }
+        if (c.indexOf(name) == 0) {
+            return Number(c.substring(name.length, c.length));
+        }
+    }
+    return 3000;
+} 
\ No newline at end of file
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index f1db3e32c..81465a241 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -45,14 +45,14 @@ import { LabelBox } from "../views/nodes/LabelBox";
 import { LinkBox } from "../views/nodes/LinkBox";
 import { LinkDescriptionPopup } from "../views/nodes/LinkDescriptionPopup";
 import { PDFBox } from "../views/nodes/PDFBox";
-import { PresBox } from "../views/nodes/PresBox";
+import { PresBox } from "../views/nodes/trails/PresBox";
 import { ScreenshotBox } from "../views/nodes/ScreenshotBox";
 import { ScriptingBox } from "../views/nodes/ScriptingBox";
 import { SliderBox } from "../views/nodes/SliderBox";
 import { TaskCompletionBox } from "../views/nodes/TaskCompletedBox";
 import { VideoBox } from "../views/nodes/VideoBox";
 import { WebBox } from "../views/nodes/WebBox";
-import { PresElementBox } from "../views/presentationview/PresElementBox";
+import { PresElementBox } from "../views/nodes/trails/PresElementBox";
 import { SearchBox } from "../views/search/SearchBox";
 import { DashWebRTCVideo } from "../views/webcam/DashWebRTCVideo";
 import { DocumentType } from "./DocumentTypes";
diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 22504f102..62fab1b23 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -35,6 +35,8 @@ import { UndoManager } from "./UndoManager";
 import { SnappingManager } from "./SnappingManager";
 import { InkTool } from "../../fields/InkField";
 import { computedFn } from "mobx-utils";
+import { ColorScheme } from "./SettingsManager";
+import { Colors } from "../views/global/globalEnums";
 
 
 export let resolvedPorts: { server: number, socket: number };
@@ -472,7 +474,7 @@ export class CurrentUserUtils {
             { toolTip: "Tap to create a videoWall", title: "Wall", icon: "photo-video", click: 'openOnRight(copyDragFactory(this.dragFactory))', drag: 'copyDragFactory(this.dragFactory)', dragFactory: doc.emptyWall as Doc },
             { toolTip: "Tap to create an audio recorder in a new pane, drag for an audio recorder", title: "Audio", icon: "microphone", click: 'openOnRight(copyDragFactory(this.dragFactory))', drag: 'copyDragFactory(this.dragFactory)', dragFactory: doc.emptyAudio as Doc, noviceMode: true },
             { toolTip: "Tap to create a button in a new pane, drag for a button", title: "Button", icon: "bolt", click: 'openOnRight(copyDragFactory(this.dragFactory))', drag: 'copyDragFactory(this.dragFactory)', dragFactory: doc.emptyButton as Doc },
-            { toolTip: "Tap to create a presentation in a new pane, drag for a presentation", title: "Trails", icon: "pres-trail", click: 'openOnRight(Doc.UserDoc().activePresentation = copyDragFactory(this.dragFactory))', drag: `Doc.UserDoc().activePresentation = copyDragFactory(this.dragFactory)`, dragFactory: doc.emptyPresentation as Doc, noviceMode: true },
+            // { toolTip: "Tap to create a presentation in a new pane, drag for a presentation", title: "Trails", icon: "pres-trail", click: 'openOnRight(Doc.UserDoc().activePresentation = copyDragFactory(this.dragFactory))', drag: `Doc.UserDoc().activePresentation = copyDragFactory(this.dragFactory)`, dragFactory: doc.emptyPresentation as Doc, noviceMode: true },
             { toolTip: "Tap to create a scripting box in a new pane, drag for a scripting box", title: "Script", icon: "terminal", click: 'openOnRight(copyDragFactory(this.dragFactory))', drag: 'copyDragFactory(this.dragFactory)', dragFactory: doc.emptyScript as Doc },
             { toolTip: "Tap to create a mobile view in a new pane, drag for a mobile view", title: "Phone", icon: "mobile", click: 'openOnRight(Doc.UserDoc().activeMobileMenu)', drag: 'this.dragFactory', dragFactory: doc.activeMobileMenu as Doc },
             { toolTip: "Tap to create a custom header note document, drag for a custom header note", title: "Custom", icon: "window-maximize", click: 'openOnRight(delegateDragFactory(this.dragFactory))', drag: 'delegateDragFactory(this.dragFactory)', dragFactory: doc.emptyHeader as Doc },
@@ -534,8 +536,8 @@ export class CurrentUserUtils {
             { title: "Sharing", target: Cast(doc.mySharedDocs, Doc, null), icon: "users", click: 'selectMainMenu(self)', watchedDocuments: doc.mySharedDocs as Doc },
             // { title: "Filter", target: Cast(doc.currentFilter, Doc, null), icon: "filter", click: 'selectMainMenu(self)' },
             { title: "Pres. Trails", target: Cast(doc.myPresentations, Doc, null), icon: "pres-trail", click: 'selectMainMenu(self)' },
-            { title: "Help", target: undefined as any, icon: "question-circle", click: 'selectMainMenu(self)' },
-            { title: "Settings", target: undefined as any, icon: "cog", click: 'selectMainMenu(self)' },
+            // { title: "Help", target: undefined as any, icon: "question-circle", click: 'selectMainMenu(self)' },
+            // { title: "Settings", target: undefined as any, icon: "cog", click: 'selectMainMenu(self)' },
             { title: "User Doc", target: Cast(doc.myUserDoc, Doc, null), icon: "address-card", click: 'selectMainMenu(self)' },
         ];
     }
@@ -561,7 +563,6 @@ export class CurrentUserUtils {
                     dontUndo: true,
                     title,
                     target,
-                    backgroundColor: "black",
                     _dropAction: "alias",
                     _removeDropProperties: new List<string>(["dropAction", "_stayInCollection"]),
                     _width: 60,
@@ -576,8 +577,10 @@ export class CurrentUserUtils {
                 title: "menuItemPanel",
                 childDropAction: "alias",
                 _chromeHidden: true,
+                backgroundColor: Colors.DARK_GRAY,
+                boxShadow: "rgba(0,0,0,0)",
                 dropConverter: ScriptField.MakeScript("convertToButtons(dragData)", { dragData: DragManager.DocumentDragData.name }),
-                backgroundColor: "black", ignoreClick: true,
+                ignoreClick: true,
                 _gridGap: 0,
                 _yMargin: 0,
                 _yPadding: 0, _xMargin: 0, _autoHeight: false, _width: 60, _columnWidth: 60, _lockedPosition: true, system: true
@@ -587,8 +590,6 @@ export class CurrentUserUtils {
         PromiseValue(Cast(doc.menuStack, Doc)).then(stack => {
             stack && PromiseValue(stack.data).then(btns => {
                 DocListCastAsync(btns).then(bts => bts?.forEach(btn => {
-                    btn.color = "white";
-                    btn._backgroundColor = "";
                     btn.dontUndo = true;
                     btn.system = true;
                     if (btn.title === "Catalog" || btn.title === "My Files") { // migration from Catalog to My Files
@@ -759,7 +760,7 @@ export class CurrentUserUtils {
         await doc.myDashboards;
         if (doc.myDashboards === undefined) {
             doc.myDashboards = new PrefetchProxy(Docs.Create.TreeDocument([], {
-                title: "My Dashboards", _height: 400, childHideLinkButton: true,
+                title: "My Dashboards", _showTitle: "title", _height: 400, childHideLinkButton: true,
                 treeViewHideTitle: true, _xMargin: 5, _yMargin: 5, _gridGap: 5, _forceActive: true, childDropAction: "alias",
                 treeViewTruncateTitleWidth: 150, ignoreClick: true,
                 _lockedPosition: true, boxShadow: "0 0", childDontRegisterViews: true, targetDropAction: "same", system: true
@@ -775,7 +776,7 @@ export class CurrentUserUtils {
         await doc.myPresentations;
         if (doc.myPresentations === undefined) {
             doc.myPresentations = new PrefetchProxy(Docs.Create.TreeDocument([], {
-                title: "My Presentations", _height: 100,
+                title: "My Trails", _showTitle: "title", _height: 100,
                 treeViewHideTitle: true, _xMargin: 5, _yMargin: 5, _gridGap: 5, _forceActive: true, childDropAction: "alias",
                 treeViewTruncateTitleWidth: 150, ignoreClick: true,
                 _lockedPosition: true, boxShadow: "0 0", childDontRegisterViews: true, targetDropAction: "same", system: true
@@ -794,7 +795,7 @@ export class CurrentUserUtils {
             doc.myFileOrphans = Docs.Create.TreeDocument([], { title: "Unfiled", _stayInCollection: true, system: true, isFolder: true });
             doc.myFileRoot = Docs.Create.TreeDocument([], { title: "file root", _stayInCollection: true, system: true, isFolder: true });
             doc.myFilesystem = new PrefetchProxy(Docs.Create.TreeDocument([doc.myFileRoot as Doc, doc.myFileOrphans as Doc], {
-                title: "My Documents", _height: 100,
+                title: "My Documents", _showTitle: "title", _height: 100,
                 treeViewHideTitle: true, _xMargin: 5, _yMargin: 5, _gridGap: 5, _forceActive: true, childDropAction: "alias",
                 treeViewTruncateTitleWidth: 150, ignoreClick: true,
                 isFolder: true, treeViewType: "fileSystem", childHideLinkButton: true,
@@ -808,7 +809,7 @@ export class CurrentUserUtils {
         // setup Recently Closed library item
         if (doc.myRecentlyClosedDocs === undefined) {
             doc.myRecentlyClosedDocs = new PrefetchProxy(Docs.Create.TreeDocument([], {
-                title: "Recently Closed", treeViewShowClearButton: true, childHideLinkButton: true,
+                title: "Recently Closed", _showTitle: "title", treeViewShowClearButton: true, childHideLinkButton: true,
                 treeViewHideTitle: true, _xMargin: 5, _yMargin: 5, _gridGap: 5, _forceActive: true, childDropAction: "alias",
                 treeViewTruncateTitleWidth: 150, ignoreClick: true,
                 _lockedPosition: true, boxShadow: "0 0", childDontRegisterViews: true, targetDropAction: "same", system: true
@@ -839,7 +840,7 @@ export class CurrentUserUtils {
             doc.treeViewOpen = true;
             doc.treeViewExpandedView = "fields";
             doc.myUserDoc = new PrefetchProxy(Docs.Create.TreeDocument([doc], {
-                treeViewHideTitle: true, _xMargin: 5, _yMargin: 5, _gridGap: 5, _forceActive: true, title: "My UserDoc",
+                treeViewHideTitle: true, _xMargin: 5, _yMargin: 5, _gridGap: 5, _forceActive: true, title: "My UserDoc", _showTitle: "title",
                 treeViewTruncateTitleWidth: 150, ignoreClick: true,
                 _lockedPosition: true, boxShadow: "0 0", childDontRegisterViews: true, targetDropAction: "same", system: true
             })) as any as Doc;
@@ -859,6 +860,7 @@ export class CurrentUserUtils {
     static async setupSidebarButtons(doc: Doc) {
         CurrentUserUtils.setupSidebarContainer(doc);
         await CurrentUserUtils.setupToolsBtnPanel(doc);
+        CurrentUserUtils.setupImportSidebar(doc);
         CurrentUserUtils.setupDashboards(doc);
         CurrentUserUtils.setupPresentations(doc);
         CurrentUserUtils.setupFilesystem(doc);
@@ -891,6 +893,7 @@ export class CurrentUserUtils {
         (doc["dockedBtn-undo"] as Doc).dontUndo = true;
         (doc["dockedBtn-redo"] as Doc).dontUndo = true;
     }
+
     // sets up the default set of documents to be shown in the Overlay layer
     static setupOverlays(doc: Doc) {
         if (doc.myOverlayDocs === undefined) {
@@ -924,7 +927,8 @@ export class CurrentUserUtils {
             if (!sharedDocs) {
                 sharedDocs = Docs.Create.StackingDocument([], {
                     title: "My SharedDocs", childDropAction: "alias", system: true, contentPointerEvents: "none", childLimitHeight: 0, _yMargin: 50, _gridGap: 15,
-                    _showTitle: "title", ignoreClick: true, _lockedPosition: true, "acl-Public": SharingPermissions.Add, "_acl-Public": SharingPermissions.Add, _chromeHidden: true,
+                    _showTitle: "title", ignoreClick: true, _lockedPosition: true, "acl-Public": SharingPermissions.Add, "_acl-Public": SharingPermissions.Add,
+                    _chromeHidden: true, boxShadow: "0 0",
                 }, sharingDocumentId + "outer", sharingDocumentId);
                 (sharedDocs as Doc)["acl-Public"] = (sharedDocs as Doc)[DataSym]["acl-Public"] = SharingPermissions.Add;
             }
@@ -939,14 +943,14 @@ export class CurrentUserUtils {
     static setupImportSidebar(doc: Doc) {
         if (doc.myImportDocs === undefined) {
             doc.myImportDocs = new PrefetchProxy(Docs.Create.StackingDocument([], {
-                title: "My ImportDocuments", _forceActive: true, ignoreClick: true, _showTitle: "title", _stayInCollection: true, _hideContextMenu: true, childLimitHeight: 0,
+                title: "My ImportDocuments", _forceActive: true, ignoreClick: true, _stayInCollection: true, _hideContextMenu: true, childLimitHeight: 0,
                 childDropAction: "alias", _autoHeight: true, _yMargin: 50, _gridGap: 15, _lockedPosition: true, system: true, _chromeHidden: true,
             }));
         }
         if (doc.myImportPanel === undefined) {
             const uploads = Cast(doc.myImportDocs, Doc, null);
             const newUpload = CurrentUserUtils.ficon({ onClick: ScriptField.MakeScript("importDocument()"), toolTip: "Import External document", _stayInCollection: true, _hideContextMenu: true, title: "Import", icon: "upload", system: true });
-            doc.myImportPanel = new PrefetchProxy(Docs.Create.StackingDocument([newUpload, uploads], { title: "My ImportPanel", _yMargin: 20, ignoreClick: true, _chromeHidden: true, _stayInCollection: true, _hideContextMenu: true, _lockedPosition: true, system: true }));
+            doc.myImportPanel = new PrefetchProxy(Docs.Create.StackingDocument([newUpload, uploads], { title: "My ImportPanel", _yMargin: 20, _showTitle: "title", ignoreClick: true, _chromeHidden: true, _stayInCollection: true, _hideContextMenu: true, _lockedPosition: true, system: true, boxShadow: "0 0" }));
         }
     }
 
@@ -1007,10 +1011,14 @@ export class CurrentUserUtils {
                 const mygroups = groups?.filter(group => JSON.parse(StrCast(group.members)).includes(Doc.CurrentUserEmail)) || [];
                 SnappingManager.SetCachedGroups(["Public", ...mygroups?.map(g => StrCast(g.title))]);
             }, { fireImmediately: true });
+        // Document properties on load
         doc.system = true;
+        doc.darkScheme = ColorScheme.Dark;
         doc.noviceMode = doc.noviceMode === undefined ? "true" : doc.noviceMode;
         doc.title = Doc.CurrentUserEmail;
         doc._raiseWhenDragged = true;
+        doc._showLabel = false;
+        doc._showMenuLabel = true;
         doc.activeInkColor = StrCast(doc.activeInkColor, "rgb(0, 0, 0)");
         doc.activeInkWidth = StrCast(doc.activeInkWidth, "1");
         doc.activeInkBezier = StrCast(doc.activeInkBezier, "0");
@@ -1201,7 +1209,7 @@ export class CurrentUserUtils {
         const dashboardDoc = Docs.Create.StandardCollectionDockingDocument([{ doc: freeformDoc, initialWidth: 600 }], { title: `Dashboard ${dashboardCount}` }, id, "row");
         Doc.AddDocToList(myPresentations, "data", presentation);
         userDoc.activePresentation = presentation;
-        const toggleTheme = ScriptField.MakeScript(`self.darkScheme = !self.darkScheme`);
+        const toggleTheme = ScriptField.MakeScript(`Doc.UserDoc().darkScheme = !Doc.UserDoc().darkScheme`);
         const toggleComic = ScriptField.MakeScript(`toggleComicMode()`);
         const snapshotDashboard = ScriptField.MakeScript(`snapshotDashboard()`);
         const createDashboard = ScriptField.MakeScript(`createNewDashboard()`);
@@ -1257,6 +1265,4 @@ Scripting.addGlobal(function createNewPresentation() { return MainView.Instance.
 Scripting.addGlobal(function links(doc: any) { return new List(LinkManager.Instance.getAllRelatedLinks(doc)); },
     "returns all the links to the document or its annotations", "(doc: any)");
 Scripting.addGlobal(function importDocument() { return CurrentUserUtils.importDocument(); },
-    "imports files from device directly into the import sidebar");
-Scripting.addGlobal(function toggleComicMode() { Doc.UserDoc().renderStyle = Doc.UserDoc().renderStyle === "comic" ? undefined : "comic"; },
-    "toggle between regular rendeing and an informal sketch/comic style");
+    "imports files from device directly into the import sidebar");
\ No newline at end of file
diff --git a/src/client/views/AntimodeMenu.scss b/src/client/views/AntimodeMenu.scss
index b509f9f54..e23bf27c1 100644
--- a/src/client/views/AntimodeMenu.scss
+++ b/src/client/views/AntimodeMenu.scss
@@ -6,6 +6,7 @@
     z-index: 10001;
     height: $antimodemenu-height;
     background: $dark-gray;
+    border-bottom: $standard-border;
     // box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.25);
     // border-radius: 0px 6px 6px 6px;
     z-index: 1001;
diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx
index a5d80cd22..b11aa99b0 100644
--- a/src/client/views/DocumentButtonBar.tsx
+++ b/src/client/views/DocumentButtonBar.tsx
@@ -24,7 +24,7 @@ import { DocumentView } from './nodes/DocumentView';
 import { GoogleRef } from "./nodes/formattedText/FormattedTextBox";
 import { TemplateMenu } from "./TemplateMenu";
 import React = require("react");
-import { PresBox } from './nodes/PresBox';
+import { PresBox } from './nodes/trails/PresBox';
 import { undoBatch } from '../util/UndoManager';
 import { CollectionViewType } from './collections/CollectionView';
 const higflyout = require("@hig/flyout");
diff --git a/src/client/views/MainView.scss b/src/client/views/MainView.scss
index 2069986ad..ba1c91720 100644
--- a/src/client/views/MainView.scss
+++ b/src/client/views/MainView.scss
@@ -22,10 +22,6 @@
     height: 100%;
 }
 
-.mainContent-div-flyout {
-    left: calc(-1 * var(--flyoutHandleWidth));
-}
-
 // add nodes menu. Note that the + button is actually an input label, not an actual button.
 .mainView-docButtons {
     position: absolute;
@@ -111,14 +107,21 @@
     user-select: none;
 }
 
+.properties-container {
+    height: 100%;
+    position: relative;
+    left: 100%;
+    top: calc(-100% - 36px);
+    z-index: 3000;
+}
+
 .mainView-propertiesDragger {
     //background-color: rgb(140, 139, 139);
-    background-color: $light-gray;
+    background-color: $medium-gray;
     height: 55px;
     width: 17px;
     position: absolute;
     top: 50%;
-    border: 1px black solid;
     border-radius: 0;
     border-top-left-radius: 10px;
     border-bottom-left-radius: 10px;
@@ -141,18 +144,6 @@
     }
 }
 
-.mainiView-propertiesView {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    position: absolute;
-    right: 0;
-    top: 0;
-    border-left: solid 1px;
-    z-index: 100000;
-    cursor: auto;
-}
-
 .mainView-innerContent, .mainView-innerContent-dark {
     display: contents;
     flex-direction: row;
@@ -171,7 +162,7 @@
     }
 
     .propertiesView {
-        right: 0;
+        left: 0;
         position: absolute;
         z-index: 2;
         background-color: $medium-gray;
@@ -220,6 +211,7 @@
 .mainView-menuPanel {
     min-width: var(--menuPanelWidth);
     background-color: $dark-gray;
+    border-right: $standard-border;
 
     .collectionStackingView {
         scrollbar-width: none;
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index 7d6bfbd40..49f4f7a6e 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -64,6 +64,7 @@ import { PropertiesView } from './PropertiesView';
 import { SearchBox } from './search/SearchBox';
 import { DefaultStyleProvider, DashboardStyleProvider, StyleProp } from './StyleProvider';
 import { TopBar } from './topbar/TopBar';
+import { Colors } from './global/globalEnums';
 const _global = (window /* browser */ || global /* node */) as any;
 
 @observer
@@ -179,12 +180,12 @@ export class MainView extends React.Component {
         const targets = document.elementsFromPoint(e.x, e.y);
         if (targets.length) {
             const targClass = targets[0].className.toString();
-            if (SearchBox.Instance._searchbarOpen || SearchBox.Instance.open) {
-                const check = targets.some((thing) =>
-                    (thing.className === "collectionSchemaView-searchContainer" || (thing as any)?.dataset.icon === "filter" ||
-                        thing.className === "collectionSchema-header-menuOptions"));
-                !check && SearchBox.Instance.resetSearch(true);
-            }
+            // if (SearchBox.Instance._searchbarOpen || SearchBox.Instance.open) {
+            //     const check = targets.some((thing) =>
+            //         (thing.className === "collectionSchemaView-searchContainer" || (thing as any)?.dataset.icon === "filter" ||
+            //             thing.className === "collectionSchema-header-menuOptions"));
+            //     !check && SearchBox.Instance.resetSearch(true);
+            // }
             !targClass.includes("contextMenu") && ContextMenu.Instance.closeMenu();
             !["timeline-menu-desc", "timeline-menu-item", "timeline-menu-input"].includes(targClass) && TimelineMenu.Instance.closeMenu();
         }
@@ -193,7 +194,7 @@ export class MainView extends React.Component {
     initEventListeners = () => {
         window.addEventListener("drop", e => e.preventDefault(), false);  // prevent default behavior of navigating to a new web page
         window.addEventListener("dragover", e => e.preventDefault(), false);
-        document.addEventListener("pointermove", action(e => SearchBox.Instance._undoBackground = UndoManager.batchCounter ? "#000000a8" : undefined));
+        // document.addEventListener("pointermove", action(e => SearchBox.Instance._undoBackground = UndoManager.batchCounter ? "#000000a8" : undefined));
         document.addEventListener("pointerdown", this.globalPointerDown);
         document.addEventListener("click", (e: MouseEvent) => {
             if (!e.cancelBubble) {
@@ -405,22 +406,26 @@ export class MainView extends React.Component {
     }
 
     @computed get mainInnerContent() {
+        const width = this.propertiesWidth() + this._flyoutWidth + this.menuPanelWidth();
+        const transform = this._flyoutWidth ? 'translate(-28px, 0px)' : undefined;
         return <>
             {this.menuPanel}
             <div key="inner" className={`mainView-innerContent${this.darkScheme ? "-dark" : ""}`}>
                 {this.flyout}
-                <div className="mainView-libraryHandle" style={{ display: !this._flyoutWidth ? "none" : undefined, left: this._flyoutWidth ? (this._flyoutWidth + this.menuPanelWidth() - 10) : -10 }} onPointerDown={this.onFlyoutPointerDown} >
+                <div className="mainView-libraryHandle" style={{ display: !this._flyoutWidth ? "none" : undefined }} onPointerDown={this.onFlyoutPointerDown} >
                     <FontAwesomeIcon icon="chevron-left" color={this.darkScheme ? "white" : "black"} style={{ opacity: "50%" }} size="sm" />
                 </div>
-                <div className="mainView-innerContainer" style={{ width: `calc(100% - ${this.propertiesWidth() + this._flyoutWidth + this.menuPanelWidth()}px)` }}>
+                <div className="mainView-innerContainer" style={{ width: `calc(100% - ${width}px)`, transform: transform }}>
                     <CollectionMenu />
 
                     {this.dockingContent}
 
-                    <div className="mainView-propertiesDragger" key="props" onPointerDown={this.onPropertiesPointerDown} style={{ right: this.propertiesWidth() - 1 }}>
-                        <FontAwesomeIcon icon={this.propertiesWidth() < 10 ? "chevron-left" : "chevron-right"} color={this.darkScheme ? "white" : "black"} size="sm" />
+                    <div className="mainView-propertiesDragger" key="props" onPointerDown={this.onPropertiesPointerDown} style={{ right: this._flyoutWidth ? 0 : this.propertiesWidth() - 1 }}>
+                        <FontAwesomeIcon icon={this.propertiesWidth() < 10 ? "chevron-left" : "chevron-right"} color={this.darkScheme ? Colors.WHITE : Colors.BLACK} size="sm" />
+                    </div>
+                    <div className="properties-container">
+                        {this.propertiesWidth() < 10 ? (null) : <PropertiesView styleProvider={DefaultStyleProvider} width={this.propertiesWidth()} height={this.getContentsHeight()} />}
                     </div>
-                    {this.propertiesWidth() < 10 ? (null) : <PropertiesView styleProvider={DefaultStyleProvider} width={this.propertiesWidth()} height={this.getContentsHeight()} />}
                 </div>
             </div>
         </>;
diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx
index 4df3e4f00..8136edf04 100644
--- a/src/client/views/PropertiesView.tsx
+++ b/src/client/views/PropertiesView.tsx
@@ -24,7 +24,7 @@ import { EditableView } from "./EditableView";
 import { InkStrokeProperties } from "./InkStrokeProperties";
 import { DocumentView, StyleProviderFunc } from "./nodes/DocumentView";
 import { KeyValueBox } from "./nodes/KeyValueBox";
-import { PresBox } from "./nodes/PresBox";
+import { PresBox } from "./nodes/trails/PresBox";
 import { PropertiesButtons } from "./PropertiesButtons";
 import { PropertiesDocContextSelector } from "./PropertiesDocContextSelector";
 import "./PropertiesView.scss";
diff --git a/src/client/views/_nodeModuleOverrides.scss b/src/client/views/_nodeModuleOverrides.scss
index cb59489c0..140be2140 100644
--- a/src/client/views/_nodeModuleOverrides.scss
+++ b/src/client/views/_nodeModuleOverrides.scss
@@ -58,12 +58,10 @@ div .lm_header {
 .lm_header .lm_controls {
     align-items: center;
     position: absolute;
-    background-color: #000000;
+    background-color: $dark-gray;
     border-radius: 5px;
     display: flex;
-    top: 2px;
     justify-content: space-evenly;
-    right: 2px;
     height: 18px;
     width: 65px;
 }
diff --git a/src/client/views/collections/CollectionMenu.scss b/src/client/views/collections/CollectionMenu.scss
index c0fc774d3..f04b19ef7 100644
--- a/src/client/views/collections/CollectionMenu.scss
+++ b/src/client/views/collections/CollectionMenu.scss
@@ -38,10 +38,10 @@
         border: unset;
 
         .collectionMenu-divider {
-            height: 85%;
+            height: 100%;
             margin-left: 3px;
             margin-right: 3px;
-            width: 1.5px;
+            width: 2px;
             background-color: $medium-gray;
         }
 
diff --git a/src/client/views/collections/CollectionMenu.tsx b/src/client/views/collections/CollectionMenu.tsx
index 6e6fabd0d..a9b978c4e 100644
--- a/src/client/views/collections/CollectionMenu.tsx
+++ b/src/client/views/collections/CollectionMenu.tsx
@@ -29,7 +29,7 @@ import { ActiveFillColor, ActiveInkColor, SetActiveArrowEnd, SetActiveArrowStart
 import { CollectionFreeFormDocumentView } from "../nodes/CollectionFreeFormDocumentView";
 import { DocumentView } from "../nodes/DocumentView";
 import { RichTextMenu } from "../nodes/formattedText/RichTextMenu";
-import { PresBox } from "../nodes/PresBox";
+import { PresBox } from "../nodes/trails/PresBox";
 import "./CollectionMenu.scss";
 import { CollectionViewType, COLLECTION_BORDER_WIDTH } from "./CollectionView";
 import { TabDocView } from "./TabDocView";
diff --git a/src/client/views/collections/TabDocView.tsx b/src/client/views/collections/TabDocView.tsx
index 0e67bebd8..d82810652 100644
--- a/src/client/views/collections/TabDocView.tsx
+++ b/src/client/views/collections/TabDocView.tsx
@@ -25,7 +25,7 @@ import { Transform } from '../../util/Transform';
 import { undoBatch, UndoManager } from "../../util/UndoManager";
 import { LightboxView } from '../LightboxView';
 import { DocFocusOptions, DocumentView, DocumentViewProps } from "../nodes/DocumentView";
-import { PresBox, PinProps, PresMovement } from '../nodes/PresBox';
+import { PinProps, PresBox, PresMovement } from '../nodes/trails';
 import { DefaultLayerProvider, DefaultStyleProvider, StyleLayers, StyleProp } from '../StyleProvider';
 import { CollectionDockingView } from './CollectionDockingView';
 import { CollectionDockingViewMenu } from './CollectionDockingViewMenu';
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index a4e310e6c..c5f6f7bf2 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -38,7 +38,7 @@ import { CollectionFreeFormDocumentView } from "../../nodes/CollectionFreeFormDo
 import { DocFocusOptions, DocumentView, DocumentViewProps, ViewAdjustment, ViewSpecPrefix } from "../../nodes/DocumentView";
 import { FormattedTextBox } from "../../nodes/formattedText/FormattedTextBox";
 import { pageSchema } from "../../nodes/ImageBox";
-import { PresBox } from "../../nodes/PresBox";
+import { PresBox } from "../../nodes/trails/PresBox";
 import { StyleLayers, StyleProp } from "../../StyleProvider";
 import { CollectionDockingView } from "../CollectionDockingView";
 import { CollectionSubView } from "../CollectionSubView";
@@ -834,10 +834,10 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
                 map(doc => ({ ...this.childDataProvider(doc, ""), ...this.childSizeProvider(doc, "") }));
             if (measuredDocs.length) {
                 const ranges = measuredDocs.reduce(({ xrange, yrange }, { x, y, width, height }) =>  // computes range of content
-                ({
-                    xrange: { min: Math.min(xrange.min, x), max: Math.max(xrange.max, x + width) },
-                    yrange: { min: Math.min(yrange.min, y), max: Math.max(yrange.max, y + height) }
-                })
+                    ({
+                        xrange: { min: Math.min(xrange.min, x), max: Math.max(xrange.max, x + width) },
+                        yrange: { min: Math.min(yrange.min, y), max: Math.max(yrange.max, y + height) }
+                    })
                     , {
                         xrange: { min: Number.MAX_VALUE, max: -Number.MAX_VALUE },
                         yrange: { min: Number.MAX_VALUE, max: -Number.MAX_VALUE }
diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
index b1f2750c3..4fae961b1 100644
--- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
+++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
@@ -19,7 +19,8 @@ import { Transform } from "../../../util/Transform";
 import { undoBatch, UndoManager } from "../../../util/UndoManager";
 import { ContextMenu } from "../../ContextMenu";
 import { FormattedTextBox } from "../../nodes/formattedText/FormattedTextBox";
-import { PresBox, PresMovement } from "../../nodes/PresBox";
+import { PresBox } from "../../nodes/trails/PresBox";
+import { PresMovement } from "../../nodes/trails/PresEnums";
 import { PreviewCursor } from "../../PreviewCursor";
 import { CollectionDockingView } from "../CollectionDockingView";
 import { SubCollectionViewProps } from "../CollectionSubView";
diff --git a/src/client/views/global/globalCssVariables.scss b/src/client/views/global/globalCssVariables.scss
index a8d4235bd..72adc171b 100644
--- a/src/client/views/global/globalCssVariables.scss
+++ b/src/client/views/global/globalCssVariables.scss
@@ -38,6 +38,9 @@ $antimodemenu-height: 36px;
 $contextMenu-zindex: 100000; // context menu shows up over everything
 $radialMenu-zindex: 100000; // context menu shows up over everything
 
+// borders
+$standard-border: solid 1px #9F9F9F;
+
 $searchpanel-height: 32px;
 $mainTextInput-zindex: 999; // then text input overlay so that it's context menu will appear over decorations, etc
 $docDecorations-zindex: 998; // then doc decorations appear over everything else
diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx
index 9b75cd8f9..3d2cdf5a4 100644
--- a/src/client/views/nodes/DocumentContentsView.tsx
+++ b/src/client/views/nodes/DocumentContentsView.tsx
@@ -11,7 +11,7 @@ import { CollectionFreeFormView } from "../collections/collectionFreeForm/Collec
 import { CollectionSchemaView } from "../collections/collectionSchema/CollectionSchemaView";
 import { CollectionView } from "../collections/CollectionView";
 import { InkingStroke } from "../InkingStroke";
-import { PresElementBox } from "../presentationview/PresElementBox";
+import { PresElementBox } from "../nodes/trails/PresElementBox";
 import { SearchBox } from "../search/SearchBox";
 import { DashWebRTCVideo } from "../webcam/DashWebRTCVideo";
 import { YoutubeBox } from "./../../apis/youtube/YoutubeBox";
@@ -32,7 +32,7 @@ import { LabelBox } from "./LabelBox";
 import { LinkAnchorBox } from "./LinkAnchorBox";
 import { LinkBox } from "./LinkBox";
 import { PDFBox } from "./PDFBox";
-import { PresBox } from "./PresBox";
+import { PresBox } from "./trails/PresBox";
 import { ScreenshotBox } from "./ScreenshotBox";
 import { ScriptingBox } from "./ScriptingBox";
 import { SliderBox } from "./SliderBox";
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 60fa462ad..80a014926 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -43,7 +43,7 @@ import { DocumentLinksButton } from './DocumentLinksButton';
 import "./DocumentView.scss";
 import { LinkAnchorBox } from './LinkAnchorBox';
 import { LinkDocPreview } from "./LinkDocPreview";
-import { PresBox } from './PresBox';
+import { PresBox } from './trails/PresBox';
 import { RadialMenu } from './RadialMenu';
 import React = require("react");
 import { ScriptingBox } from "./ScriptingBox";
diff --git a/src/client/views/nodes/FontIconBox.tsx b/src/client/views/nodes/FontIconBox.tsx
index 6ae4b9726..0d415e238 100644
--- a/src/client/views/nodes/FontIconBox.tsx
+++ b/src/client/views/nodes/FontIconBox.tsx
@@ -14,6 +14,7 @@ import { DocComponent } from '../DocComponent';
 import { StyleProp } from '../StyleProvider';
 import { FieldView, FieldViewProps } from './FieldView';
 import './FontIconBox.scss';
+import { Colors } from '../global/globalEnums';
 const FontIconSchema = createSchema({
     icon: "string",
 });
@@ -47,7 +48,7 @@ export class FontIconBox extends DocComponent<FieldViewProps, FontIconDocument>(
         const icon = StrCast(this.dataDoc.icon, "user") as any;
         const presSize = shape === 'round' ? 25 : 30;
         const presTrailsIcon = <img src={`/assets/${"presTrails.png"}`}
-            style={{ width: presSize, height: presSize, filter: `invert(${color === "white" ? "100%" : "0%"})`, marginBottom: "5px" }} />;
+            style={{ width: presSize, height: presSize, filter: `invert(${color === Colors.DARK_GRAY ? "0%" : "100%"})`, marginBottom: "5px" }} />;
         const button = <button className={`menuButton-${shape}`} onContextMenu={this.specificContextMenu}
             style={{ backgroundColor: backgroundColor, }}>
             <div className="menuButton-wrap">
diff --git a/src/client/views/nodes/PresBox.scss b/src/client/views/nodes/PresBox.scss
deleted file mode 100644
index 5d1c5f4eb..000000000
--- a/src/client/views/nodes/PresBox.scss
+++ /dev/null
@@ -1,1243 +0,0 @@
-@import "../global/globalCssVariables";
-
-.presBox-cont {
-    cursor: auto;
-    position: absolute;
-    display: block;
-    pointer-events: inherit;
-    z-index: 2;
-    font-family: Roboto;
-    width: 100%;
-    min-width: 20px;
-    height: 100%;
-    min-height: 35px;
-    letter-spacing: 2px;
-    overflow: hidden;
-    transition: 0.7s opacity ease;
-
-    .presBox-listCont {
-        position: relative;
-        height: calc(100% - 67px);
-        width: 100%;
-    }
-
-    .presBox-toolbar-dropdown {
-        border-radius: 5px;
-        background-color: white;
-        transform: translate(8px, -5px);
-        box-shadow: 1px 1px 4px 4px rgba(0, 0, 0, 0.25);
-        z-index: 1000;
-        width: calc(100% - 50px);
-        height: max-content;
-        justify-self: center;
-        letter-spacing: normal;
-        height: max-content;
-        font-weight: 500;
-        position: relative;
-        font-size: 13;
-    }
-
-    .presBox-toolbar {
-        position: relative;
-        display: inline-flex;
-        align-items: center;
-        height: 30px;
-        width: 100%;
-        color: $white;
-        background-color: $dark-gray;
-
-        .toolbar-button {
-            cursor: pointer;
-            margin-left: 10px;
-            margin-right: 10px;
-            letter-spacing: 0;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            transition: 0.5s;
-        }
-
-        .toolbar-button.active {
-            color: $light-blue;
-            background-color: white;
-            border-radius: 100%;
-        }
-
-        .toolbar-transitionButtons {
-            display: block;
-
-            .toolbar-transition {
-                display: flex;
-                font-size: 10;
-                width: 100;
-                background-color: rgba(0, 0, 0, 0);
-                min-width: max-content;
-
-                .toolbar-icon {
-                    margin-right: 5px;
-                }
-            }
-        }
-    }
-
-    .toolbar-moreInfo {
-        position: absolute;
-        right: 5px;
-        display: flex;
-        width: max-content;
-        height: 25px;
-        justify-content: center;
-        transform: rotate(90deg);
-        align-items: center;
-        transition: 0.7s ease;
-
-        .toolbar-moreInfoBall {
-            width: 4px;
-            height: 4px;
-            border-radius: 100%;
-            background-color: white;
-            margin: 1px;
-            position: relative;
-        }
-    }
-
-    .toolbar-moreInfo.active {
-        transform: rotate(0deg);
-    }
-
-    .toolbar-divider {
-        border-left: solid $medium-gray 0.5px;
-        height: 20px;
-    }
-}
-
-.dropdown {
-    font-size: 10;
-    margin-left: 5px;
-    color: $medium-gray;
-    transition: 0.5s ease;
-}
-
-.dropdown.active {
-    transform: rotate(180deg);
-    color: $light-blue;
-    opacity: 0.8;
-}
-
-.presBox-radioButtons {
-    font-size: 10px;
-    font-weight: 200;
-    // background-color: rgba(0, 0, 0, 0.1);
-
-    .checkbox-container {
-        margin-left: 10px;
-        display: inline-flex;
-        width: 100%;
-        height: 20px;
-        align-items: center;
-    }
-
-    .checkbox-dropdown {
-        display: flex;
-        width: 100%;
-        align-items: flex-end;
-        gap: 5px;
-
-        .presBox-viewPicker {
-            width: calc(100% - 120px);
-            min-width: 30px;
-        }
-    }
-}
-
-.presBox-ribbon {
-    position: relative;
-    display: inline;
-    font-family: Roboto;
-    z-index: 100;
-    transition: 0.7s;
-
-    .ribbon-doubleButton {
-        display: inline-flex;
-    }
-
-    .presBox-reactiveGrid {
-        display: grid;
-        justify-content: flex-start;
-        align-items: center;
-        grid-template-columns: repeat(auto-fit, 70px);
-    }
-
-    .ribbon-colorBox {
-        cursor: pointer;
-        border: solid 1px $black;
-        display: flex;
-        margin-left: 5px;
-        margin-top: 5px;
-        margin-bottom: 5px;
-        justify-content: center;
-        align-items: center;
-        height: 15px;
-        width: 15px;
-        padding: 0px;
-        transform: translate(2px, 3px);
-    }
-
-    .ribbon-property {
-        font-size: 11;
-        font-weight: 200;
-        height: 20;
-        background-color: $white;
-        color: $black;
-        border: solid 1px $black;
-        display: flex;
-        margin-left: 5px;
-        margin-top: 5px;
-        margin-bottom: 5px;
-        width: max-content;
-        justify-content: center;
-        align-items: center;
-        padding-right: 10px;
-        padding-left: 10px;
-    }
-
-    .ribbon-propertyUpDown {
-        height: 20;
-        width: 20;
-        margin-top: 5px;
-        display: grid;
-        grid-template-rows: 10px 10px;
-
-        .ribbon-propertyUpDownItem {
-            cursor: pointer;
-            color: white;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            height: 100%;
-            width: 100%;
-            background: $black;
-        }
-
-        .ribbon-propertyUpDownItem:hover {
-            background: $medium-gray;
-            transform: scale(1.05);
-        }
-    }
-
-    .presBox-subheading {
-        font-size: 11;
-        font-weight: 400;
-        margin-top: 10px;
-    }
-
-    @media screen and (-webkit-min-device-pixel-ratio:0) {
-
-        .multiThumb-slider {
-            display: grid;
-            background-color: $white;
-            height: 10px;
-            border-radius: 10px;
-            overflow: hidden;
-
-            .toolbar-slider {
-                margin-top: 0px;
-                background: none;
-                -webkit-appearance: none;
-                pointer-events: none;
-            }
-
-            .toolbar-slider.start::-webkit-slider-thumb {
-                width: 10px;
-                pointer-events: auto;
-                -webkit-appearance: none;
-                height: 10px;
-                cursor: ew-resize;
-                background: $medium-blue;
-                box-shadow: -100vw 0 0 100vw $white;
-            }
-
-            .toolbar-slider.end::-webkit-slider-thumb {
-                width: 10px;
-                pointer-events: auto;
-                -webkit-appearance: none;
-                height: 10px;
-                cursor: ew-resize;
-                background: $medium-blue;
-                box-shadow: -100vw 0 0 100vw $light-blue;
-            }
-        }
-
-        .toolbar-slider {
-            margin-top: 5px;
-            position: relative;
-            align-self: center;
-            justify-self: left;
-            overflow: hidden;
-            width: 100%;
-            height: 10px;
-            border-radius: 10px;
-            -webkit-appearance: none;
-            background-color: $white;
-        }
-
-        .toolbar-slider:focus {
-            outline: none;
-        }
-
-        .toolbar-slider::-webkit-slider-runnable-track {
-            height: 10px;
-            -webkit-appearance: none;
-            margin-top: -1px;
-        }
-
-        .toolbar-slider::-webkit-slider-thumb {
-            width: 10px;
-            pointer-events: auto;
-            -webkit-appearance: none;
-            height: 10px;
-            cursor: ew-resize;
-            background: $medium-blue;
-            box-shadow: -100vw 0 0 100vw $light-blue;
-        }
-
-        .presBox-checkbox {
-            -webkit-appearance: none;
-            -webkit-user-select: none;
-            -moz-user-select: none;
-            -ms-user-select: none;
-            user-select: none;
-            margin: 0;
-            margin-right: 3px;
-            border-radius: 100%;
-            height: 15px;
-            width: 15px;
-            min-width: 15px;
-            cursor: pointer;
-            background: $white;
-        }
-
-        .presBox-checkbox:focus {
-            outline: none;
-        }
-
-        .presBox-checkbox:hover {
-            background: $light-gray;
-        }
-
-        .presBox-checkbox:checked {
-            background: $light-blue;
-        }
-    }
-
-
-
-    .slider-headers {
-        position: relative;
-        display: grid;
-        justify-content: space-between;
-        width: 100%;
-        height: max-content;
-        grid-template-columns: auto auto auto;
-        grid-template-rows: max-content;
-        font-weight: 100;
-        margin-top: 3px;
-        font-size: 10px;
-
-        .slider-block {
-            width: 63px;
-            border-radius: 5px;
-            text-align: center;
-            margin-bottom: 8px;
-            margin-top: 8px;
-        }
-
-        .slider-number {
-            border-radius: 3px;
-            width: 30px;
-            margin: auto;
-        }
-    }
-
-    .slider-value {
-        top: -20;
-        color: #2f86a2;
-        position: absolute;
-    }
-
-    .slider-value.none,
-    .slider-headers.none,
-    .toolbar-slider.none {
-        display: none;
-    }
-
-    .dropdown-header {
-        padding-bottom: 10px;
-        font-weight: 800;
-        text-align: center;
-        font-size: 16;
-        width: 90%;
-        color: $black;
-        transform: translate(5%, 0px);
-        border-bottom: solid 2px $medium-gray;
-    }
-
-
-    .ribbon-textInput {
-        border-radius: 2px;
-        height: 20px;
-        font-size: 11.5;
-        font-weight: 100;
-        align-self: center;
-        justify-self: left;
-        margin-top: 5px;
-        padding-left: 10px;
-        background-color: $white;
-        border: solid 1px $black;
-        min-width: 80px;
-        max-width: 200px;
-        width: 100%;
-    }
-
-    .presBox-input {
-        width: 30;
-        height: 100%;
-        background: none;
-        border: none;
-        text-align: right;
-    }
-
-    .presBox-input:focus {
-        outline: none;
-    }
-
-    .ribbon-frameSelector {
-        border: $black solid 1px;
-        width: 60px;
-        height: 20px;
-        margin-top: 5px;
-        display: grid;
-        grid-template-columns: auto 27px auto;
-        position: relative;
-        border-radius: 5px;
-        overflow: hidden;
-        align-items: center;
-        justify-self: left;
-
-        .fwdKeyframe,
-        .backKeyframe {
-            cursor: pointer;
-            position: relative;
-            height: 100%;
-            background: $white;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            text-align: center;
-            color: $black;
-        }
-
-        .numKeyframe {
-            cursor: pointer;
-            font-size: 10;
-            font-weight: 600;
-            position: relative;
-            color: $black;
-            display: flex;
-            width: 100%;
-            height: 100%;
-            text-align: center;
-            align-items: center;
-            justify-content: center;
-        }
-    }
-
-    .ribbon-final-box {
-        align-self: flex-start;
-        justify-self: center;
-        display: grid;
-        margin-top: 10px;
-        grid-template-rows: auto auto;
-        /* padding-left: 10px; */
-        /* padding-right: 10px; */
-        letter-spacing: normal;
-        min-width: max-content;
-        width: 100%;
-        font-size: 13;
-        font-weight: 500;
-        position: relative;
-
-
-        .ribbon-final-button {
-            cursor: pointer;
-            position: relative;
-            font-size: 11;
-            font-weight: normal;
-            letter-spacing: normal;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            margin-bottom: 5px;
-            height: 25px;
-            color: white;
-            width: 100%;
-            max-width: 120;
-            padding-left: 10;
-            padding-right: 10;
-            border-radius: 10px;
-            background-color: $medium-gray;
-        }
-
-        .ribbon-final-button:hover {
-            transform: scale(1.05);
-            transition: all 0.4s;
-        }
-
-        .ribbon-final-button-hidden {
-            cursor: pointer;
-            position: relative;
-            font-size: 11;
-            font-weight: normal;
-            letter-spacing: normal;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            margin-bottom: 5px;
-            height: 25px;
-            color: $light-gray;
-            width: 100%;
-            max-width: 120;
-            padding-left: 10;
-            padding-right: 10;
-            border-radius: 10px;
-            background-color: $black;
-        }
-
-        .ribbon-final-button-hidden:hover {
-            transform: scale(1.05);
-            transition: all 0.4s;
-        }
-
-        .ribbon-frameList {
-            width: calc(100% - 5px);
-            height: 50px;
-            background-color: $white;
-            border: 1px solid $medium-gray;
-            grid-template-rows: max-content;
-
-            .frameList-header {
-                display: grid;
-                width: 100%;
-                height: 20px;
-                background-color: $medium-gray;
-
-                .frameList-headerButtons {
-                    display: flex;
-                    grid-column: 7;
-                    width: 60px;
-                    justify-self: right;
-                    justify-content: flex-end;
-
-                    .headerButton {
-                        cursor: pointer;
-                        position: relative;
-                        border-radius: 100%;
-                        z-index: 300;
-                        width: 15px;
-                        height: 15px;
-                        display: flex;
-                        font-size: 10px;
-                        justify-self: center;
-                        align-self: center;
-                        background-color: rgba(0, 0, 0, 0.5);
-                        color: white;
-                        justify-content: center;
-                        align-items: center;
-                        transition: 0.2s;
-                        margin-right: 3px;
-                    }
-
-                    .headerButton:hover {
-                        background-color: rgba(0, 0, 0, 1);
-                        transform: scale(1.15);
-                    }
-                }
-            }
-        }
-    }
-
-    .selectedList {
-        display: block;
-        min-width: 50;
-        max-width: 120;
-        height: 70;
-        overflow-y: scroll;
-
-        .selectedList-items {
-            font-size: 7;
-            font-weight: normal;
-        }
-    }
-
-    .ribbon-button {
-        cursor: pointer;
-        font-size: 10.5;
-        font-weight: 300;
-        height: 20;
-        background-color: $medium-gray;
-        color: white;
-        display: flex;
-        margin-top: 5px;
-        margin-bottom: 5px;
-        border-radius: 5px;
-        margin-right: 5px;
-        width: max-content;
-        justify-content: center;
-        align-items: center;
-        padding-right: 10px;
-        padding-left: 10px;
-    }
-
-    .ribbon-button:hover {
-        transform: scale(1.03);
-        transition: all 0.4s;
-        font-weight: 400;
-        opacity: 1;
-        color: $white;
-        background-color: $black;
-    }
-
-    .ribbon-toggle {
-        cursor: pointer;
-        font-size: 10.5;
-        font-weight: 200;
-        height: 20;
-        background-color: $white;
-        border: solid 1px rgba(0, 0, 0, 0.5);
-        display: flex;
-        color: $black;
-        margin-top: 5px;
-        margin-bottom: 5px;
-        border-radius: 5px;
-        margin-right: 5px;
-        width: max-content;
-        justify-content: center;
-        align-items: center;
-        padding-right: 10px;
-        padding-left: 10px;
-    }
-
-    .ribbon-toggle.active {
-        background-color: #aedef8;
-    }
-
-    .ribbon-toggle:hover {
-        transform: scale(1.03);
-        transition: all 0.4s;
-        border: solid 1px rgba(0, 0, 0, 0.75);
-    }
-
-    svg.svg-inline--fa.fa-thumbtack.fa-w-12.toolbar-thumbtack {
-        right: 40;
-        position: absolute;
-        transform: rotate(45deg);
-    }
-
-    .ribbon-box {
-        display: grid;
-        grid-template-rows: max-content auto;
-        justify-self: center;
-        margin-top: 10px;
-        padding-right: 10px;
-        letter-spacing: normal;
-        width: 100%;
-        height: max-content;
-        font-weight: 500;
-        position: relative;
-        font-size: 13;
-        padding-bottom: 10px;
-        border-bottom: solid 1px $dark-gray;
-
-        .presBox-dropdown:hover {
-            border: solid 1px $medium-blue;
-
-            .presBox-dropdownIcon {
-                color: $medium-blue;
-            }
-        }
-
-        .presBox-dropdown {
-            cursor: pointer;
-            display: grid;
-            grid-template-columns: auto 20%;
-            position: relative;
-            border: solid 1px $black;
-            background-color: $light-gray;
-            border-radius: 5px;
-            font-size: 10;
-            height: 25;
-            color: $black;
-            padding-left: 5px;
-            align-items: center;
-            margin-top: 5px;
-            margin-bottom: 5px;
-            font-weight: 200;
-            width: 100%;
-            min-width: max-content;
-            max-width: 200px;
-            overflow: visible;
-
-
-            .presBox-dropdownOption {
-                cursor: pointer;
-                font-size: 11;
-                display: block;
-                padding-left: 10px;
-                padding-right: 5px;
-                padding-top: 3;
-                padding-bottom: 3;
-            }
-
-            .presBox-dropdownOption:hover {
-                position: relative;
-                background-color: lightgrey;
-            }
-
-            .presBox-dropdownOption.active {
-                position: relative;
-                background-color: $light-blue;
-            }
-
-            .presBox-dropdownOptions {
-                position: absolute;
-                top: 23px;
-                left: -2px;
-                z-index: 200;
-                width: 85%;
-                min-width: max-content;
-                display: block;
-                background: #FFFFFF;
-                border: 0.5px solid #979797;
-                box-sizing: border-box;
-                box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
-            }
-
-            .presBox-dropdownIcon {
-                position: relative;
-                color: black;
-                align-self: center;
-                justify-self: center;
-                margin-right: 2px;
-            }
-        }
-    }
-}
-
-.presBox-ribbon.active {
-    display: grid;
-    grid-template-columns: auto auto auto auto auto;
-    grid-template-rows: 100%;
-    height: 100px;
-    padding-top: 5px;
-    padding-bottom: 5px;
-    border: solid 1px $black;
-    // overflow: auto; 
-
-    ::-webkit-scrollbar {
-        -webkit-appearance: none;
-        height: 3px;
-        width: 8px;
-    }
-
-    ::-webkit-scrollbar-thumb {
-        border-radius: 2px;
-    }
-}
-
-.dropdown-play-button {
-    cursor: pointer;
-    font-size: 12;
-    padding-left: 5px;
-    padding-right: 5px;
-    padding-top: 5px;
-    padding-bottom: 5px;
-    text-align: left;
-    justify-content: left;
-}
-
-.dropdown-play-button:hover {
-    background-color: lightgrey;
-}
-
-.presBox-button-left {
-    cursor: pointer;
-    position: relative;
-    align-self: flex-start;
-    justify-self: flex-start;
-    width: 100%;
-    height: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 4px;
-    padding-left: 7px;
-    padding-right: 7px;
-    border-bottom-right-radius: 0;
-    border-top-right-radius: 0;
-}
-
-.presBox-button-right {
-    cursor: pointer;
-    position: relative;
-    text-align: center;
-    border-left: solid 1px $medium-gray;
-    width: 20%;
-    height: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 4px;
-    padding-left: 7px;
-    padding-right: 7px;
-    border-bottom-left-radius: 0;
-    border-top-left-radius: 0;
-}
-
-.presBox-button-right.active {
-    background-color: #223063;
-    border: #aedcf6 solid 1px;
-    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.8);
-}
-
-.dropdown-play {
-    cursor: pointer;
-    right: 0px;
-    top: calc(100% + 2px);
-    display: none;
-    border-radius: 5px;
-    width: max-content;
-    min-height: 20px;
-    height: max-content;
-    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.8);
-    z-index: 200;
-    background-color: white;
-    color: $black;
-    position: absolute;
-    overflow: hidden;
-}
-
-.dropdown-play.active {
-    display: block;
-}
-
-.open-layout {
-    cursor: pointer;
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    transform: translate(0px, -1px);
-    background-color: $white;
-    width: 40px;
-    height: 15px;
-    align-self: center;
-    justify-self: center;
-    border: solid 1px $black;
-    border-top: 0px;
-    border-bottom-right-radius: 7px;
-    border-bottom-left-radius: 7px;
-}
-
-.layout-container {
-    padding: 5px;
-    display: grid;
-    background-color: $white;
-    grid-template-columns: repeat(auto-fit, minmax(90px, 100px));
-    width: 100%;
-    border: solid 1px $black;
-    min-width: 100px;
-    overflow: hidden;
-
-    .layout:hover {
-        border: solid 2px $medium-blue;
-    }
-
-    .layout {
-        cursor: pointer;
-        align-self: center;
-        justify-self: center;
-        margin-top: 5;
-        margin-bottom: 5;
-        position: relative;
-        height: 55px;
-        min-width: 90px;
-        width: 90px;
-        overflow: hidden;
-        background-color: white;
-        border: solid $medium-gray 1px;
-        display: grid;
-        grid-template-rows: auto;
-        align-items: center;
-        text-align: center;
-
-        .title {
-            position: relative;
-            align-self: end;
-            padding-left: 3px;
-            margin-left: 3px;
-            margin-right: 3px;
-            height: 13;
-            font-size: 12;
-            display: flex;
-            background-color: #white;
-        }
-
-        .subtitle {
-            align-self: flex-start;
-            position: relative;
-            padding-left: 3px;
-            margin-left: 3px;
-            margin-right: 3px;
-            font-weight: 400;
-            height: 13;
-            font-size: 9;
-            display: flex;
-            background-color: $white;
-        }
-
-        .content {
-            position: relative;
-            font-weight: 200;
-            align-self: flex-start;
-            padding-left: 3px;
-            margin-left: 3px;
-            margin-right: 3px;
-            height: 13;
-            font-size: 10;
-            display: flex;
-            background-color: $white;
-            height: 33;
-            text-align: left;
-            font-size: 8px;
-        }
-    }
-}
-
-.presBox-buttons {
-    position: relative;
-    width: 100%;
-    background: gray;
-    min-height: 35px;
-    padding-top: 5px;
-    padding-bottom: 5px;
-    display: grid;
-    grid-template-columns: auto auto;
-
-    .presBox-viewPicker {
-        cursor: pointer;
-        height: 25;
-        position: relative;
-        display: inline-block;
-        grid-column: 1;
-        border-radius: 5px;
-        min-width: 15px;
-        max-width: 100px;
-        left: 8px;
-    }
-
-    .presBox-presentPanel {
-        display: flex;
-        justify-self: end;
-        width: 100%;
-        max-width: 300px;
-        min-width: 150px;
-    }
-
-
-
-    select {
-        background: $dark-gray;
-        color: $white;
-    }
-
-    .presBox-button {
-        cursor: pointer;
-        height: 25px;
-        border-radius: 5px;
-        display: none;
-        justify-content: center;
-        align-content: center;
-        align-items: center;
-        text-align: center;
-        letter-spacing: normal;
-        width: inherit;
-        background: $dark-gray;
-        color: $white;
-    }
-
-    .presBox-button.active {
-        display: flex;
-    }
-
-    .presBox-button.active:hover {
-        background-color: $medium-blue;
-    }
-
-    .presBox-button.edit {
-        display: flex;
-        max-width: 25px;
-    }
-
-    .presBox-button.present {
-        display: flex;
-        width: max-content;
-        position: absolute;
-        right: 10px;
-
-        .present-icon {
-            margin-right: 7px;
-        }
-    }
-
-
-
-    .collectionViewBaseChrome-viewPicker {
-        min-width: 50;
-        width: 5%;
-        height: 25;
-        position: relative;
-        display: inline-block;
-        left: 8px;
-    }
-}
-
-.presBox-backward,
-.presBox-forward {
-    width: 25px;
-    border-radius: 5px;
-    top: 50%;
-    position: absolute;
-    display: inline-block;
-}
-
-.presBox-backward {
-    left: 5;
-}
-
-.presBox-forward {
-    right: 5;
-}
-
-// CSS adjusted for mobile devices
-@media only screen and (max-device-width: 480px) {
-    .presBox-cont .presBox-buttons {
-        position: absolute;
-        top: 70%;
-        left: 50%;
-        transform: translate(-50%, 0);
-        width: max-content;
-        height: 15%;
-        z-index: 2;
-        align-items: center;
-        background: rgba(0, 0, 0, 0);
-        display: inline-flex;
-
-        .presBox-button {
-            margin-top: 5%;
-            height: 250;
-            width: 300;
-            font-size: 100;
-            display: flex;
-            align-items: center;
-            background: $dark-gray;
-            color: $white;
-        }
-
-        .presBox-viewPicker {
-            top: -70;
-            left: 2.5%;
-            height: 50;
-            width: 95%;
-            font-size: 30px;
-            position: absolute;
-            min-width: 50px;
-        }
-    }
-
-    .presBox-cont .presBox-listCont {
-        top: 50;
-        height: calc(100% - 80px);
-    }
-
-    .input,
-    .select {
-        font-size: 100%;
-    }
-}
-
-.miniPres {
-    cursor: grab;
-    position: absolute;
-    right: 10;
-    top: 10;
-    opacity: 0.1;
-    transition: all 0.4s;
-    color: $white;
-}
-
-.miniPres:hover {
-    opacity: 1;
-}
-
-.presPanelOverlay {
-    background-color: $dark-gray;
-    color: $white;
-    border-radius: 5px;
-    grid-template-rows: 100%;
-    height: 25;
-    width: max-content;
-    min-width: max-content;
-    justify-content: space-evenly;
-    align-items: center;
-    display: flex;
-    position: absolute;
-    right: 10px;
-    transition: all 0.2s;
-
-    .presPanel-button-text {
-        cursor: pointer;
-        display: flex;
-        height: 20;
-        width: max-content;
-        font-family: Roboto;
-        font-weight: 400;
-        margin-left: 3px;
-        margin-right: 3px;
-        padding-right: 3px;
-        padding-left: 3px;
-        letter-spacing: normal;
-        border-radius: 5px;
-        align-items: center;
-        justify-content: center;
-        transition: all 0.3s;
-    }
-
-    .presPanel-divider {
-        width: 0.5px;
-        height: 80%;
-        border-right: solid 1px $medium-gray;
-    }
-
-    .presPanel-button-frame {
-        justify-self: center;
-        align-self: center;
-        align-items: center;
-        display: grid;
-        grid-template-columns: auto auto auto;
-        justify-content: space-around;
-        font-size: 11;
-        margin-left: 7;
-        width: 30;
-        height: 85%;
-        background-color: rgba(91, 157, 221, 0.4);
-        border-radius: 5px;
-    }
-
-    .presPanel-button {
-        cursor: pointer;
-        display: flex;
-        height: 20;
-        min-width: 20;
-        margin-left: 3px;
-        margin-right: 3px;
-        border-radius: 100%;
-        align-items: center;
-        justify-content: center;
-        transition: all 0.3s;
-    }
-
-    .presPanel-button:hover {
-        background-color: $medium-gray;
-        transform: scale(1.2);
-    }
-
-    .presPanel-button-text:hover {
-        background-color: $medium-gray;
-    }
-
-
-}
-
-// .miniPres {
-//     cursor: grab;
-//     position: absolute;
-//     overflow: hidden;
-//     right: 10;
-//     top: 10;
-//     opacity: 0.1;
-//     transition: all 0.4s;
-//     /* border: solid 1px; */
-//     color: white;
-//     /* box-shadow: black 0.4vw 0.4vw 0.8vw; */
-
-//     .miniPresOverlay {
-//         display: grid;
-//         grid-template-columns: auto auto auto auto auto auto auto auto auto auto;
-//         grid-template-rows: 100%;
-//         height: 100%;
-//         justify-items: center;
-//         align-items: center;
-
-//         .miniPres-button-text {
-//             cursor: pointer;
-//             display: flex;
-//             height: 20;
-//             font-weight: 400;
-//             min-width: 100%;
-//             border-radius: 5px;
-//             align-items: center;
-//             justify-content: center;
-//             transition: all 0.3s;
-//         }
-
-//         .miniPres-button-frame {
-//             justify-self: center;
-//             align-self: center;
-//             align-items: center;
-//             display: grid;
-//             grid-template-columns: auto auto auto;
-//             justify-content: space-around;
-//             font-size: 11;
-//             margin-left: 7;
-//             width: 30;
-//             height: 85%;
-//             background-color: rgba(91, 157, 221, 0.4);
-//             border-radius: 5px;
-//         }
-
-//         .miniPres-divider {
-//             width: 0.5px;
-//             height: 80%;
-//             border-right: solid 2px #5a5a5a;
-//         }
-
-//         .miniPres-button {
-//             cursor: pointer;
-//             display: flex;
-//             height: 20;
-//             min-width: 20;
-//             border-radius: 100%;
-//             align-items: center;
-//             justify-content: center;
-//             transition: all 0.3s;
-//         }
-
-//         .miniPres-button:hover {
-//             background-color: #5a5a5a;
-//         }
-
-//         .miniPres-button-text:hover {
-//             background-color: #5a5a5a;
-//         }
-//     }
-// }
\ No newline at end of file
diff --git a/src/client/views/nodes/PresBox.tsx b/src/client/views/nodes/PresBox.tsx
deleted file mode 100644
index f3fb6ff17..000000000
--- a/src/client/views/nodes/PresBox.tsx
+++ /dev/null
@@ -1,2472 +0,0 @@
-import React = require("react");
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { Tooltip } from "@material-ui/core";
-import { action, computed, IReactionDisposer, observable, ObservableMap, reaction, runInAction } from "mobx";
-import { observer } from "mobx-react";
-import { ColorState, SketchPicker } from "react-color";
-import { Bounce, Fade, Flip, LightSpeed, Roll, Rotate, Zoom } from 'react-reveal';
-import { Doc, DocListCast, DocListCastAsync, FieldResult } from "../../../fields/Doc";
-import { documentSchema } from "../../../fields/documentSchemas";
-import { InkTool } from "../../../fields/InkField";
-import { List } from "../../../fields/List";
-import { PrefetchProxy } from "../../../fields/Proxy";
-import { listSpec, makeInterface } from "../../../fields/Schema";
-import { ScriptField } from "../../../fields/ScriptField";
-import { BoolCast, Cast, NumCast, StrCast } from "../../../fields/Types";
-import { returnFalse, returnOne, returnTrue, emptyFunction } from '../../../Utils';
-import { Docs } from "../../documents/Documents";
-import { DocumentType } from "../../documents/DocumentTypes";
-import { CurrentUserUtils } from "../../util/CurrentUserUtils";
-import { DocumentManager } from "../../util/DocumentManager";
-import { Scripting } from "../../util/Scripting";
-import { SelectionManager } from "../../util/SelectionManager";
-import { undoBatch, UndoManager } from "../../util/UndoManager";
-import { CollectionDockingView } from "../collections/CollectionDockingView";
-import { CollectionView, CollectionViewType } from "../collections/CollectionView";
-import { TabDocView } from "../collections/TabDocView";
-import { ViewBoxBaseComponent } from "../DocComponent";
-import { CollectionFreeFormDocumentView } from "./CollectionFreeFormDocumentView";
-import { FieldView, FieldViewProps } from './FieldView';
-import "./PresBox.scss";
-import Color = require("color");
-import { LightboxView } from "../LightboxView";
-
-export enum PresMovement {
-    Zoom = "zoom",
-    Pan = "pan",
-    Jump = "jump",
-    None = "none",
-}
-
-export enum PresEffect {
-    Zoom = "Zoom",
-    Lightspeed = "Lightspeed",
-    Fade = "Fade in",
-    Flip = "Flip",
-    Rotate = "Rotate",
-    Bounce = "Bounce",
-    Roll = "Roll",
-    None = "None",
-    Left = "left",
-    Right = "right",
-    Center = "center",
-    Top = "top",
-    Bottom = "bottom"
-}
-
-enum PresStatus {
-    Autoplay = "auto",
-    Manual = "manual",
-    Edit = "edit"
-}
-
-export enum PresColor {
-    LightBlue = "#AEDDF8",
-    DarkBlue = "#5B9FDD",
-    LightBackground = "#ececec",
-    SlideBackground = "#d5dce2",
-}
-
-export class PinProps {
-    audioRange?: boolean;
-    unpin?: boolean;
-    setPosition?: boolean;
-    hidePresBox?: boolean;
-}
-
-type PresBoxSchema = makeInterface<[typeof documentSchema]>;
-const PresBoxDocument = makeInterface(documentSchema);
-
-@observer
-export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>(PresBoxDocument) {
-    public static LayoutString(fieldKey: string) { return FieldView.LayoutString(PresBox, fieldKey); }
-
-    static renderEffectsDoc(renderDoc: any, layoutDoc: Doc) {
-        const effectProps = {
-            left: layoutDoc.presEffectDirection === PresEffect.Left,
-            right: layoutDoc.presEffectDirection === PresEffect.Right,
-            top: layoutDoc.presEffectDirection === PresEffect.Top,
-            bottom: layoutDoc.presEffectDirection === PresEffect.Bottom,
-            opposite: true,
-            delay: layoutDoc.presTransition,
-            // when: this.layoutDoc === PresBox.Instance.childDocs[PresBox.Instance.itemIndex]?.presentationTargetDoc,
-        };
-        switch (layoutDoc.presEffect) {
-            case PresEffect.Zoom: return (<Zoom {...effectProps}>{renderDoc}</Zoom>);
-            case PresEffect.Fade: return (<Fade {...effectProps}>{renderDoc}</Fade>);
-            case PresEffect.Flip: return (<Flip {...effectProps}>{renderDoc}</Flip>);
-            case PresEffect.Rotate: return (<Rotate {...effectProps}>{renderDoc}</Rotate>);
-            case PresEffect.Bounce: return (<Bounce {...effectProps}>{renderDoc}</Bounce>);
-            case PresEffect.Roll: return (<Roll {...effectProps}>{renderDoc}</Roll>);
-            case PresEffect.Lightspeed: return (<LightSpeed {...effectProps}>{renderDoc}</LightSpeed>);
-            case PresEffect.None:
-            default: return renderDoc;
-        }
-    }
-    public static EffectsProvider(layoutDoc: Doc, renderDoc: any) {
-        return PresBox.Instance && layoutDoc === PresBox.Instance.childDocs[PresBox.Instance.itemIndex]?.presentationTargetDoc ?
-            PresBox.renderEffectsDoc(renderDoc, layoutDoc)
-            :
-            renderDoc;
-    }
-
-    @observable public static Instance: PresBox;
-
-    @observable _isChildActive = false;
-    @observable _moveOnFromAudio: boolean = true;
-    @observable _presTimer!: NodeJS.Timeout;
-    @observable _presKeyEventsActive: boolean = false;
-
-    @observable _selectedArray: ObservableMap = new ObservableMap<Doc, any>();
-    @observable _eleArray: HTMLElement[] = [];
-    @observable _dragArray: HTMLElement[] = [];
-    @observable _pathBoolean: boolean = false;
-    @observable _expandBoolean: boolean = false;
-
-    private _disposers: { [name: string]: IReactionDisposer } = {};
-    @observable private transitionTools: boolean = false;
-    @observable private newDocumentTools: boolean = false;
-    @observable private progressivizeTools: boolean = false;
-    @observable private openMovementDropdown: boolean = false;
-    @observable private openEffectDropdown: boolean = false;
-    @observable private presentTools: boolean = false;
-    @computed get childDocs() { return DocListCast(this.dataDoc[this.fieldKey]); }
-    @computed get tagDocs() {
-        const tagDocs: Doc[] = [];
-        for (const doc of this.childDocs) {
-            const tagDoc = Cast(doc.presentationTargetDoc, Doc, null);
-            tagDocs.push(tagDoc);
-        }
-        return tagDocs;
-    }
-    @computed get itemIndex() { return NumCast(this.rootDoc._itemIndex); }
-    @computed get activeItem() { return Cast(this.childDocs[NumCast(this.rootDoc._itemIndex)], Doc, null); }
-    @computed get targetDoc() { return Cast(this.activeItem?.presentationTargetDoc, Doc, null); }
-    @computed get scrollable(): boolean {
-        if (this.targetDoc.type === DocumentType.PDF || this.targetDoc.type === DocumentType.WEB || this.targetDoc.type === DocumentType.RTF || this.targetDoc._viewType === CollectionViewType.Stacking) return true;
-        else return false;
-    }
-    @computed get panable(): boolean {
-        if ((this.targetDoc.type === DocumentType.COL && this.targetDoc._viewType === CollectionViewType.Freeform) || this.targetDoc.type === DocumentType.IMG) return true;
-        else return false;
-    }
-    @computed get presElement() { return Cast(Doc.UserDoc().presElement, Doc, null); }
-    constructor(props: any) {
-        super(props);
-        if (Doc.UserDoc().activePresentation = this.rootDoc) runInAction(() => PresBox.Instance = this);
-        if (!this.presElement) { // create exactly one presElmentBox template to use by any and all presentations.
-            Doc.UserDoc().presElement = new PrefetchProxy(Docs.Create.PresElementBoxDocument({
-                title: "pres element template", type: DocumentType.PRESELEMENT, _xMargin: 0, isTemplateDoc: true, isTemplateForField: "data"
-            }));
-            // this script will be called by each presElement to get rendering-specific info that the PresBox knows about but which isn't written to the PresElement
-            // this is a design choice -- we could write this data to the presElements which would require a reaction to keep it up to date, and it would prevent
-            // the preselement docs from being part of multiple presentations since they would all have the same field, or we'd have to keep per-presentation data
-            // stored on each pres element.
-            (this.presElement as Doc).lookupField = ScriptField.MakeFunction("lookupPresBoxField(container, field, data)",
-                { field: "string", data: Doc.name, container: Doc.name });
-        }
-        this.props.Document.presentationFieldKey = this.fieldKey; // provide info to the presElement script so that it can look up rendering information about the presBox
-    }
-    @computed get selectedDocumentView() {
-        if (SelectionManager.Views().length) return SelectionManager.Views()[0];
-        if (this._selectedArray.size) return DocumentManager.Instance.getDocumentView(this.rootDoc);
-    }
-    @computed get isPres(): boolean {
-        document.removeEventListener("keydown", PresBox.keyEventsWrapper, true);
-        if (this.selectedDoc?.type === DocumentType.PRES) {
-            document.removeEventListener("keydown", PresBox.keyEventsWrapper, true);
-            document.addEventListener("keydown", PresBox.keyEventsWrapper, true);
-            return true;
-        }
-        return false;
-    }
-    @computed get selectedDoc() { return this.selectedDocumentView?.rootDoc; }
-
-    @action
-    componentWillUnmount() {
-        document.removeEventListener("keydown", PresBox.keyEventsWrapper, true);
-        this._presKeyEventsActive = false;
-        this.resetPresentation();
-        // Turn of progressivize editors
-        this.turnOffEdit(true);
-        Object.values(this._disposers).forEach(disposer => disposer?.());
-    }
-
-    @action
-    componentDidMount() {
-        this.rootDoc.presBox = this.rootDoc;
-        this.rootDoc._forceRenderEngine = "timeline";
-        this.layoutDoc.presStatus = PresStatus.Edit;
-        this.layoutDoc._gridGap = 0;
-        this.layoutDoc._yMargin = 0;
-        this.turnOffEdit(true);
-        DocListCastAsync((Doc.UserDoc().myPresentations as Doc).data).then(pres =>
-            !pres?.includes(this.rootDoc) && Doc.AddDocToList(Doc.UserDoc().myPresentations as Doc, "data", this.rootDoc));
-        this._disposers.selection = reaction(() => SelectionManager.Views(),
-            views => views.some(view => view.props.Document === this.rootDoc) && this.updateCurrentPresentation());
-    }
-
-    @action
-    updateCurrentPresentation = (pres?: Doc) => {
-        if (pres) Doc.UserDoc().activePresentation = pres;
-        else Doc.UserDoc().activePresentation = this.rootDoc;
-        document.removeEventListener("keydown", PresBox.keyEventsWrapper, true);
-        document.addEventListener("keydown", PresBox.keyEventsWrapper, true);
-        this._presKeyEventsActive = true;
-        PresBox.Instance = this;
-    }
-
-    // There are still other internal frames and should go through all frames before going to next slide
-    nextInternalFrame = (targetDoc: Doc, activeItem: Doc) => {
-        const currentFrame = Cast(targetDoc?._currentFrame, "number", null);
-        const childDocs = DocListCast(targetDoc[Doc.LayoutFieldKey(targetDoc)]);
-        targetDoc._viewTransition = "all 1s";
-        setTimeout(() => targetDoc._viewTransition = undefined, 1010);
-        this.nextKeyframe(targetDoc, activeItem);
-        if (activeItem.presProgressivize) CollectionFreeFormDocumentView.updateKeyframe(childDocs, currentFrame || 0, targetDoc);
-        else targetDoc.keyFrameEditing = true;
-    }
-
-    _mediaTimer!: [NodeJS.Timeout, Doc];
-    // 'Play on next' for audio or video therefore first navigate to the audio/video before it should be played
-    startTempMedia = (targetDoc: Doc, activeItem: Doc) => {
-        const duration: number = NumCast(activeItem.presEndTime) - NumCast(activeItem.presStartTime);
-        if ([DocumentType.VID, DocumentType.AUDIO].includes(targetDoc.type as any)) {
-            const targMedia = DocumentManager.Instance.getDocumentView(targetDoc);
-            targMedia?.ComponentView?.playFrom?.(NumCast(activeItem.presStartTime), NumCast(activeItem.presStartTime) + duration);
-        }
-        // if (targetDoc.type === DocumentType.AUDIO) {
-        //     if (this._mediaTimer && this._mediaTimer[1] === targetDoc) clearTimeout(this._mediaTimer[0]);
-        //     targetDoc._triggerAudio = NumCast(activeItem.presStartTime);
-        //     this._mediaTimer = [setTimeout(() => targetDoc._audioStop = true, duration * 1000), targetDoc];
-        // } else if (targetDoc.type === DocumentType.VID) {
-        //     targetDoc._triggerVideoStop = true;
-        //     setTimeout(() => targetDoc._currentTimecode = NumCast(activeItem.presStartTime), 10);
-        //     setTimeout(() => targetDoc._triggerVideo = true, 20);
-        //     this._mediaTimer = [setTimeout(() => targetDoc._triggerVideoStop = true, (duration * 1000) + 20), targetDoc];
-        // }
-    }
-
-    stopTempMedia = (targetDocField: FieldResult) => {
-        const targetDoc = Cast(targetDocField, Doc, null);
-        if (targetDoc?.type === DocumentType.AUDIO) {
-            if (this._mediaTimer && this._mediaTimer[1] === targetDoc) clearTimeout(this._mediaTimer[0]);
-            targetDoc._audioStop = true;
-        } else if (targetDoc?.type === DocumentType.VID) {
-            if (this._mediaTimer && this._mediaTimer[1] === targetDoc) clearTimeout(this._mediaTimer[0]);
-            targetDoc._triggerVideoStop = true;
-        }
-    }
-
-    // No more frames in current doc and next slide is defined, therefore move to next slide 
-    nextSlide = (activeNext: Doc) => {
-        const targetNext = Cast(activeNext.presentationTargetDoc, Doc, null);
-        let nextSelected = this.itemIndex + 1;
-        this.gotoDocument(nextSelected, this.activeItem);
-        for (nextSelected = nextSelected + 1; nextSelected < this.childDocs.length; nextSelected++) {
-            if (!this.childDocs[nextSelected].groupWithUp) {
-                break;
-            } else {
-                console.log("Title: " + this.childDocs[nextSelected].title);
-                this.gotoDocument(nextSelected, this.activeItem, true);
-            }
-        }
-    }
-
-    // Called when the user activates 'next' - to move to the next part of the pres. trail
-    @action
-    next = () => {
-        const activeNext = Cast(this.childDocs[this.itemIndex + 1], Doc, null);
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        const lastFrame = Cast(targetDoc?.lastFrame, "number", null);
-        const curFrame = NumCast(targetDoc?._currentFrame);
-        let internalFrames: boolean = false;
-        if (activeItem.presProgressivize || activeItem.zoomProgressivize || targetDoc.scrollProgressivize) internalFrames = true;
-        if (internalFrames && lastFrame !== undefined && curFrame < lastFrame) {
-            // Case 1: There are still other frames and should go through all frames before going to next slide
-            this.nextInternalFrame(targetDoc, activeItem);
-        } else if (this.childDocs[this.itemIndex + 1] !== undefined) {
-            // Case 2: No more frames in current doc and next slide is defined, therefore move to next slide 
-            this.nextSlide(activeNext);
-        } else if (this.childDocs[this.itemIndex + 1] === undefined && (this.layoutDoc.presLoop || this.layoutDoc.presStatus === PresStatus.Edit)) {
-            // Case 3: Last slide and presLoop is toggled ON or it is in Edit mode
-            this.gotoDocument(0, this.activeItem);
-        }
-    }
-
-    // Called when the user activates 'back' - to move to the previous part of the pres. trail
-    @action
-    back = () => {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        const prevItem = Cast(this.childDocs[Math.max(0, this.itemIndex - 1)], Doc, null);
-        const prevTargetDoc = Cast(prevItem.presentationTargetDoc, Doc, null);
-        const lastFrame = Cast(targetDoc.lastFrame, "number", null);
-        const curFrame = NumCast(targetDoc._currentFrame);
-        let prevSelected = this.itemIndex;
-        // Functionality for group with up
-        let didZoom = activeItem.presMovement;
-        for (; !didZoom && prevSelected > 0 && this.childDocs[prevSelected].groupButton; prevSelected--) {
-            didZoom = this.childDocs[prevSelected].presMovement;
-        }
-        if (lastFrame !== undefined && curFrame >= 1) {
-            // Case 1: There are still other frames and should go through all frames before going to previous slide
-            this.prevKeyframe(targetDoc, activeItem);
-        } else if (activeItem && this.childDocs[this.itemIndex - 1] !== undefined) {
-            // Case 2: There are no other frames so it should go to the previous slide
-            prevSelected = Math.max(0, prevSelected - 1);
-            this.gotoDocument(prevSelected, activeItem);
-            if (NumCast(prevTargetDoc.lastFrame) > 0) prevTargetDoc._currentFrame = NumCast(prevTargetDoc.lastFrame);
-        } else if (this.childDocs[this.itemIndex - 1] === undefined && this.layoutDoc.presLoop) {
-            // Case 3: Pres loop is on so it should go to the last slide
-            this.gotoDocument(this.childDocs.length - 1, activeItem);
-        }
-    }
-
-    //The function that is called when a document is clicked or reached through next or back.
-    //it'll also execute the necessary actions if presentation is playing.
-    public gotoDocument = action((index: number, from?: Doc, group?: boolean) => {
-        Doc.UnBrushAllDocs();
-        if (index >= 0 && index < this.childDocs.length) {
-            this.rootDoc._itemIndex = index;
-            const activeItem: Doc = this.activeItem;
-            const targetDoc: Doc = this.targetDoc;
-            if (from?.mediaStopTriggerList && this.layoutDoc.presStatus !== PresStatus.Edit) {
-                DocListCast(from.mediaStopTriggerList).forEach(this.stopTempMedia);
-            }
-            if (from?.mediaStop === "auto" && this.layoutDoc.presStatus !== PresStatus.Edit) {
-                this.stopTempMedia(from.presentationTargetDoc);
-            }
-            // If next slide is audio / video 'Play automatically' then the next slide should be played
-            if (this.layoutDoc.presStatus !== PresStatus.Edit && (targetDoc.type === DocumentType.AUDIO || targetDoc.type === DocumentType.VID) && (activeItem.mediaStart === "auto")) {
-                this.startTempMedia(targetDoc, activeItem);
-            }
-            if (targetDoc) {
-                targetDoc && runInAction(() => {
-                    if (activeItem.presMovement === PresMovement.Jump) targetDoc.focusSpeed = 0;
-                    else targetDoc.focusSpeed = activeItem.presTransition ? activeItem.presTransition : 500;
-                });
-                setTimeout(() => targetDoc.focusSpeed = 500, this.activeItem.presTransition ? NumCast(this.activeItem.presTransition) + 10 : 510);
-            }
-            if (targetDoc?.lastFrame !== undefined) {
-                targetDoc._currentFrame = 0;
-            }
-            if (!group) this._selectedArray.clear();
-            this.childDocs[index] && this._selectedArray.set(this.childDocs[index], undefined); //Update selected array
-            if (this.layoutDoc._viewType === "stacking" && !group) this.navigateToElement(this.childDocs[index]); //Handles movement to element only when presTrail is list
-            this.onHideDocument(); //Handles hide after/before
-        }
-    });
-
-    _navTimer!: NodeJS.Timeout;
-    navigateToView = (targetDoc: Doc, activeItem: Doc) => {
-        clearTimeout(this._navTimer);
-        const bestTarget = DocumentManager.Instance.getFirstDocumentView(targetDoc)?.props.Document;
-        bestTarget && runInAction(() => {
-            if (bestTarget.type === DocumentType.PDF || bestTarget.type === DocumentType.WEB || bestTarget.type === DocumentType.RTF || bestTarget._viewType === CollectionViewType.Stacking) {
-                bestTarget._viewTransition = activeItem.presTransition ? `transform ${activeItem.presTransition}ms` : 'all 0.5s';
-                bestTarget._scrollTop = activeItem.presPinViewScroll;
-            } else if (bestTarget.type === DocumentType.COMPARISON) {
-                bestTarget._clipWidth = activeItem.presPinClipWidth;
-            } else if (bestTarget.type === DocumentType.VID) {
-                bestTarget._currentTimecode = activeItem.presPinTimecode;
-            } else {
-                bestTarget._viewTransition = activeItem.presTransition ? `transform ${activeItem.presTransition}ms` : 'all 0.5s';
-                bestTarget._panX = activeItem.presPinViewX;
-                bestTarget._panY = activeItem.presPinViewY;
-                bestTarget._viewScale = activeItem.presPinViewScale;
-            }
-            this._navTimer = setTimeout(() => bestTarget._viewTransition = undefined, activeItem.presTransition ? NumCast(activeItem.presTransition) + 10 : 510);
-        });
-    }
-
-    /**
-     * This method makes sure that cursor navigates to the element that
-     * has the option open and last in the group. 
-     * Design choice: If the next document is not in presCollection or 
-     * presCollection itself then if there is a presCollection it will add
-     * a new tab. If presCollection is undefined it will open the document
-     * on the right. 
-     */
-    navigateToElement = async (curDoc: Doc) => {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        const srcContext = Cast(targetDoc.context, Doc, null);
-        const presCollection = Cast(this.layoutDoc.presCollection, Doc, null);
-        const collectionDocView = presCollection ? DocumentManager.Instance.getDocumentView(presCollection) : undefined;
-        const includesDoc: boolean = DocListCast(presCollection?.data).includes(targetDoc);
-        const tab = Array.from(CollectionDockingView.Instance.tabMap).find(tab => tab.DashDoc === srcContext);
-        this.turnOffEdit();
-        // Handles the setting of presCollection
-        if (includesDoc) {
-            //Case 1: Pres collection should not change as it is already the same
-        } else if (tab !== undefined) {
-            // Case 2: Pres collection should update
-            this.layoutDoc.presCollection = srcContext;
-        }
-        const presStatus = this.rootDoc.presStatus;
-        const selViewCache = Array.from(this._selectedArray.keys());
-        const dragViewCache = Array.from(this._dragArray);
-        const eleViewCache = Array.from(this._eleArray);
-        const self = this;
-        const resetSelection = action(() => {
-            const presDocView = DocumentManager.Instance.getDocumentView(self.rootDoc);
-            if (presDocView) SelectionManager.SelectView(presDocView, false);
-            self.rootDoc.presStatus = presStatus;
-            self._selectedArray.clear();
-            selViewCache.forEach(doc => self._selectedArray.set(doc, undefined));
-            self._dragArray.splice(0, self._dragArray.length, ...dragViewCache);
-            self._eleArray.splice(0, self._eleArray.length, ...eleViewCache);
-        });
-        const openInTab = (doc: Doc, finished?: () => void) => {
-            collectionDocView ? collectionDocView.props.addDocTab(doc, "") : this.props.addDocTab(doc, ":left");
-            this.layoutDoc.presCollection = targetDoc;
-            // this still needs some fixing
-            setTimeout(resetSelection, 500);
-            if (doc !== targetDoc) {
-                setTimeout(finished ?? emptyFunction, 100); /// give it some time to create the targetDoc if we're opening up its context
-            } else {
-                finished?.();
-            }
-        };
-        // If openDocument is selected then it should open the document for the user
-        if (activeItem.openDocument) {
-            LightboxView.SetLightboxDoc(targetDoc);
-        } else if (curDoc.presMovement === PresMovement.Pan && targetDoc) {
-            LightboxView.SetLightboxDoc(undefined);
-            await DocumentManager.Instance.jumpToDocument(targetDoc, false, openInTab, srcContext, undefined, undefined, undefined, includesDoc || tab ? undefined : resetSelection); // documents open in new tab instead of on right
-        } else if ((curDoc.presMovement === PresMovement.Zoom || curDoc.presMovement === PresMovement.Jump) && targetDoc) {
-            LightboxView.SetLightboxDoc(undefined);
-            //awaiting jump so that new scale can be found, since jumping is async     
-            await DocumentManager.Instance.jumpToDocument(targetDoc, true, openInTab, srcContext, undefined, undefined, undefined, includesDoc || tab ? undefined : resetSelection); // documents open in new tab instead of on right    
-        }
-        // After navigating to the document, if it is added as a presPinView then it will
-        // adjust the pan and scale to that of the pinView when it was added.
-        if (activeItem.presPinView) {
-            // if targetDoc is not displayed but one of its aliases is, then we need to modify that alias, not the original target
-            this.navigateToView(targetDoc, activeItem);
-        }
-        // TODO: Add progressivize for navigating web (storing websites for given frames)
-
-    }
-
-    /**
-     * Uses the viewfinder to progressivize through the different views of a single collection.
-     * @param presTargetDoc: document for which internal zoom is used
-     */
-    zoomProgressivizeNext = (activeItem: Doc) => {
-        const targetDoc: Doc = this.targetDoc;
-        const srcContext = Cast(targetDoc?.context, Doc, null);
-        const docView = DocumentManager.Instance.getDocumentView(targetDoc);
-        const vfLeft = this.checkList(targetDoc, activeItem["viewfinder-left-indexed"]);
-        const vfWidth = this.checkList(targetDoc, activeItem["viewfinder-width-indexed"]);
-        const vfTop = this.checkList(targetDoc, activeItem["viewfinder-top-indexed"]);
-        const vfHeight = this.checkList(targetDoc, activeItem["viewfinder-height-indexed"]);
-        // Case 1: document that is not a Golden Layout tab
-        if (srcContext) {
-            const srcDocView = DocumentManager.Instance.getDocumentView(srcContext);
-            if (srcDocView) {
-                const layoutdoc = Doc.Layout(targetDoc);
-                const panelWidth: number = srcDocView.props.PanelWidth();
-                const panelHeight: number = srcDocView.props.PanelHeight();
-                const newPanX = NumCast(targetDoc.x) + NumCast(layoutdoc._width) / 2;
-                const newPanY = NumCast(targetDoc.y) + NumCast(layoutdoc._height) / 2;
-                const newScale = 0.9 * Math.min(Number(panelWidth) / vfWidth, Number(panelHeight) / vfHeight);
-                srcContext._panX = newPanX + (vfLeft + (vfWidth / 2));
-                srcContext._panY = newPanY + (vfTop + (vfHeight / 2));
-                srcContext._viewScale = newScale;
-            }
-        }
-        // Case 2: document is the containing collection
-        if (docView && !srcContext) {
-            const panelWidth: number = docView.props.PanelWidth();
-            const panelHeight: number = docView.props.PanelHeight();
-            const newScale = 0.9 * Math.min(Number(panelWidth) / vfWidth, Number(panelHeight) / vfHeight);
-            targetDoc._panX = vfLeft + (vfWidth / 2);
-            targetDoc._panY = vfTop + (vfWidth / 2);
-            targetDoc._viewScale = newScale;
-        }
-        const resize = document.getElementById('resizable');
-        if (resize) {
-            resize.style.width = vfWidth + 'px';
-            resize.style.height = vfHeight + 'px';
-            resize.style.top = vfTop + 'px';
-            resize.style.left = vfLeft + 'px';
-        }
-    }
-
-    /**
-     * For 'Hide Before' and 'Hide After' buttons making sure that
-     * they are hidden each time the presentation is updated.
-     */
-    @action
-    onHideDocument = () => {
-        this.childDocs.forEach((doc, index) => {
-            const curDoc = Cast(doc, Doc, null);
-            const tagDoc = Cast(curDoc.presentationTargetDoc, Doc, null);
-            if (tagDoc) tagDoc.opacity = 1;
-            const itemIndexes: number[] = this.getAllIndexes(this.tagDocs, tagDoc);
-            const curInd: number = itemIndexes.indexOf(index);
-            if (tagDoc === this.layoutDoc.presCollection) { tagDoc.opacity = 1; }
-            else {
-                if (itemIndexes.length > 1 && curDoc.presHideBefore && curInd !== 0) { }
-                else if (curDoc.presHideBefore) {
-                    if (index > this.itemIndex) {
-                        tagDoc.opacity = 0;
-                    } else if (!curDoc.presHideAfter) {
-                        tagDoc.opacity = 1;
-                    }
-                }
-                if (itemIndexes.length > 1 && curDoc.presHideAfter && curInd !== (itemIndexes.length - 1)) { }
-                else if (curDoc.presHideAfter) {
-                    if (index < this.itemIndex) {
-                        tagDoc.opacity = 0;
-                    } else if (!curDoc.presHideBefore) {
-                        tagDoc.opacity = 1;
-                    }
-                }
-            }
-        });
-    }
-
-
-
-    //The function that starts or resets presentaton functionally, depending on presStatus of the layoutDoc
-    @action
-    startAutoPres = (startSlide: number) => {
-        this.updateCurrentPresentation();
-        let activeItem: Doc = this.activeItem;
-        let targetDoc: Doc = this.targetDoc;
-        let duration = NumCast(activeItem.presDuration) + NumCast(activeItem.presTransition);
-        const timer = (ms: number) => new Promise(res => this._presTimer = setTimeout(res, ms));
-        const load = async () => { // Wrap the loop into an async function for this to work
-            for (var i = startSlide; i < this.childDocs.length; i++) {
-                activeItem = Cast(this.childDocs[this.itemIndex], Doc, null);
-                targetDoc = Cast(activeItem.presentationTargetDoc, Doc, null);
-                duration = NumCast(activeItem.presDuration) + NumCast(activeItem.presTransition);
-                if (duration < 100) { duration = 2500; }
-                if (NumCast(targetDoc.lastFrame) > 0) {
-                    for (var f = 0; f < NumCast(targetDoc.lastFrame); f++) {
-                        await timer(duration / NumCast(targetDoc.lastFrame));
-                        this.next();
-                    }
-                }
-
-                await timer(duration); this.next(); // then the created Promise can be awaited
-                if (i === this.childDocs.length - 1) {
-                    setTimeout(() => {
-                        clearTimeout(this._presTimer);
-                        if (this.layoutDoc.presStatus === 'auto' && !this.layoutDoc.presLoop) this.layoutDoc.presStatus = PresStatus.Manual;
-                        else if (this.layoutDoc.presLoop) this.startAutoPres(0);
-                    }, duration);
-                }
-            }
-        };
-        this.layoutDoc.presStatus = PresStatus.Autoplay;
-        this.startPresentation(startSlide);
-        this.gotoDocument(startSlide, activeItem);
-        load();
-    }
-
-    @action
-    pauseAutoPres = () => {
-        if (this.layoutDoc.presStatus === PresStatus.Autoplay) {
-            if (this._presTimer) clearTimeout(this._presTimer);
-            this.layoutDoc.presStatus = PresStatus.Manual;
-            this.layoutDoc.presLoop = false;
-            this.childDocs.forEach(this.stopTempMedia);
-        }
-    }
-
-    //The function that resets the presentation by removing every action done by it. It also
-    //stops the presentaton.
-    resetPresentation = () => {
-        this.rootDoc._itemIndex = 0;
-        this.childDocs.map(doc => Cast(doc.presentationTargetDoc, Doc, null)).filter(doc => doc instanceof Doc).forEach(doc => {
-            try {
-                doc.opacity = 1;
-            } catch (e) {
-                console.log("Reset presentation error: ", e);
-            }
-        });
-    }
-
-    @action togglePath = (srcContext: Doc, off?: boolean) => {
-        if (off) {
-            this._pathBoolean = false;
-            srcContext.presPathView = false;
-        } else {
-            runInAction(() => this._pathBoolean = !this._pathBoolean);
-            srcContext.presPathView = this._pathBoolean;
-        }
-    }
-
-    @action toggleExpandMode = () => {
-        runInAction(() => this._expandBoolean = !this._expandBoolean);
-        this.rootDoc.expandBoolean = this._expandBoolean;
-        this.childDocs.forEach((doc) => {
-            doc.presExpandInlineButton = this._expandBoolean;
-        });
-    }
-
-    /**
-     * The function that starts the presentation at the given index, also checking if actions should be applied
-     * directly at start.
-     * @param startIndex: index that the presentation will start at
-     */
-    startPresentation = (startIndex: number) => {
-        this.updateCurrentPresentation();
-        this.childDocs.map(doc => {
-            const tagDoc = doc.presentationTargetDoc as Doc;
-            if (doc.presHideBefore && this.childDocs.indexOf(doc) > startIndex) {
-                tagDoc.opacity = 0;
-            }
-            if (doc.presHideAfter && this.childDocs.indexOf(doc) < startIndex) {
-                tagDoc.opacity = 0;
-            }
-        });
-    }
-
-    /**
-     * The method called to open the presentation as a minimized view
-     */
-    @action
-    updateMinimize = () => {
-        const docView = DocumentManager.Instance.getDocumentView(this.layoutDoc);
-        if (CurrentUserUtils.OverlayDocs.includes(this.layoutDoc)) {
-            console.log("case 1");
-            this.layoutDoc.presStatus = PresStatus.Edit;
-            Doc.RemoveDocFromList((Doc.UserDoc().myOverlayDocs as Doc), undefined, this.rootDoc);
-            CollectionDockingView.AddSplit(this.rootDoc, "right");
-        } else if (this.layoutDoc.context && docView) {
-            console.log("case 2");
-            this.layoutDoc.presStatus = PresStatus.Edit;
-            clearTimeout(this._presTimer);
-            const pt = this.props.ScreenToLocalTransform().inverse().transformPoint(0, 0);
-            this.rootDoc.x = pt[0] + (this.props.PanelWidth() - 250);
-            this.rootDoc.y = pt[1] + 10;
-            this.rootDoc._height = 35;
-            this.rootDoc._width = 250;
-            docView.props.removeDocument?.(this.layoutDoc);
-            Doc.AddDocToList((Doc.UserDoc().myOverlayDocs as Doc), undefined, this.rootDoc);
-        } else {
-            console.log("case 3");
-            // TODO glr: fix this case
-        }
-    }
-
-    /**
-     * Called when the user changes the view type
-     * Either 'List' (stacking) or 'Slides' (carousel)
-     */
-    // @undoBatch
-    viewChanged = action((e: React.ChangeEvent) => {
-        //@ts-ignore
-        const viewType = e.target.selectedOptions[0].value as CollectionViewType;
-        // pivot field may be set by the user in timeline view (or some other way) -- need to reset it here
-        viewType === CollectionViewType.Stacking && (this.rootDoc._pivotField = undefined);
-        this.rootDoc._viewType = viewType;
-        if (viewType === CollectionViewType.Stacking) this.layoutDoc._gridGap = 0;
-    });
-
-    /**
-     * Called when the user changes the view type
-     * Either 'List' (stacking) or 'Slides' (carousel)
-     */
-    // @undoBatch
-    mediaStopChanged = action((e: React.ChangeEvent) => {
-        const activeItem: Doc = this.activeItem;
-        //@ts-ignore
-        const stopDoc = e.target.selectedOptions[0].value as string;
-        const stopDocIndex: number = Number(stopDoc[0]);
-        activeItem.mediaStopDoc = stopDocIndex;
-        if (this.childDocs[stopDocIndex - 1].mediaStopTriggerList) {
-            const list = DocListCast(this.childDocs[stopDocIndex - 1].mediaStopTriggerList);
-            list.push(activeItem);
-            // this.childDocs[stopDocIndex - 1].mediaStopTriggerList = list;
-            console.log(list);
-        } else {
-            this.childDocs[stopDocIndex - 1].mediaStopTriggerList = new List<Doc>();
-            const list = DocListCast(this.childDocs[stopDocIndex - 1].mediaStopTriggerList);
-            list.push(activeItem);
-            // this.childDocs[stopDocIndex - 1].mediaStopTriggerList = list;
-            console.log(list);
-        }
-    });
-
-
-    setMovementName = action((movement: any, activeItem: Doc): string => {
-        let output: string = 'none';
-        switch (movement) {
-            case PresMovement.Zoom: output = 'Pan & Zoom'; break; //Pan and zoom
-            case PresMovement.Pan: output = 'Pan'; break; //Pan
-            case PresMovement.Jump: output = 'Jump cut'; break; //Jump Cut
-            case PresMovement.None: output = 'None'; break; //None
-            default: output = 'Zoom'; activeItem.presMovement = 'zoom'; break; //default set as zoom
-        }
-        return output;
-    });
-
-    whenChildContentsActiveChanged = action((isActive: boolean) => this.props.whenChildContentsActiveChanged(this._isChildActive = isActive));
-    // For dragging documents into the presentation trail
-    addDocumentFilter = (docs: Doc[]) => {
-        docs.forEach((doc, i) => {
-            if (doc.presentationTargetDoc) return true;
-            if (doc.type === DocumentType.LABEL) {
-                const audio = Cast(doc.annotationOn, Doc, null);
-                if (audio) {
-                    audio.mediaStart = "manual";
-                    audio.mediaStop = "manual";
-                    audio.presStartTime = NumCast(doc._timecodeToShow /* audioStart */, NumCast(doc._timecodeToShow /* videoStart */));
-                    audio.presEndTime = NumCast(doc._timecodeToHide /* audioEnd */, NumCast(doc._timecodeToHide /* videoEnd */));
-                    audio.presDuration = audio.presStartTime - audio.presEndTime;
-                    TabDocView.PinDoc(audio, { audioRange: true });
-                    setTimeout(() => this.removeDocument(doc), 0);
-                    return false;
-                }
-            } else {
-                if (!doc.aliasOf) {
-                    const original = Doc.MakeAlias(doc);
-                    TabDocView.PinDoc(original);
-                    setTimeout(() => this.removeDocument(doc), 0);
-                    return false;
-                } else {
-                    if (!doc.presentationTargetDoc) doc.title = doc.title + " - Slide";
-                    doc.aliasOf instanceof Doc && (doc.presentationTargetDoc = doc.aliasOf);
-                    doc.presMovement = PresMovement.Zoom;
-                    if (this._expandBoolean) doc.presExpandInlineButton = true;
-                }
-            }
-        });
-        return true;
-    }
-    childLayoutTemplate = () => this.rootDoc._viewType !== CollectionViewType.Stacking ? undefined : this.presElement;
-    removeDocument = (doc: Doc) => Doc.RemoveDocFromList(this.dataDoc, this.fieldKey, doc);
-    getTransform = () => this.props.ScreenToLocalTransform().translate(-5, -65);// listBox padding-left and pres-box-cont minHeight
-    panelHeight = () => this.props.PanelHeight() - 40;
-    isContentActive = (outsideReaction?: boolean) => ((CurrentUserUtils.SelectedTool === InkTool.None && this.props.layerProvider?.(this.layoutDoc) !== false) &&
-        (this.layoutDoc.forceActive || this.props.isSelected(outsideReaction) || this._isChildActive || this.props.renderDepth === 0) ? true : false)
-
-    /**
-     * For sorting the array so that the order is maintained when it is dropped.
-     */
-    @action
-    sortArray = (): Doc[] => {
-        return this.childDocs.filter(doc => this._selectedArray.has(doc));
-    }
-
-    /**
-     * Method to get the list of selected items in the order in which they have been selected
-     */
-    @computed get listOfSelected() {
-        const list = Array.from(this._selectedArray.keys()).map((doc: Doc, index: any) => {
-            const curDoc = Cast(doc, Doc, null);
-            const tagDoc = Cast(curDoc.presentationTargetDoc, Doc, null);
-            if (curDoc && curDoc === this.activeItem) return <div key={index} className="selectedList-items"><b>{index + 1}.  {curDoc.title}</b></div>;
-            else if (tagDoc) return <div key={index} className="selectedList-items">{index + 1}.  {curDoc.title}</div>;
-            else if (curDoc) return <div key={index} className="selectedList-items">{index + 1}.  {curDoc.title}</div>;
-        });
-        return list;
-    }
-
-    @action
-    selectPres = () => {
-        const presDocView = DocumentManager.Instance.getDocumentView(this.rootDoc);
-        presDocView && SelectionManager.SelectView(presDocView, false);
-    }
-
-    //Regular click
-    @action
-    selectElement = async (doc: Doc) => {
-        const context = Cast(doc.context, Doc, null);
-        this.gotoDocument(this.childDocs.indexOf(doc), this.activeItem);
-        if (doc.presPinView || doc.presentationTargetDoc === this.layoutDoc.presCollection) setTimeout(() => this.updateCurrentPresentation(context), 0);
-        else this.updateCurrentPresentation(context);
-
-        if (this.activeItem.setPosition &&
-            this.activeItem.y !== undefined &&
-            this.activeItem.x !== undefined &&
-            this.targetDoc.x !== undefined &&
-            this.targetDoc.y !== undefined) {
-            const timer = (ms: number) => new Promise(res => this._presTimer = setTimeout(res, ms));
-            const time = 10;
-            const ydiff = NumCast(this.activeItem.y) - NumCast(this.targetDoc.y);
-            const xdiff = NumCast(this.activeItem.x) - NumCast(this.targetDoc.x);
-
-            for (let i = 0; i < time; i++) {
-                this.targetDoc.x = NumCast(this.targetDoc.x) + xdiff / time;
-                this.targetDoc.y = NumCast(this.targetDoc.y) + ydiff / time;
-                await timer(0.1);
-            }
-        }
-    }
-
-    //Command click
-    @action
-    multiSelect = (doc: Doc, ref: HTMLElement, drag: HTMLElement) => {
-        if (!this._selectedArray.has(doc)) {
-            this._selectedArray.set(doc, undefined);
-            this._eleArray.push(ref);
-            this._dragArray.push(drag);
-        } else {
-            this._selectedArray.delete(doc);
-            this.removeFromArray(this._eleArray, doc);
-            this.removeFromArray(this._dragArray, doc);
-        }
-        this.selectPres();
-    }
-
-    removeFromArray = (arr: any[], val: any) => {
-        const index: number = arr.indexOf(val);
-        const ret: any[] = arr.splice(index, 1);
-        arr = ret;
-    }
-
-    //Shift click
-    @action
-    shiftSelect = (doc: Doc, ref: HTMLElement, drag: HTMLElement) => {
-        this._selectedArray.clear();
-        // const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null);
-        if (this.activeItem) {
-            for (let i = Math.min(this.itemIndex, this.childDocs.indexOf(doc)); i <= Math.max(this.itemIndex, this.childDocs.indexOf(doc)); i++) {
-                this._selectedArray.set(this.childDocs[i], undefined);
-                this._eleArray.push(ref);
-                this._dragArray.push(drag);
-            }
-        }
-        this.selectPres();
-    }
-
-    //regular click
-    @action
-    regularSelect = (doc: Doc, ref: HTMLElement, drag: HTMLElement, focus: boolean) => {
-        this._selectedArray.clear();
-        this._selectedArray.set(doc, undefined);
-        this._eleArray.splice(0, this._eleArray.length, ref);
-        this._dragArray.splice(0, this._dragArray.length, drag);
-        focus && this.selectElement(doc);
-        this.selectPres();
-    }
-
-    modifierSelect = (doc: Doc, ref: HTMLElement, drag: HTMLElement, focus: boolean, cmdClick: boolean, shiftClick: boolean) => {
-        if (cmdClick) this.multiSelect(doc, ref, drag);
-        else if (shiftClick) this.shiftSelect(doc, ref, drag);
-        else this.regularSelect(doc, ref, drag, focus);
-    }
-
-    static keyEventsWrapper = (e: KeyboardEvent) => {
-        PresBox.Instance.keyEvents(e);
-    }
-
-    // Key for when the presentaiton is active
-    @action
-    keyEvents = (e: KeyboardEvent) => {
-        if (e.target instanceof HTMLInputElement) return;
-        let handled = false;
-        const anchorNode = document.activeElement as HTMLDivElement;
-        if (anchorNode && anchorNode.className?.includes("lm_title")) return;
-        switch (e.key) {
-            case "Backspace":
-                if (this.layoutDoc.presStatus === "edit") {
-                    undoBatch(action(() => {
-                        for (const doc of Array.from(this._selectedArray.keys())) {
-                            this.removeDocument(doc);
-                        }
-                        this._selectedArray.clear();
-                        this._eleArray.length = 0;
-                        this._dragArray.length = 0;
-                    }))();
-                    handled = true;
-                }
-                break;
-            case "Escape":
-                if (CurrentUserUtils.OverlayDocs.includes(this.layoutDoc)) { this.updateMinimize(); }
-                else if (this.layoutDoc.presStatus === "edit") { this._selectedArray.clear(); this._eleArray.length = this._dragArray.length = 0; }
-                else this.layoutDoc.presStatus = "edit";
-                if (this._presTimer) clearTimeout(this._presTimer);
-                handled = true;
-                break;
-            case "Down": case "ArrowDown":
-            case "Right": case "ArrowRight":
-                if (e.shiftKey && this.itemIndex < this.childDocs.length - 1) { // TODO: update to work properly
-                    this.rootDoc._itemIndex = NumCast(this.rootDoc._itemIndex) + 1;
-                    this._selectedArray.set(this.childDocs[this.rootDoc._itemIndex], undefined);
-                } else {
-                    this.next();
-                    if (this._presTimer) { clearTimeout(this._presTimer); this.layoutDoc.presStatus = PresStatus.Manual; }
-                }
-                handled = true;
-                break;
-            case "Up": case "ArrowUp":
-            case "Left": case "ArrowLeft":
-                if (e.shiftKey && this.itemIndex !== 0) { // TODO: update to work properly
-                    this.rootDoc._itemIndex = NumCast(this.rootDoc._itemIndex) - 1;
-                    this._selectedArray.set(this.childDocs[this.rootDoc._itemIndex], undefined);
-                } else {
-                    this.back();
-                    if (this._presTimer) { clearTimeout(this._presTimer); this.layoutDoc.presStatus = PresStatus.Manual; }
-                }
-                handled = true;
-                break;
-            case "Spacebar": case " ":
-                if (this.layoutDoc.presStatus === PresStatus.Manual) this.startAutoPres(this.itemIndex);
-                else if (this.layoutDoc.presStatus === PresStatus.Autoplay) if (this._presTimer) clearTimeout(this._presTimer);
-                handled = true;
-                break;
-            case "a":
-                if ((e.metaKey || e.altKey) && this.layoutDoc.presStatus === "edit") {
-                    this._selectedArray.clear();
-                    this.childDocs.forEach(doc => this._selectedArray.set(doc, undefined));
-                    handled = true;
-                }
-            default:
-                break;
-        }
-        if (handled) {
-            e.stopPropagation();
-            e.preventDefault();
-        }
-    }
-
-    /**
-     * 
-     */
-    @action
-    viewPaths = () => {
-        const srcContext = Cast(this.rootDoc.presCollection, Doc, null);
-        if (srcContext) {
-            this.togglePath(srcContext);
-        }
-    }
-
-    getAllIndexes = (arr: Doc[], val: Doc): number[] => {
-        const indexes = [];
-        for (let i = 0; i < arr.length; i++) {
-            arr[i] === val && indexes.push(i);
-        }
-        return indexes;
-    }
-
-    // Adds the index in the pres path graphically
-    @computed get order() {
-        const order: JSX.Element[] = [];
-        const docs: Doc[] = [];
-        const presCollection = Cast(this.rootDoc.presCollection, Doc, null);
-        const dv = DocumentManager.Instance.getDocumentView(presCollection);
-        this.childDocs.filter(doc => Cast(doc.presentationTargetDoc, Doc, null)).forEach((doc, index) => {
-            const tagDoc = Cast(doc.presentationTargetDoc, Doc, null);
-            const srcContext = Cast(tagDoc.context, Doc, null);
-            const width = NumCast(tagDoc._width) / 10;
-            const height = Math.max(NumCast(tagDoc._height) / 10, 15);
-            const edge = Math.max(width, height);
-            const fontSize = edge * 0.8;
-            const gap = 2;
-            if (presCollection === srcContext) {
-                // Case A: Document is contained within the collection
-                if (docs.includes(tagDoc)) {
-                    const prevOccurances: number = this.getAllIndexes(docs, tagDoc).length;
-                    docs.push(tagDoc);
-                    order.push(
-                        <div className="pathOrder"
-                            key={tagDoc.id + 'pres' + index}
-                            style={{ top: NumCast(tagDoc.y) + (prevOccurances * (edge + gap) - (edge / 2)), left: NumCast(tagDoc.x) - (edge / 2), width: edge, height: edge, fontSize: fontSize }}
-                            onClick={() => this.selectElement(doc)}>
-                            <div className="pathOrder-frame">{index + 1}</div>
-                        </div>);
-                } else {
-                    docs.push(tagDoc);
-                    order.push(
-                        <div className="pathOrder"
-                            key={tagDoc.id + 'pres' + index}
-                            style={{ top: NumCast(tagDoc.y) - (edge / 2), left: NumCast(tagDoc.x) - (edge / 2), width: edge, height: edge, fontSize: fontSize }}
-                            onClick={() => this.selectElement(doc)}>
-                            <div className="pathOrder-frame">{index + 1}</div>
-                        </div>);
-                }
-            } else if (doc.presPinView && presCollection === tagDoc && dv) {
-                // Case B: Document is presPinView and is presCollection
-                const scale: number = 1 / NumCast(doc.presPinViewScale);
-                const height: number = dv.props.PanelHeight() * scale;
-                const width: number = dv.props.PanelWidth() * scale;
-                const indWidth = width / 10;
-                const indHeight = Math.max(height / 10, 15);
-                const indEdge = Math.max(indWidth, indHeight);
-                const indFontSize = indEdge * 0.8;
-                const xLoc: number = NumCast(doc.presPinViewX) - (width / 2);
-                const yLoc: number = NumCast(doc.presPinViewY) - (height / 2);
-                docs.push(tagDoc);
-                order.push(
-                    <>
-                        <div className="pathOrder"
-                            key={tagDoc.id + 'pres' + index}
-                            style={{ top: yLoc - (indEdge / 2), left: xLoc - (indEdge / 2), width: indEdge, height: indEdge, fontSize: indFontSize }}
-                            onClick={() => this.selectElement(doc)}
-                        >
-                            <div className="pathOrder-frame">{index + 1}</div>
-                        </div>
-                        <div className="pathOrder-presPinView" style={{ top: yLoc, left: xLoc, width: width, height: height, borderWidth: indEdge / 10 }}></div>
-                    </>);
-            }
-        });
-        return order;
-    }
-
-    /**
-     * Method called for viewing paths which adds a single line with
-     * points at the center of each document added.
-     * Design choice: When this is called it sets _fitToBox as true so the
-     * user can have an overview of all of the documents in the collection.
-     * (Design needed for when documents in presentation trail are in another
-     * collection)
-     */
-    @computed get paths() {
-        let pathPoints = "";
-        const presCollection = Cast(this.rootDoc.presCollection, Doc, null);
-        this.childDocs.forEach((doc, index) => {
-            const tagDoc = Cast(doc.presentationTargetDoc, Doc, null);
-            const srcContext = Cast(tagDoc?.context, Doc, null);
-            if (tagDoc && presCollection === srcContext) {
-                const n1x = NumCast(tagDoc.x) + (NumCast(tagDoc._width) / 2);
-                const n1y = NumCast(tagDoc.y) + (NumCast(tagDoc._height) / 2);
-                if (index = 0) pathPoints = n1x + "," + n1y;
-                else pathPoints = pathPoints + " " + n1x + "," + n1y;
-            } else if (doc.presPinView && presCollection === tagDoc) {
-                const n1x = NumCast(doc.presPinViewX);
-                const n1y = NumCast(doc.presPinViewY);
-                if (index = 0) pathPoints = n1x + "," + n1y;
-                else pathPoints = pathPoints + " " + n1x + "," + n1y;
-            }
-        });
-        return (<polyline
-            points={pathPoints}
-            style={{
-                opacity: 1,
-                stroke: "#69a6db",
-                strokeWidth: 5,
-                strokeDasharray: '10 5',
-                boxShadow: '0px 4px 4px rgba(0, 0, 0, 0.25)',
-            }}
-            fill="none"
-            markerStart="url(#markerArrow)"
-            markerMid="url(#markerSquare)"
-            markerEnd="url(#markerSquareFilled)"
-        />);
-    }
-
-    // Converts seconds to ms and updates presTransition
-    setTransitionTime = (number: String, change?: number) => {
-        let timeInMS = Number(number) * 1000;
-        if (change) timeInMS += change;
-        if (timeInMS < 100) timeInMS = 100;
-        if (timeInMS > 10000) timeInMS = 10000;
-        Array.from(this._selectedArray.keys()).forEach((doc) => doc.presTransition = timeInMS);
-    }
-
-    // Converts seconds to ms and updates presDuration
-    setDurationTime = (number: String, change?: number) => {
-        let timeInMS = Number(number) * 1000;
-        if (change) timeInMS += change;
-        if (timeInMS < 100) timeInMS = 100;
-        if (timeInMS > 20000) timeInMS = 20000;
-        Array.from(this._selectedArray.keys()).forEach((doc) => doc.presDuration = timeInMS);
-    }
-
-    /**
-     * When the movement dropdown is changes
-     */
-    @undoBatch
-    updateMovement = action((movement: any, all?: boolean) => {
-        const array: any[] = all ? this.childDocs : Array.from(this._selectedArray.keys());
-        array.forEach((doc) => {
-            switch (movement) {
-                case PresMovement.Zoom: //Pan and zoom
-                    doc.presMovement = PresMovement.Zoom;
-                    break;
-                case PresMovement.Pan: //Pan
-                    doc.presMovement = PresMovement.Pan;
-                    break;
-                case PresMovement.Jump: //Jump Cut
-                    doc.presJump = true;
-                    doc.presMovement = PresMovement.Jump;
-                    break;
-                case PresMovement.None: default:
-                    doc.presMovement = PresMovement.None;
-                    break;
-            }
-        });
-    });
-
-    @undoBatch
-    @action
-    updateHideBefore = (activeItem: Doc) => {
-        activeItem.presHideBefore = !activeItem.presHideBefore;
-        Array.from(this._selectedArray.keys()).forEach((doc) => doc.presHideBefore = activeItem.presHideBefore);
-    }
-
-    @undoBatch
-    @action
-    updateHideAfter = (activeItem: Doc) => {
-        activeItem.presHideAfter = !activeItem.presHideAfter;
-        Array.from(this._selectedArray.keys()).forEach((doc) => doc.presHideAfter = activeItem.presHideAfter);
-    }
-
-    @undoBatch
-    @action
-    updateOpenDoc = (activeItem: Doc) => {
-        activeItem.openDocument = !activeItem.openDocument;
-        Array.from(this._selectedArray.keys()).forEach((doc) => {
-            doc.openDocument = activeItem.openDocument;
-        });
-    }
-
-    @undoBatch
-    @action
-    updateEffectDirection = (effect: any, all?: boolean) => {
-        const array: any[] = all ? this.childDocs : Array.from(this._selectedArray.keys());
-        array.forEach((doc) => {
-            const tagDoc = Cast(doc.presentationTargetDoc, Doc, null);
-            switch (effect) {
-                case PresEffect.Left:
-                    tagDoc.presEffectDirection = PresEffect.Left;
-                    break;
-                case PresEffect.Right:
-                    tagDoc.presEffectDirection = PresEffect.Right;
-                    break;
-                case PresEffect.Top:
-                    tagDoc.presEffectDirection = PresEffect.Top;
-                    break;
-                case PresEffect.Bottom:
-                    tagDoc.presEffectDirection = PresEffect.Bottom;
-                    break;
-                case PresEffect.Center: default:
-                    tagDoc.presEffectDirection = PresEffect.Center;
-                    break;
-            }
-        });
-    }
-
-    @undoBatch
-    @action
-    updateEffect = (effect: any, all?: boolean) => {
-        const array: any[] = all ? this.childDocs : Array.from(this._selectedArray.keys());
-        array.forEach((doc) => {
-            const tagDoc = Cast(doc.presentationTargetDoc, Doc, null);
-            switch (effect) {
-                case PresEffect.Bounce:
-                    tagDoc.presEffect = PresEffect.Bounce;
-                    break;
-                case PresEffect.Fade:
-                    tagDoc.presEffect = PresEffect.Fade;
-                    break;
-                case PresEffect.Flip:
-                    tagDoc.presEffect = PresEffect.Flip;
-                    break;
-                case PresEffect.Roll:
-                    tagDoc.presEffect = PresEffect.Roll;
-                    break;
-                case PresEffect.Rotate:
-                    tagDoc.presEffect = PresEffect.Rotate;
-                    break;
-                case PresEffect.None: default:
-                    tagDoc.presEffect = PresEffect.None;
-                    break;
-            }
-        });
-    }
-
-    _batch: UndoManager.Batch | undefined = undefined;
-
-    @computed get transitionDropdown() {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        const type = targetDoc.type;
-        const isPresCollection: boolean = (targetDoc === this.layoutDoc.presCollection);
-        const isPinWithView: boolean = BoolCast(activeItem.presPinView);
-        if (activeItem && targetDoc) {
-            const transitionSpeed = activeItem.presTransition ? NumCast(activeItem.presTransition) / 1000 : 0.5;
-            let duration = activeItem.presDuration ? NumCast(activeItem.presDuration) / 1000 : 2;
-            if (activeItem.type === DocumentType.AUDIO) duration = NumCast(activeItem.duration);
-            const effect = targetDoc.presEffect ? targetDoc.presEffect : 'None';
-            activeItem.presMovement = activeItem.presMovement ? activeItem.presMovement : 'Zoom';
-            return (
-                <div className={`presBox-ribbon ${this.transitionTools && this.layoutDoc.presStatus === PresStatus.Edit ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onClick={action(e => { e.stopPropagation(); this.openMovementDropdown = false; this.openEffectDropdown = false; })}>
-                    <div className="ribbon-box">
-                        Movement
-                        {isPresCollection || (isPresCollection && isPinWithView) ?
-                            <div className="ribbon-property" style={{ marginLeft: 0, height: 25, textAlign: 'left', paddingLeft: 5, paddingRight: 5, fontSize: 10 }}>
-                                {this.scrollable ? "Scroll to pinned view" : !isPinWithView ? "No movement" : "Pan & Zoom to pinned view"}
-                            </div>
-                            :
-                            <div className="presBox-dropdown" onClick={action(e => { e.stopPropagation(); this.openMovementDropdown = !this.openMovementDropdown; })} style={{ borderBottomLeftRadius: this.openMovementDropdown ? 0 : 5, border: this.openMovementDropdown ? `solid 2px ${PresColor.DarkBlue}` : 'solid 1px black' }}>
-                                {this.setMovementName(activeItem.presMovement, activeItem)}
-                                <FontAwesomeIcon className='presBox-dropdownIcon' style={{ gridColumn: 2, color: this.openMovementDropdown ? PresColor.DarkBlue : 'black' }} icon={"angle-down"} />
-                                <div className={'presBox-dropdownOptions'} id={'presBoxMovementDropdown'} onPointerDown={e => e.stopPropagation()} style={{ display: this.openMovementDropdown ? "grid" : "none" }}>
-                                    <div className={`presBox-dropdownOption ${activeItem.presMovement === PresMovement.None ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.None)}>None</div>
-                                    <div className={`presBox-dropdownOption ${activeItem.presMovement === PresMovement.Zoom ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.Zoom)}>Pan {"&"} Zoom</div>
-                                    <div className={`presBox-dropdownOption ${activeItem.presMovement === PresMovement.Pan ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.Pan)}>Pan</div>
-                                    <div className={`presBox-dropdownOption ${activeItem.presMovement === PresMovement.Jump ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.Jump)}>Jump cut</div>
-                                </div>
-                            </div>
-                        }
-                        <div className="ribbon-doubleButton" style={{ display: activeItem.presMovement === PresMovement.Pan || activeItem.presMovement === PresMovement.Zoom ? "inline-flex" : "none" }}>
-                            <div className="presBox-subheading">Movement Speed</div>
-                            <div className="ribbon-property">
-                                <input className="presBox-input"
-                                    type="number" value={transitionSpeed}
-                                    onChange={action((e) => this.setTransitionTime(e.target.value))} /> s
-                            </div>
-                            <div className="ribbon-propertyUpDown">
-                                <div className="ribbon-propertyUpDownItem" onClick={undoBatch(() => this.setTransitionTime(String(transitionSpeed), 1000))}>
-                                    <FontAwesomeIcon icon={"caret-up"} />
-                                </div>
-                                <div className="ribbon-propertyUpDownItem" onClick={undoBatch(() => this.setTransitionTime(String(transitionSpeed), -1000))}>
-                                    <FontAwesomeIcon icon={"caret-down"} />
-                                </div>
-                            </div>
-                        </div>
-                        <input type="range" step="0.1" min="0.1" max="10" value={transitionSpeed}
-                            className={`toolbar-slider ${activeItem.presMovement === PresMovement.Pan || activeItem.presMovement === PresMovement.Zoom ? "" : "none"}`}
-                            id="toolbar-slider"
-                            onPointerDown={() => this._batch = UndoManager.StartBatch("presTransition")}
-                            onPointerUp={() => this._batch?.end()}
-                            onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
-                                e.stopPropagation();
-                                this.setTransitionTime(e.target.value);
-                            }} />
-                        <div className={`slider-headers ${activeItem.presMovement === PresMovement.Pan || activeItem.presMovement === PresMovement.Zoom ? "" : "none"}`}>
-                            <div className="slider-text">Fast</div>
-                            <div className="slider-text">Medium</div>
-                            <div className="slider-text">Slow</div>
-                        </div>
-                    </div>
-                    <div className="ribbon-box">
-                        Visibility {"&"} Duration
-                        <div className="ribbon-doubleButton">
-                            {isPresCollection ? (null) : <Tooltip title={<><div className="dash-tooltip">{"Hide before presented"}</div></>}><div className={`ribbon-toggle ${activeItem.presHideBefore ? "active" : ""}`} onClick={() => this.updateHideBefore(activeItem)}>Hide before</div></Tooltip>}
-                            {isPresCollection ? (null) : <Tooltip title={<><div className="dash-tooltip">{"Hide after presented"}</div></>}><div className={`ribbon-toggle ${activeItem.presHideAfter ? "active" : ""}`} onClick={() => this.updateHideAfter(activeItem)}>Hide after</div></Tooltip>}
-                            <Tooltip title={<><div className="dash-tooltip">{"Open in lightbox view"}</div></>}><div className="ribbon-toggle" style={{ backgroundColor: activeItem.openDocument ? PresColor.LightBlue : "" }} onClick={() => this.updateOpenDoc(activeItem)}>Lightbox</div></Tooltip>
-                        </div>
-                        {(type === DocumentType.AUDIO || type === DocumentType.VID) ? (null) : <>
-                            <div className="ribbon-doubleButton" >
-                                <div className="presBox-subheading">Slide Duration</div>
-                                <div className="ribbon-property">
-                                    <input className="presBox-input"
-                                        type="number" value={duration}
-                                        onChange={action((e) => this.setDurationTime(e.target.value))} /> s
-                            </div>
-                                <div className="ribbon-propertyUpDown">
-                                    <div className="ribbon-propertyUpDownItem" onClick={undoBatch(() => this.setDurationTime(String(duration), 1000))}>
-                                        <FontAwesomeIcon icon={"caret-up"} />
-                                    </div>
-                                    <div className="ribbon-propertyUpDownItem" onClick={undoBatch(() => this.setDurationTime(String(duration), -1000))}>
-                                        <FontAwesomeIcon icon={"caret-down"} />
-                                    </div>
-                                </div>
-                            </div>
-                            <input type="range" step="0.1" min="0.1" max="20" value={duration}
-                                style={{ display: targetDoc.type === DocumentType.AUDIO ? "none" : "block" }}
-                                className={"toolbar-slider"} id="duration-slider"
-                                onPointerDown={() => { this._batch = UndoManager.StartBatch("presDuration"); }}
-                                onPointerUp={() => { if (this._batch) this._batch.end(); }}
-                                onChange={(e: React.ChangeEvent<HTMLInputElement>) => { e.stopPropagation(); this.setDurationTime(e.target.value); }}
-                            />
-                            <div className={"slider-headers"} style={{ display: targetDoc.type === DocumentType.AUDIO ? "none" : "grid" }}>
-                                <div className="slider-text">Short</div>
-                                <div className="slider-text">Medium</div>
-                                <div className="slider-text">Long</div>
-                            </div>
-                        </>}
-                    </div>
-                    {isPresCollection ? (null) : <div className="ribbon-box">
-                        Effects
-                        <div className="presBox-dropdown" onClick={action(e => { e.stopPropagation(); this.openEffectDropdown = !this.openEffectDropdown; })} style={{ borderBottomLeftRadius: this.openEffectDropdown ? 0 : 5, border: this.openEffectDropdown ? `solid 2px ${PresColor.DarkBlue}` : 'solid 1px black' }}>
-                            {effect}
-                            <FontAwesomeIcon className='presBox-dropdownIcon' style={{ gridColumn: 2, color: this.openEffectDropdown ? PresColor.DarkBlue : 'black' }} icon={"angle-down"} />
-                            <div className={'presBox-dropdownOptions'} id={'presBoxMovementDropdown'} style={{ display: this.openEffectDropdown ? "grid" : "none" }} onPointerDown={e => e.stopPropagation()}>
-                                <div className={`presBox-dropdownOption ${targetDoc.presEffect === PresEffect.None || !targetDoc.presEffect ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateEffect(PresEffect.None)}>None</div>
-                                <div className={`presBox-dropdownOption ${targetDoc.presEffect === PresEffect.Fade ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateEffect(PresEffect.Fade)}>Fade In</div>
-                                <div className={`presBox-dropdownOption ${targetDoc.presEffect === PresEffect.Flip ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateEffect(PresEffect.Flip)}>Flip</div>
-                                <div className={`presBox-dropdownOption ${targetDoc.presEffect === PresEffect.Rotate ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateEffect(PresEffect.Rotate)}>Rotate</div>
-                                <div className={`presBox-dropdownOption ${targetDoc.presEffect === PresEffect.Bounce ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateEffect(PresEffect.Bounce)}>Bounce</div>
-                                <div className={`presBox-dropdownOption ${targetDoc.presEffect === PresEffect.Roll ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateEffect(PresEffect.Roll)}>Roll</div>
-                            </div>
-                        </div>
-                        <div className="ribbon-doubleButton" style={{ display: effect === 'None' ? "none" : "inline-flex" }}>
-                            <div className="presBox-subheading" >Effect direction</div>
-                            <div className="ribbon-property">
-                                {this.effectDirection}
-                            </div>
-                        </div>
-                        <div className="effectDirection" style={{ display: effect === 'None' ? "none" : "grid", width: 40 }}>
-                            <Tooltip title={<><div className="dash-tooltip">{"Enter from left"}</div></>}><div style={{ gridColumn: 1, gridRow: 2, justifySelf: 'center', color: targetDoc.presEffectDirection === PresEffect.Left ? PresColor.LightBlue : "black", cursor: "pointer" }} onClick={() => this.updateEffectDirection(PresEffect.Left)}><FontAwesomeIcon icon={"angle-right"} /></div></Tooltip>
-                            <Tooltip title={<><div className="dash-tooltip">{"Enter from right"}</div></>}><div style={{ gridColumn: 3, gridRow: 2, justifySelf: 'center', color: targetDoc.presEffectDirection === PresEffect.Right ? PresColor.LightBlue : "black", cursor: "pointer" }} onClick={() => this.updateEffectDirection(PresEffect.Right)}><FontAwesomeIcon icon={"angle-left"} /></div></Tooltip>
-                            <Tooltip title={<><div className="dash-tooltip">{"Enter from top"}</div></>}><div style={{ gridColumn: 2, gridRow: 1, justifySelf: 'center', color: targetDoc.presEffectDirection === PresEffect.Top ? PresColor.LightBlue : "black", cursor: "pointer" }} onClick={() => this.updateEffectDirection(PresEffect.Top)}><FontAwesomeIcon icon={"angle-down"} /></div></Tooltip>
-                            <Tooltip title={<><div className="dash-tooltip">{"Enter from bottom"}</div></>}><div style={{ gridColumn: 2, gridRow: 3, justifySelf: 'center', color: targetDoc.presEffectDirection === PresEffect.Bottom ? PresColor.LightBlue : "black", cursor: "pointer" }} onClick={() => this.updateEffectDirection(PresEffect.Bottom)}><FontAwesomeIcon icon={"angle-up"} /></div></Tooltip>
-                            <Tooltip title={<><div className="dash-tooltip">{"Enter from center"}</div></>}><div style={{ gridColumn: 2, gridRow: 2, width: 10, height: 10, alignSelf: 'center', justifySelf: 'center', border: targetDoc.presEffectDirection === PresEffect.Center || !targetDoc.presEffectDirection ? `solid 2px ${PresColor.LightBlue}` : "solid 2px black", borderRadius: "100%", cursor: "pointer" }} onClick={() => this.updateEffectDirection(PresEffect.Center)}></div></Tooltip>
-                        </div>
-                    </div>}
-                    <div className="ribbon-final-box">
-                        <div className="ribbon-final-button-hidden" onClick={() => this.applyTo(this.childDocs)}>
-                            Apply to all
-                        </div>
-                    </div>
-                </div >
-            );
-        }
-    }
-
-    @computed get effectDirection(): string {
-        let effect = '';
-        switch (this.targetDoc.presEffectDirection) {
-            case 'left': effect = "Enter from left"; break;
-            case 'right': effect = "Enter from right"; break;
-            case 'top': effect = "Enter from top"; break;
-            case 'bottom': effect = "Enter from bottom"; break;
-            default: effect = "Enter from center"; break;
-        }
-        return effect;
-    }
-
-    @undoBatch
-    @action
-    applyTo = (array: Doc[]) => {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        this.updateMovement(activeItem.presMovement, true);
-        this.updateEffect(targetDoc.presEffect, true);
-        this.updateEffectDirection(targetDoc.presEffectDirection, true);
-        array.forEach((doc) => {
-            const curDoc = Cast(doc, Doc, null);
-            const tagDoc = Cast(curDoc.presentationTargetDoc, Doc, null);
-            if (tagDoc && targetDoc) {
-                curDoc.presTransition = activeItem.presTransition;
-                curDoc.presDuration = activeItem.presDuration;
-                curDoc.presHideBefore = activeItem.presHideBefore;
-                curDoc.presHideAfter = activeItem.presHideAfter;
-            }
-        });
-    }
-
-    @computed get presPinViewOptionsDropdown() {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        const presPinWithViewIcon = <img src="/assets/pinWithView.png" style={{ margin: "auto", width: 16, filter: 'invert(1)' }} />;
-        return (
-            <>
-                {this.panable || this.scrollable || this.targetDoc.type === DocumentType.COMPARISON ? 'Pinned view' : (null)}
-                <div className="ribbon-doubleButton">
-                    <Tooltip title={<><div className="dash-tooltip">{activeItem.presPinView ? "Turn off pin with view" : "Turn on pin with view"}</div></>}><div className="ribbon-toggle" style={{ width: 20, padding: 0, backgroundColor: activeItem.presPinView ? PresColor.LightBlue : "" }}
-                        onClick={() => {
-                            activeItem.presPinView = !activeItem.presPinView;
-                            targetDoc.presPinView = activeItem.presPinView;
-                            if (activeItem.presPinView) {
-                                if (targetDoc.type === DocumentType.PDF || targetDoc.type === DocumentType.RTF || targetDoc.type === DocumentType.WEB || targetDoc._viewType === CollectionViewType.Stacking) {
-                                    const scroll = targetDoc._scrollTop;
-                                    activeItem.presPinView = true;
-                                    activeItem.presPinViewScroll = scroll;
-                                } else if (targetDoc.type === DocumentType.VID) {
-                                    activeItem.presPinTimecode = targetDoc._currentTimecode;
-                                } else if ((targetDoc.type === DocumentType.COL && targetDoc._viewType === CollectionViewType.Freeform) || targetDoc.type === DocumentType.IMG) {
-                                    const x = targetDoc._panX;
-                                    const y = targetDoc._panY;
-                                    const scale = targetDoc._viewScale;
-                                    activeItem.presPinView = true;
-                                    activeItem.presPinViewX = x;
-                                    activeItem.presPinViewY = y;
-                                    activeItem.presPinViewScale = scale;
-                                } else if (targetDoc.type === DocumentType.COMPARISON) {
-                                    const width = targetDoc._clipWidth;
-                                    activeItem.presPinClipWidth = width;
-                                    activeItem.presPinView = true;
-                                }
-                            }
-                        }}>{presPinWithViewIcon}</div></Tooltip>
-                    {activeItem.presPinView ? <Tooltip title={<><div className="dash-tooltip">{"Update the pinned view with the view of the selected document"}</div></>}><div className="ribbon-button"
-                        onClick={() => {
-                            if (targetDoc.type === DocumentType.PDF || targetDoc.type === DocumentType.WEB || targetDoc.type === DocumentType.RTF) {
-                                const scroll = targetDoc._scrollTop;
-                                activeItem.presPinViewScroll = scroll;
-                            } else if (targetDoc.type === DocumentType.VID) {
-                                activeItem.presPinTimecode = targetDoc._currentTimecode;
-                            } else if (targetDoc.type === DocumentType.COMPARISON) {
-                                const clipWidth = targetDoc._clipWidth;
-                                activeItem.presPinClipWidth = clipWidth;
-                            } else {
-                                const x = targetDoc._panX;
-                                const y = targetDoc._panY;
-                                const scale = targetDoc._viewScale;
-                                activeItem.presPinViewX = x;
-                                activeItem.presPinViewY = y;
-                                activeItem.presPinViewScale = scale;
-                            }
-                        }}>Update</div></Tooltip> : (null)}
-                </div>
-            </>
-        );
-    }
-
-    @computed get panOptionsDropdown() {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        return (
-            <>
-                {this.panable ? <div style={{ display: activeItem.presPinView ? "block" : "none" }}>
-                    <div className="ribbon-doubleButton" style={{ marginRight: 10 }}>
-                        <div className="presBox-subheading">Pan X</div>
-                        <div className="ribbon-property" style={{ paddingRight: 0, paddingLeft: 0 }}>
-                            <input className="presBox-input"
-                                style={{ textAlign: 'left', width: 50 }}
-                                type="number" value={NumCast(activeItem.presPinViewX)}
-                                onChange={action((e: React.ChangeEvent<HTMLInputElement>) => { const val = e.target.value; activeItem.presPinViewX = Number(val); })} />
-                        </div>
-                    </div>
-                    <div className="ribbon-doubleButton" style={{ marginRight: 10 }}>
-                        <div className="presBox-subheading">Pan Y</div>
-                        <div className="ribbon-property" style={{ paddingRight: 0, paddingLeft: 0 }}>
-                            <input className="presBox-input"
-                                style={{ textAlign: 'left', width: 50 }}
-                                type="number" value={NumCast(activeItem.presPinViewY)}
-                                onChange={action((e: React.ChangeEvent<HTMLInputElement>) => { const val = e.target.value; activeItem.presPinViewY = Number(val); })} />
-                        </div>
-                    </div>
-                    <div className="ribbon-doubleButton" style={{ marginRight: 10 }}>
-                        <div className="presBox-subheading">Scale</div>
-                        <div className="ribbon-property" style={{ paddingRight: 0, paddingLeft: 0 }}>
-                            <input className="presBox-input"
-                                style={{ textAlign: 'left', width: 50 }}
-                                type="number" value={NumCast(activeItem.presPinViewScale)}
-                                onChange={action((e: React.ChangeEvent<HTMLInputElement>) => { const val = e.target.value; activeItem.presPinViewScale = Number(val); })} />
-                        </div>
-                    </div>
-                </div> : (null)}
-            </>
-        );
-    }
-
-    @computed get scrollOptionsDropdown() {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        return (
-            <>
-                {this.scrollable ? <div style={{ display: activeItem.presPinView ? "block" : "none" }}>
-                    <div className="ribbon-doubleButton" style={{ marginRight: 10 }}>
-                        <div className="presBox-subheading">Scroll</div>
-                        <div className="ribbon-property" style={{ paddingRight: 0, paddingLeft: 0 }}>
-                            <input className="presBox-input"
-                                style={{ textAlign: 'left', width: 50 }}
-                                type="number" value={NumCast(activeItem.presPinViewScroll)}
-                                onChange={action((e: React.ChangeEvent<HTMLInputElement>) => { const val = e.target.value; activeItem.presPinViewScroll = Number(val); })} />
-                        </div>
-                    </div>
-                </div> : (null)}
-            </>
-        );
-    }
-
-    @computed get mediaStopSlides() {
-        const activeItem: Doc = this.activeItem;
-        const list = this.childDocs.map((doc, i) => {
-            if (i > this.itemIndex) {
-                return (
-                    <option>{i + 1}. {doc.title}</option>
-                );
-            }
-        });
-        return (
-            list
-        );
-    }
-
-    @computed get mediaOptionsDropdown() {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        const duration = Math.round(NumCast(activeItem[`${Doc.LayoutFieldKey(activeItem)}-duration`]) * 10);
-        const mediaStopDocInd: number = NumCast(activeItem.mediaStopDoc);
-        const mediaStopDocStr: string = mediaStopDocInd ? mediaStopDocInd + ". " + this.childDocs[mediaStopDocInd - 1].title : "";
-        if (activeItem && targetDoc) {
-            return (
-                <div>
-                    <div className={'presBox-ribbon'} onClick={e => e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
-                        <div>
-                            <div className="ribbon-box">
-                                Start {"&"} End Time
-                                <div className={"slider-headers"}>
-                                    <div className="slider-block" >
-                                        <div className="slider-text" style={{ fontWeight: 500 }}>
-                                            Start time (s)
-                                        </div>
-                                        <div id={"startTime"} className="slider-number" style={{ backgroundColor: PresColor.LightBackground }}>
-                                            <input className="presBox-input"
-                                                style={{ textAlign: 'center', width: 30, height: 15, fontSize: 10 }}
-                                                type="number" value={NumCast(activeItem.presStartTime)}
-                                                onChange={action((e: React.ChangeEvent<HTMLInputElement>) => { activeItem.presStartTime = Number(e.target.value); })}
-                                            />
-                                        </div>
-                                    </div>
-                                    <div className="slider-block">
-                                        <div className="slider-text" style={{ fontWeight: 500 }}>
-                                            Duration (s)
-                                        </div>
-                                        <div className="slider-number" style={{ backgroundColor: PresColor.LightBlue }}>
-                                            {Math.round((NumCast(activeItem.presEndTime) - NumCast(activeItem.presStartTime)) * 10) / 10}
-                                        </div>
-                                    </div>
-                                    <div className="slider-block">
-                                        <div className="slider-text" style={{ fontWeight: 500 }}>
-                                            End time (s)
-                                        </div>
-                                        <div id={"endTime"} className="slider-number" style={{ backgroundColor: PresColor.LightBackground }}>
-                                            <input className="presBox-input"
-                                                style={{ textAlign: 'center', width: 30, height: 15, fontSize: 10 }}
-                                                type="number" value={NumCast(activeItem.presEndTime)}
-                                                onChange={action((e: React.ChangeEvent<HTMLInputElement>) => { activeItem.presEndTime = Number(e.target.value); })}
-                                            />
-                                        </div>
-                                    </div>
-                                </div>
-                                <div className="multiThumb-slider">
-                                    <input type="range" step="0.1" min="0" max={duration / 10} value={NumCast(activeItem.presEndTime)}
-                                        style={{ gridColumn: 1, gridRow: 1 }}
-                                        className={`toolbar-slider ${"end"}`}
-                                        id="toolbar-slider"
-                                        onPointerDown={() => {
-                                            this._batch = UndoManager.StartBatch("presEndTime");
-                                            const endBlock = document.getElementById("endTime");
-                                            if (endBlock) {
-                                                endBlock.style.color = PresColor.LightBackground;
-                                                endBlock.style.backgroundColor = PresColor.DarkBlue;
-                                            }
-                                        }}
-                                        onPointerUp={() => {
-                                            this._batch?.end();
-                                            const endBlock = document.getElementById("endTime");
-                                            if (endBlock) {
-                                                endBlock.style.color = "black";
-                                                endBlock.style.backgroundColor = PresColor.LightBackground;
-                                            }
-                                        }}
-                                        onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
-                                            e.stopPropagation();
-                                            activeItem.presEndTime = Number(e.target.value);
-                                        }} />
-                                    <input type="range" step="0.1" min="0" max={duration / 10} value={NumCast(activeItem.presStartTime)}
-                                        style={{ gridColumn: 1, gridRow: 1 }}
-                                        className={`toolbar-slider ${"start"}`}
-                                        id="toolbar-slider"
-                                        onPointerDown={() => {
-                                            this._batch = UndoManager.StartBatch("presStartTime");
-                                            const startBlock = document.getElementById("startTime");
-                                            if (startBlock) {
-                                                startBlock.style.color = PresColor.LightBackground;
-                                                startBlock.style.backgroundColor = PresColor.DarkBlue;
-                                            }
-                                        }}
-                                        onPointerUp={() => {
-                                            this._batch?.end();
-                                            const startBlock = document.getElementById("startTime");
-                                            if (startBlock) {
-                                                startBlock.style.color = "black";
-                                                startBlock.style.backgroundColor = PresColor.LightBackground;
-                                            }
-                                        }}
-                                        onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
-                                            e.stopPropagation();
-                                            activeItem.presStartTime = Number(e.target.value);
-                                        }} />
-                                </div>
-                                <div className={`slider-headers ${activeItem.presMovement === PresMovement.Pan || activeItem.presMovement === PresMovement.Zoom ? "" : "none"}`}>
-                                    <div className="slider-text">0 s</div>
-                                    <div className="slider-text"></div>
-                                    <div className="slider-text">{duration / 10} s</div>
-                                </div>
-                            </div>
-                            <div className="ribbon-final-box">
-                                Playback
-                                <div className="presBox-subheading">Start playing:</div>
-                                <div className="presBox-radioButtons">
-                                    <div className="checkbox-container">
-                                        <input className="presBox-checkbox"
-                                            type="checkbox"
-                                            onChange={() => activeItem.mediaStart = "manual"}
-                                            checked={activeItem.mediaStart === "manual"}
-                                        />
-                                        <div>On click</div>
-                                    </div>
-                                    <div className="checkbox-container">
-                                        <input className="presBox-checkbox"
-                                            type="checkbox"
-                                            onChange={() => activeItem.mediaStart = "auto"}
-                                            checked={activeItem.mediaStart === "auto"}
-                                        />
-                                        <div>Automatically</div>
-                                    </div>
-                                </div>
-                                <div className="presBox-subheading">Stop playing:</div>
-                                <div className="presBox-radioButtons">
-                                    <div className="checkbox-container">
-                                        <input className="presBox-checkbox"
-                                            type="checkbox"
-                                            onChange={() => activeItem.mediaStop = "manual"}
-                                            checked={activeItem.mediaStop === "manual"}
-                                        />
-                                        <div>At audio end time</div>
-                                    </div>
-                                    <div className="checkbox-container">
-                                        <input className="presBox-checkbox"
-                                            type="checkbox"
-                                            onChange={() => activeItem.mediaStop = "auto"}
-                                            checked={activeItem.mediaStop === "auto"}
-                                        />
-                                        <div>On slide change</div>
-                                    </div>
-                                    {/* <div className="checkbox-container">
-                                    <input className="presBox-checkbox"
-                                        type="checkbox"
-                                        onChange={() => activeItem.mediaStop = "afterSlide"}
-                                        checked={activeItem.mediaStop === "afterSlide"}
-                                    />
-                                    <div className="checkbox-dropdown">
-                                        After chosen slide
-                                        <select className="presBox-viewPicker"
-                                            style={{ opacity: activeItem.mediaStop === "afterSlide" && this.itemIndex !== this.childDocs.length - 1 ? 1 : 0.3 }}
-                                            onPointerDown={e => e.stopPropagation()}
-                                            onChange={this.mediaStopChanged}
-                                            value={mediaStopDocStr}>
-                                            {this.mediaStopSlides}
-                                        </select>
-                                    </div>
-                                </div> */}
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div >
-            );
-        }
-    }
-
-    @computed get newDocumentToolbarDropdown() {
-        return (
-            <div>
-                <div className={'presBox-toolbar-dropdown'} style={{ display: this.newDocumentTools && this.layoutDoc.presStatus === "edit" ? "inline-flex" : "none" }} onClick={e => e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
-                    <div className="layout-container" style={{ height: 'max-content' }}>
-                        <div className="layout" style={{ border: this.layout === 'blank' ? `solid 2px ${PresColor.DarkBlue}` : '' }} onClick={action(() => { this.layout = 'blank'; this.createNewSlide(this.layout); })} />
-                        <div className="layout" style={{ border: this.layout === 'title' ? `solid 2px ${PresColor.DarkBlue}` : '' }} onClick={action(() => { this.layout = 'title'; this.createNewSlide(this.layout); })}>
-                            <div className="title">Title</div>
-                            <div className="subtitle">Subtitle</div>
-                        </div>
-                        <div className="layout" style={{ border: this.layout === 'header' ? `solid 2px ${PresColor.DarkBlue}` : '' }} onClick={action(() => { this.layout = 'header'; this.createNewSlide(this.layout); })}>
-                            <div className="title" style={{ alignSelf: 'center', fontSize: 10 }}>Section header</div>
-                        </div>
-                        <div className="layout" style={{ border: this.layout === 'content' ? `solid 2px ${PresColor.DarkBlue}` : '' }} onClick={action(() => { this.layout = 'content'; this.createNewSlide(this.layout); })}>
-                            <div className="title" style={{ alignSelf: 'center' }}>Title</div>
-                            <div className="content">Text goes here</div>
-                        </div>
-                    </div>
-                </div>
-            </div >
-        );
-    }
-
-    @observable openLayouts: boolean = false;
-    @observable addFreeform: boolean = true;
-    @observable layout: string = "";
-    @observable title: string = "";
-
-    @computed get newDocumentDropdown() {
-        return (
-            <div>
-                <div className={"presBox-ribbon"} onClick={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
-                    <div className="ribbon-box">
-                        Slide Title: <br></br>
-                        <input className="ribbon-textInput" placeholder="..." type="text" name="fname"
-                            onChange={(e) => {
-                                e.stopPropagation();
-                                e.preventDefault();
-                                runInAction(() => this.title = e.target.value);
-                            }}>
-                        </input>
-                    </div>
-                    <div className="ribbon-box">
-                        Choose type:
-                        <div className="ribbon-doubleButton">
-                            <div title="Text" className={'ribbon-toggle'} style={{ background: this.addFreeform ? "" : PresColor.LightBlue }} onClick={action(() => this.addFreeform = !this.addFreeform)}>Text</div>
-                            <div title="Freeform" className={'ribbon-toggle'} style={{ background: this.addFreeform ? PresColor.LightBlue : "" }} onClick={action(() => this.addFreeform = !this.addFreeform)}>Freeform</div>
-                        </div>
-                    </div>
-                    <div className="ribbon-box" style={{ display: this.addFreeform ? "grid" : "none" }}>
-                        Preset layouts:
-                        <div className="layout-container" style={{ height: this.openLayouts ? 'max-content' : '75px' }}>
-                            <div className="layout" style={{ border: this.layout === 'blank' ? `solid 2px ${PresColor.DarkBlue}` : '' }} onClick={action(() => this.layout = 'blank')} />
-                            <div className="layout" style={{ border: this.layout === 'title' ? `solid 2px ${PresColor.DarkBlue}` : '' }} onClick={action(() => this.layout = 'title')}>
-                                <div className="title">Title</div>
-                                <div className="subtitle">Subtitle</div>
-                            </div>
-                            <div className="layout" style={{ border: this.layout === 'header' ? `solid 2px ${PresColor.DarkBlue}` : '' }} onClick={action(() => this.layout = 'header')}>
-                                <div className="title" style={{ alignSelf: 'center', fontSize: 10 }}>Section header</div>
-                            </div>
-                            <div className="layout" style={{ border: this.layout === 'content' ? `solid 2px ${PresColor.DarkBlue}` : '' }} onClick={action(() => this.layout = 'content')}>
-                                <div className="title" style={{ alignSelf: 'center' }}>Title</div>
-                                <div className="content">Text goes here</div>
-                            </div>
-                            <div className="layout" style={{ border: this.layout === 'twoColumns' ? `solid 2px ${PresColor.DarkBlue}` : '' }} onClick={action(() => this.layout = 'twoColumns')}>
-                                <div className="title" style={{ alignSelf: 'center', gridColumn: '1/3' }}>Title</div>
-                                <div className="content" style={{ gridColumn: 1, gridRow: 2 }}>Column one text</div>
-                                <div className="content" style={{ gridColumn: 2, gridRow: 2 }}>Column two text</div>
-                            </div>
-                        </div>
-                        <div className="open-layout" onClick={action(() => this.openLayouts = !this.openLayouts)}>
-                            <FontAwesomeIcon style={{ transition: 'all 0.3s', transform: this.openLayouts ? 'rotate(180deg)' : 'rotate(0deg)' }} icon={"caret-down"} size={"lg"} />
-                        </div>
-                    </div>
-                    <div className="ribbon-final-box">
-                        <div className={this.title !== "" && (this.addFreeform && this.layout !== "" || !this.addFreeform) ? "ribbon-final-button-hidden" : "ribbon-final-button"} onClick={() => this.createNewSlide(this.layout, this.title, this.addFreeform)}>
-                            Create New Slide
-                        </div>
-                    </div>
-                </div>
-            </div >
-        );
-    }
-
-    createNewSlide = (layout?: string, title?: string, freeform?: boolean) => {
-        let doc = undefined;
-        if (layout) doc = this.createTemplate(layout);
-        if (freeform && layout) doc = this.createTemplate(layout, title);
-        if (!freeform && !layout) doc = Docs.Create.TextDocument("", { _nativeWidth: 400, _width: 225, title: title });
-        if (doc) {
-            const presCollection = Cast(this.layoutDoc.presCollection, Doc, null);
-            const data = Cast(presCollection?.data, listSpec(Doc));
-            const presData = Cast(this.rootDoc.data, listSpec(Doc));
-            if (data && presData) {
-                data.push(doc);
-                TabDocView.PinDoc(doc);
-                this.gotoDocument(this.childDocs.length, this.activeItem);
-            } else {
-                this.props.addDocTab(doc, "add:right");
-            }
-        }
-    }
-
-    createTemplate = (layout: string, input?: string) => {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        let x = 0;
-        let y = 0;
-        if (activeItem && targetDoc) {
-            x = NumCast(targetDoc.x);
-            y = NumCast(targetDoc.y) + NumCast(targetDoc._height) + 20;
-        }
-        let doc = undefined;
-        const title = Docs.Create.TextDocument("Click to change title", { title: "Slide title", _width: 380, _height: 60, x: 10, y: 58, _fontSize: "24pt", });
-        const subtitle = Docs.Create.TextDocument("Click to change subtitle", { title: "Slide subtitle", _width: 380, _height: 50, x: 10, y: 118, _fontSize: "16pt" });
-        const header = Docs.Create.TextDocument("Click to change header", { title: "Slide header", _width: 380, _height: 65, x: 10, y: 80, _fontSize: "20pt" });
-        const contentTitle = Docs.Create.TextDocument("Click to change title", { title: "Slide title", _width: 380, _height: 60, x: 10, y: 10, _fontSize: "24pt" });
-        const content = Docs.Create.TextDocument("Click to change text", { title: "Slide text", _width: 380, _height: 145, x: 10, y: 70, _fontSize: "14pt" });
-        const content1 = Docs.Create.TextDocument("Click to change text", { title: "Column 1", _width: 185, _height: 140, x: 10, y: 80, _fontSize: "14pt" });
-        const content2 = Docs.Create.TextDocument("Click to change text", { title: "Column 2", _width: 185, _height: 140, x: 205, y: 80, _fontSize: "14pt" });
-        switch (layout) {
-            case 'blank':
-                doc = Docs.Create.FreeformDocument([], { title: input ? input : "Blank slide", _width: 400, _height: 225, x: x, y: y });
-                break;
-            case 'title':
-                doc = Docs.Create.FreeformDocument([title, subtitle], { title: input ? input : "Title slide", _width: 400, _height: 225, _fitToBox: true, x: x, y: y });
-                break;
-            case 'header':
-                doc = Docs.Create.FreeformDocument([header], { title: input ? input : "Section header", _width: 400, _height: 225, _fitToBox: true, x: x, y: y });
-                break;
-            case 'content':
-                doc = Docs.Create.FreeformDocument([contentTitle, content], { title: input ? input : "Title and content", _width: 400, _height: 225, _fitToBox: true, x: x, y: y });
-                break;
-            case 'twoColumns':
-                doc = Docs.Create.FreeformDocument([contentTitle, content1, content2], { title: input ? input : "Title and two columns", _width: 400, _height: 225, _fitToBox: true, x: x, y: y });
-                break;
-            default:
-                break;
-        }
-        return doc;
-    }
-
-    // Dropdown that appears when the user wants to begin presenting (either minimize or sidebar view)
-    @computed get presentDropdown() {
-        return (
-            <div className={`dropdown-play ${this.presentTools ? "active" : ""}`} onClick={e => e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
-                <div className="dropdown-play-button" onClick={undoBatch(action(() => { this.updateMinimize(); this.turnOffEdit(true); this.gotoDocument(this.itemIndex, this.activeItem); }))}>
-                    Mini-player
-                </div>
-                <div className="dropdown-play-button" onClick={undoBatch(action(() => { this.layoutDoc.presStatus = "manual"; this.turnOffEdit(true); this.gotoDocument(this.itemIndex, this.activeItem); }))}>
-                    Sidebar player
-                </div>
-            </div>
-        );
-    }
-
-    // Case in which the document has keyframes to navigate to next key frame
-    @action
-    nextKeyframe = (tagDoc: Doc, curDoc: Doc): void => {
-        const childDocs = DocListCast(tagDoc[Doc.LayoutFieldKey(tagDoc)]);
-        const currentFrame = Cast(tagDoc._currentFrame, "number", null);
-        if (currentFrame === undefined) {
-            tagDoc._currentFrame = 0;
-            // CollectionFreeFormDocumentView.setupScroll(tagDoc, 0);
-            // CollectionFreeFormDocumentView.setupKeyframes(childDocs, 0);
-        }
-        // if (tagDoc.editScrollProgressivize) CollectionFreeFormDocumentView.updateScrollframe(tagDoc, currentFrame);
-        CollectionFreeFormDocumentView.updateKeyframe(childDocs, currentFrame || 0, tagDoc);
-        tagDoc._currentFrame = Math.max(0, (currentFrame || 0) + 1);
-        tagDoc.lastFrame = Math.max(NumCast(tagDoc._currentFrame), NumCast(tagDoc.lastFrame));
-    }
-
-    @action
-    prevKeyframe = (tagDoc: Doc, actItem: Doc): void => {
-        const childDocs = DocListCast(tagDoc[Doc.LayoutFieldKey(tagDoc)]);
-        const currentFrame = Cast(tagDoc._currentFrame, "number", null);
-        if (currentFrame === undefined) {
-            tagDoc._currentFrame = 0;
-            // CollectionFreeFormDocumentView.setupKeyframes(childDocs, 0);
-        }
-        CollectionFreeFormDocumentView.gotoKeyframe(childDocs.slice());
-        tagDoc._currentFrame = Math.max(0, (currentFrame || 0) - 1);
-    }
-
-    /**
-     * Returns the collection type as a string for headers
-     */
-    @computed get stringType(): string {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        let type: string = '';
-        if (activeItem) {
-            switch (targetDoc.type) {
-                case DocumentType.PDF: type = "PDF"; break;
-                case DocumentType.RTF: type = "Text node"; break;
-                case DocumentType.COL: type = "Collection"; break;
-                case DocumentType.AUDIO: type = "Audio"; break;
-                case DocumentType.VID: type = "Video"; break;
-                case DocumentType.IMG: type = "Image"; break;
-                case DocumentType.WEB: type = "Web page"; break;
-                default: type = "Other node"; break;
-            }
-        }
-        return type;
-    }
-
-    @observable private openActiveColorPicker: boolean = false;
-    @observable private openViewedColorPicker: boolean = false;
-
-
-
-    @computed get progressivizeDropdown() {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        if (activeItem && targetDoc) {
-            const activeFontColor = targetDoc["pres-text-color"] ? StrCast(targetDoc["pres-text-color"]) : "Black";
-            const viewedFontColor = targetDoc["pres-text-viewed-color"] ? StrCast(targetDoc["pres-text-viewed-color"]) : "Black";
-            return (
-                <div>
-                    <div className={`presBox-ribbon ${this.progressivizeTools && this.layoutDoc.presStatus === "edit" ? "active" : ""}`} onClick={e => e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
-                        <div className="ribbon-box">
-                            {this.stringType} selected
-                            <div className="ribbon-doubleButton" style={{ borderTop: 'solid 1px darkgrey', display: (targetDoc.type === DocumentType.COL && targetDoc._viewType === 'freeform') || targetDoc.type === DocumentType.IMG || targetDoc.type === DocumentType.RTF ? "inline-flex" : "none" }}>
-                                <div className="ribbon-toggle" style={{ backgroundColor: activeItem.presProgressivize ? PresColor.LightBlue : "" }} onClick={this.progressivizeChild}>Contents</div>
-                                <div className="ribbon-toggle" style={{ opacity: activeItem.presProgressivize ? 1 : 0.4, backgroundColor: targetDoc.editProgressivize ? PresColor.LightBlue : "" }} onClick={this.editProgressivize}>Edit</div>
-                            </div>
-                            <div className="ribbon-doubleButton" style={{ display: activeItem.presProgressivize ? "inline-flex" : "none" }}>
-                                <div className="presBox-subheading">Active text color</div>
-                                <div className="ribbon-colorBox" style={{ backgroundColor: activeFontColor, height: 15, width: 15 }} onClick={action(() => { this.openActiveColorPicker = !this.openActiveColorPicker; })}>
-                                </div>
-                            </div>
-                            {this.activeColorPicker}
-                            <div className="ribbon-doubleButton" style={{ display: activeItem.presProgressivize ? "inline-flex" : "none" }}>
-                                <div className="presBox-subheading">Viewed font color</div>
-                                <div className="ribbon-colorBox" style={{ backgroundColor: viewedFontColor, height: 15, width: 15 }} onClick={action(() => this.openViewedColorPicker = !this.openViewedColorPicker)}>
-                                </div>
-                            </div>
-                            {this.viewedColorPicker}
-                            <div className="ribbon-doubleButton" style={{ borderTop: 'solid 1px darkgrey', display: (targetDoc.type === DocumentType.COL && targetDoc._viewType === 'freeform') || targetDoc.type === DocumentType.IMG ? "inline-flex" : "none" }}>
-                                <div className="ribbon-toggle" style={{ backgroundColor: activeItem.zoomProgressivize ? PresColor.LightBlue : "" }} onClick={this.progressivizeZoom}>Zoom</div>
-                                <div className="ribbon-toggle" style={{ opacity: activeItem.zoomProgressivize ? 1 : 0.4, backgroundColor: activeItem.editZoomProgressivize ? PresColor.LightBlue : "" }} onClick={this.editZoomProgressivize}>Edit</div>
-                            </div>
-                            <div className="ribbon-doubleButton" style={{ borderTop: 'solid 1px darkgrey', display: targetDoc._viewType === "stacking" || targetDoc.type === DocumentType.PDF || targetDoc.type === DocumentType.WEB || targetDoc.type === DocumentType.RTF ? "inline-flex" : "none" }}>
-                                <div className="ribbon-toggle" style={{ backgroundColor: activeItem.scrollProgressivize ? PresColor.LightBlue : "" }} onClick={this.progressivizeScroll}>Scroll</div>
-                                <div className="ribbon-toggle" style={{ opacity: activeItem.scrollProgressivize ? 1 : 0.4, backgroundColor: targetDoc.editScrollProgressivize ? PresColor.LightBlue : "" }} onClick={this.editScrollProgressivize}>Edit</div>
-                            </div>
-                        </div>
-                        <div className="ribbon-final-box">
-                            Frames
-                            <div className="ribbon-doubleButton">
-                                <div className="ribbon-frameSelector">
-                                    <div key="back" title="back frame" className="backKeyframe" onClick={e => { e.stopPropagation(); this.prevKeyframe(targetDoc, activeItem); }}>
-                                        <FontAwesomeIcon icon={"caret-left"} size={"lg"} />
-                                    </div>
-                                    <div key="num" title="toggle view all" className="numKeyframe" style={{ color: targetDoc.keyFrameEditing ? "white" : "black", backgroundColor: targetDoc.keyFrameEditing ? PresColor.DarkBlue : PresColor.LightBlue }}
-                                        onClick={action(() => targetDoc.keyFrameEditing = !targetDoc.keyFrameEditing)} >
-                                        {NumCast(targetDoc._currentFrame)}
-                                    </div>
-                                    <div key="fwd" title="forward frame" className="fwdKeyframe" onClick={e => { e.stopPropagation(); this.nextKeyframe(targetDoc, activeItem); }}>
-                                        <FontAwesomeIcon icon={"caret-right"} size={"lg"} />
-                                    </div>
-                                </div>
-                                <Tooltip title={<><div className="dash-tooltip">{"Last frame"}</div></>}><div className="ribbon-property">{NumCast(targetDoc.lastFrame)}</div></Tooltip>
-                            </div>
-                            <div className="ribbon-frameList">
-                                {this.frameListHeader}
-                                {this.frameList}
-                            </div>
-                            <div className="ribbon-toggle" style={{ height: 20, backgroundColor: PresColor.LightBlue }} onClick={() => console.log(" TODO: play frames")}>Play</div>
-                        </div>
-                    </div>
-                </div>
-            );
-        }
-    }
-
-    @undoBatch
-    @action
-    switchActive = (color: ColorState) => {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        const val = String(color.hex);
-        targetDoc["pres-text-color"] = val;
-        return true;
-    }
-    @undoBatch
-    @action
-    switchPresented = (color: ColorState) => {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        const val = String(color.hex);
-        targetDoc["pres-text-viewed-color"] = val;
-        return true;
-    }
-
-    @computed get activeColorPicker() {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        return !this.openActiveColorPicker ? (null) : <SketchPicker onChange={this.switchActive}
-            presetColors={['#D0021B', '#F5A623', '#F8E71C', '#8B572A', '#7ED321', '#417505',
-                '#9013FE', '#4A90E2', '#50E3C2', '#B8E986', '#000000', '#4A4A4A', '#9B9B9B',
-                '#FFFFFF', '#f1efeb', 'transparent']}
-            color={StrCast(targetDoc["pres-text-color"])} />;
-    }
-
-    @computed get viewedColorPicker() {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        return !this.openViewedColorPicker ? (null) : <SketchPicker onChange={this.switchPresented}
-            presetColors={['#D0021B', '#F5A623', '#F8E71C', '#8B572A', '#7ED321', '#417505',
-                '#9013FE', '#4A90E2', '#50E3C2', '#B8E986', '#000000', '#4A4A4A', '#9B9B9B',
-                '#FFFFFF', '#f1efeb', 'transparent']}
-            color={StrCast(targetDoc["pres-text-viewed-color"])} />;
-    }
-
-    @action
-    turnOffEdit = (paths?: boolean) => {
-        // Turn off paths
-        if (paths) {
-            const srcContext = Cast(this.rootDoc.presCollection, Doc, null);
-            if (srcContext) this.togglePath(srcContext, true);
-        }
-        // Turn off the progressivize editors for each document
-        this.childDocs.forEach((doc) => {
-            doc.editSnapZoomProgressivize = false;
-            doc.editZoomProgressivize = false;
-            const targetDoc = Cast(doc.presentationTargetDoc, Doc, null);
-            if (targetDoc) {
-                targetDoc.editZoomProgressivize = false;
-                // targetDoc.editScrollProgressivize = false;
-            }
-        });
-    }
-
-    //Toggle whether the user edits or not
-    @action
-    editZoomProgressivize = (e: React.MouseEvent) => {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        if (!targetDoc.editZoomProgressivize) {
-            if (!activeItem.zoomProgressivize) activeItem.zoomProgressivize = true; targetDoc.zoomProgressivize = true;
-            targetDoc.editZoomProgressivize = true;
-            activeItem.editZoomProgressivize = true;
-        } else {
-            targetDoc.editZoomProgressivize = false;
-            activeItem.editZoomProgressivize = false;
-        }
-    }
-
-    //Toggle whether the user edits or not
-    @action
-    editScrollProgressivize = (e: React.MouseEvent) => {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        if (!targetDoc.editScrollProgressivize) {
-            if (!targetDoc.scrollProgressivize) { targetDoc.scrollProgressivize = true; activeItem.scrollProgressivize = true; }
-            targetDoc.editScrollProgressivize = true;
-        } else {
-            targetDoc.editScrollProgressivize = false;
-        }
-    }
-
-    //Progressivize Zoom
-    @action
-    progressivizeScroll = (e: React.MouseEvent) => {
-        e.stopPropagation();
-        const activeItem: Doc = this.activeItem;
-        activeItem.scrollProgressivize = !activeItem.scrollProgressivize;
-        const targetDoc: Doc = this.targetDoc;
-        targetDoc.scrollProgressivize = !targetDoc.scrollProgressivize;
-        // CollectionFreeFormDocumentView.setupScroll(targetDoc, NumCast(targetDoc._currentFrame));
-        if (targetDoc.editScrollProgressivize) {
-            targetDoc.editScrollProgressivize = false;
-            targetDoc._currentFrame = 0;
-            targetDoc.lastFrame = 0;
-        }
-    }
-
-    //Progressivize Zoom
-    @action
-    progressivizeZoom = (e: React.MouseEvent) => {
-        e.stopPropagation();
-        const activeItem: Doc = this.activeItem;
-        activeItem.zoomProgressivize = !activeItem.zoomProgressivize;
-        const targetDoc: Doc = this.targetDoc;
-        targetDoc.zoomProgressivize = !targetDoc.zoomProgressivize;
-        CollectionFreeFormDocumentView.setupZoom(activeItem, targetDoc);
-        if (activeItem.editZoomProgressivize) {
-            activeItem.editZoomProgressivize = false;
-            targetDoc._currentFrame = 0;
-            targetDoc.lastFrame = 0;
-        }
-    }
-
-    //Progressivize Child Docs
-    @action
-    editProgressivize = (e: React.MouseEvent) => {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        targetDoc._currentFrame = targetDoc.lastFrame;
-        if (!targetDoc.editProgressivize) {
-            if (!activeItem.presProgressivize) { activeItem.presProgressivize = true; targetDoc.presProgressivize = true; }
-            targetDoc.editProgressivize = true;
-        } else {
-            targetDoc.editProgressivize = false;
-        }
-    }
-
-    @action
-    progressivizeChild = (e: React.MouseEvent) => {
-        e.stopPropagation();
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        const docs = DocListCast(targetDoc[Doc.LayoutFieldKey(targetDoc)]);
-        if (!activeItem.presProgressivize) {
-            targetDoc.keyFrameEditing = false;
-            activeItem.presProgressivize = true;
-            targetDoc.presProgressivize = true;
-            targetDoc._currentFrame = 0;
-            docs.forEach((doc, i) => CollectionFreeFormDocumentView.setupKeyframes([doc], i, true));
-            targetDoc.lastFrame = targetDoc.lastFrame ? NumCast(targetDoc.lastFrame) : docs.length - 1;
-        } else {
-            // targetDoc.editProgressivize = false;
-            activeItem.presProgressivize = false;
-            targetDoc.presProgressivize = false;
-            targetDoc._currentFrame = 0;
-            targetDoc.keyFrameEditing = true;
-        }
-    }
-
-    @action
-    checkMovementLists = (doc: Doc, xlist: any, ylist: any) => {
-        const x: List<number> = xlist;
-        const y: List<number> = ylist;
-        const tags: JSX.Element[] = [];
-        let pathPoints = ""; //List of all of the pathpoints that need to be added
-        for (let i = 0; i < x.length - 1; i++) {
-            if (y[i] || x[i]) {
-                if (i === 0) pathPoints = (x[i] - 11) + "," + (y[i] + 33);
-                else pathPoints = pathPoints + " " + (x[i] - 11) + "," + (y[i] + 33);
-                tags.push(<div className="progressivizeMove-frame" style={{ position: 'absolute', top: y[i], left: x[i] }}>{i}</div>);
-            }
-        }
-        tags.push(<svg style={{ overflow: 'visible', position: 'absolute' }}><polyline
-            points={pathPoints}
-            style={{
-                position: 'absolute',
-                opacity: 1,
-                stroke: "#000000",
-                strokeWidth: 2,
-                strokeDasharray: '10 5',
-            }}
-            fill="none"
-        /></svg>);
-        return tags;
-    }
-
-    @observable
-    toggleDisplayMovement = (doc: Doc) => {
-        if (doc.displayMovement) doc.displayMovement = false;
-        else doc.displayMovement = true;
-    }
-
-    @action
-    checkList = (doc: Doc, list: any): number => {
-        const x: List<number> = list;
-        if (x && x.length >= NumCast(doc._currentFrame) + 1) {
-            return x[NumCast(doc._currentFrame)];
-        } else if (x) {
-            x.length = NumCast(doc._currentFrame) + 1;
-            x[NumCast(doc._currentFrame)] = x[NumCast(doc._currentFrame) - 1];
-            return x[NumCast(doc._currentFrame)];
-        } else return 100;
-    }
-
-    @computed get progressivizeChildDocs() {
-        const targetDoc: Doc = this.targetDoc;
-        const docs = DocListCast(targetDoc[Doc.LayoutFieldKey(targetDoc)]);
-        const tags: JSX.Element[] = [];
-        docs.forEach((doc, index) => {
-            if (doc["x-indexed"] && doc["y-indexed"]) {
-                tags.push(<div style={{ position: 'absolute', display: doc.displayMovement ? "block" : "none" }}>{this.checkMovementLists(doc, doc["x-indexed"], doc["y-indexed"])}</div>);
-            }
-            tags.push(
-                <div className="progressivizeButton" key={index} onPointerLeave={() => { if (NumCast(targetDoc._currentFrame) < NumCast(doc.appearFrame)) doc.opacity = 0; }} onPointerOver={() => { if (NumCast(targetDoc._currentFrame) < NumCast(doc.appearFrame)) doc.opacity = 0.5; }} onClick={e => { this.toggleDisplayMovement(doc); e.stopPropagation(); }} style={{ backgroundColor: doc.displayMovement ? PresColor.LightBlue : "#c8c8c8", top: NumCast(doc.y), left: NumCast(doc.x) }}>
-                    <div className="progressivizeButton-prev"><FontAwesomeIcon icon={"caret-left"} size={"lg"} onClick={e => { e.stopPropagation(); this.prevAppearFrame(doc, index); }} /></div>
-                    <div className="progressivizeButton-frame">{doc.appearFrame}</div>
-                    <div className="progressivizeButton-next"><FontAwesomeIcon icon={"caret-right"} size={"lg"} onClick={e => { e.stopPropagation(); this.nextAppearFrame(doc, index); }} /></div>
-                </div>);
-        });
-        return tags;
-    }
-
-    @action
-    nextAppearFrame = (doc: Doc, i: number): void => {
-        // const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null);
-        // const targetDoc = Cast(activeItem?.presentationTargetDoc, Doc, null);
-        const appearFrame = Cast(doc.appearFrame, "number", null);
-        if (appearFrame === undefined) {
-            doc.appearFrame = 0;
-        }
-        doc.appearFrame = appearFrame + 1;
-        this.updateOpacityList(doc["opacity-indexed"], NumCast(doc.appearFrame));
-    }
-
-    @action
-    prevAppearFrame = (doc: Doc, i: number): void => {
-        // const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null);
-        // const targetDoc = Cast(activeItem?.presentationTargetDoc, Doc, null);
-        const appearFrame = Cast(doc.appearFrame, "number", null);
-        if (appearFrame === undefined) {
-            doc.appearFrame = 0;
-        }
-        doc.appearFrame = Math.max(0, appearFrame - 1);
-        this.updateOpacityList(doc["opacity-indexed"], NumCast(doc.appearFrame));
-    }
-
-    @action
-    updateOpacityList = (list: any, frame: number) => {
-        const x: List<number> = list;
-        if (x && x.length >= frame) {
-            for (let i = 0; i < x.length; i++) {
-                if (i < frame) {
-                    x[i] = 0;
-                } else if (i >= frame) {
-                    x[i] = 1;
-                }
-            }
-            list = x;
-        } else {
-            x.length = frame + 1;
-            for (let i = 0; i < x.length; i++) {
-                if (i < frame) {
-                    x[i] = 0;
-                } else if (i >= frame) {
-                    x[i] = 1;
-                }
-            }
-            list = x;
-        }
-    }
-
-    @computed get moreInfoDropdown() {
-        return (<div></div>);
-    }
-
-    @computed
-    get toolbarWidth(): number {
-        const width = this.props.PanelWidth();
-        return width;
-    }
-
-    @action
-    toggleProperties = () => {
-        if (CurrentUserUtils.propertiesWidth > 0) {
-            CurrentUserUtils.propertiesWidth = 0;
-        } else {
-            CurrentUserUtils.propertiesWidth = 250;
-        }
-    }
-
-    @computed get toolbar() {
-        const propIcon = CurrentUserUtils.propertiesWidth > 0 ? "angle-double-right" : "angle-double-left";
-        const propTitle = CurrentUserUtils.propertiesWidth > 0 ? "Close Presentation Panel" : "Open Presentation Panel";
-        const mode = StrCast(this.rootDoc._viewType) as CollectionViewType;
-        const isMini: boolean = this.toolbarWidth <= 100;
-        const presKeyEvents: boolean = (this.isPres && this._presKeyEventsActive && this.rootDoc === Doc.UserDoc().activePresentation);
-        return (mode === CollectionViewType.Carousel3D) ? (null) : (
-            <div id="toolbarContainer" className={'presBox-toolbar'}>
-                {/* <Tooltip title={<><div className="dash-tooltip">{"Add new slide"}</div></>}><div className={`toolbar-button ${this.newDocumentTools ? "active" : ""}`} onClick={action(() => this.newDocumentTools = !this.newDocumentTools)}>
-                    <FontAwesomeIcon icon={"plus"} />
-                    <FontAwesomeIcon className={`dropdown ${this.newDocumentTools ? "active" : ""}`} icon={"angle-down"} />
-                </div></Tooltip> */}
-                <Tooltip title={<><div className="dash-tooltip">{"View paths"}</div></>}>
-                    <div style={{ opacity: this.childDocs.length > 1 && this.layoutDoc.presCollection ? 1 : 0.3, color: this._pathBoolean ? PresColor.DarkBlue : 'white', width: isMini ? "100%" : undefined }} className={"toolbar-button"} onClick={this.childDocs.length > 1 && this.layoutDoc.presCollection ? this.viewPaths : undefined}>
-                        <FontAwesomeIcon icon={"exchange-alt"} />
-                    </div>
-                </Tooltip>
-                {isMini ? (null) :
-                    <>
-                        <div className="toolbar-divider" />
-                        {/* <Tooltip title={<><div className="dash-tooltip">{this._expandBoolean ? "Minimize all" : "Expand all"}</div></>}>
-                            <div className={"toolbar-button"}
-                                style={{ color: this._expandBoolean ? PresColors.DarkBlue : 'white' }}
-                                onClick={this.toggleExpandMode}>
-                                <FontAwesomeIcon icon={"eye"} />
-                            </div>
-                        </Tooltip>
-                        <div className="toolbar-divider" /> */}
-                        <Tooltip title={<><div className="dash-tooltip">{presKeyEvents ? "Keys are active" : "Keys are not active - click anywhere on the presentation trail to activate keys"}</div></>}>
-                            <div className="toolbar-button" style={{ cursor: presKeyEvents ? 'default' : 'pointer', position: 'absolute', right: 30, fontSize: 16 }}>
-                                <FontAwesomeIcon className={"toolbar-thumbtack"} icon={"keyboard"} style={{ color: presKeyEvents ? PresColor.DarkBlue : 'white' }} />
-                            </div>
-                        </Tooltip>
-                        <Tooltip title={<><div className="dash-tooltip">{propTitle}</div></>}>
-                            <div className="toolbar-button" style={{ position: 'absolute', right: 4, fontSize: 16 }} onClick={this.toggleProperties}>
-                                <FontAwesomeIcon className={"toolbar-thumbtack"} icon={propIcon} style={{ color: CurrentUserUtils.propertiesWidth > 0 ? PresColor.DarkBlue : 'white' }} />
-                            </div>
-                        </Tooltip>
-                    </>
-                }
-            </div>
-        );
-    }
-
-    /**
-     * Top panel containes:
-     * viewPicker: The option to choose between List and Slides view for the presentaiton trail
-     * presentPanel: The button to start the presentation / open minimized view of the presentation
-     */
-    @computed get topPanel() {
-        const mode = StrCast(this.rootDoc._viewType) as CollectionViewType;
-        const isMini: boolean = this.toolbarWidth <= 100;
-        return (
-            <div className="presBox-buttons" style={{ display: !this.rootDoc._chromeHidden ? "none" : undefined }}>
-                {isMini ? (null) : <select className="presBox-viewPicker"
-                    style={{ display: this.layoutDoc.presStatus === "edit" ? "block" : "none" }}
-                    onPointerDown={e => e.stopPropagation()}
-                    onChange={this.viewChanged}
-                    value={mode}>
-                    <option onPointerDown={e => e.stopPropagation()} value={CollectionViewType.Stacking}>List</option>
-                    <option onPointerDown={e => e.stopPropagation()} value={CollectionViewType.Carousel3D}>3D Carousel</option>
-                </select>}
-                <div className="presBox-presentPanel" style={{ opacity: this.childDocs.length ? 1 : 0.3 }}>
-                    <span className={`presBox-button ${this.layoutDoc.presStatus === "edit" ? "present" : ""}`}>
-                        <div className="presBox-button-left"
-                            onClick={undoBatch(() => {
-                                if (this.childDocs.length) {
-                                    this.layoutDoc.presStatus = "manual";
-                                    this.gotoDocument(this.itemIndex, this.activeItem);
-                                }
-                            })}>
-                            <FontAwesomeIcon icon={"play-circle"} />
-                            <div style={{ display: this.props.PanelWidth() > 200 ? "inline-flex" : "none" }}>&nbsp; Present</div>
-                        </div>
-                        {(mode === CollectionViewType.Carousel3D || isMini) ? (null) : <div className={`presBox-button-right ${this.presentTools ? "active" : ""}`}
-                            onClick={(action(() => {
-                                if (this.childDocs.length) this.presentTools = !this.presentTools;
-                            }))}>
-                            <FontAwesomeIcon className="dropdown" style={{ margin: 0, transform: this.presentTools ? 'rotate(180deg)' : 'rotate(0deg)' }} icon={"angle-down"} />
-                            {this.presentDropdown}
-                        </div>}
-                    </span>
-                    {this.playButtons}
-                </div>
-            </div>
-        );
-    }
-
-    @action
-    getList = (list: any): List<number> => {
-        const x: List<number> = list;
-        return x;
-    }
-
-    @action
-    updateList = (list: any): List<number> => {
-        const targetDoc: Doc = this.targetDoc;
-        const x: List<number> = list;
-        x.length + 1;
-        x[x.length - 1] = NumCast(targetDoc._scrollY);
-        return x;
-    }
-
-    @action
-    newFrame = () => {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        const type: string = StrCast(targetDoc.type);
-        if (!activeItem.frameList) activeItem.frameList = new List<number>();
-        switch (type) {
-            case (DocumentType.PDF || DocumentType.RTF || DocumentType.WEB):
-                this.updateList(activeItem.frameList);
-                break;
-            case DocumentType.COL:
-                break;
-            default:
-                break;
-        }
-    }
-
-    @computed get frameListHeader() {
-        return (<div className="frameList-header">
-            &nbsp; Frames {this.panable ? <i>Panable</i> : this.scrollable ? <i>Scrollable</i> : (null)}
-            <div className={"frameList-headerButtons"}>
-                <Tooltip title={<><div className="dash-tooltip">{"Add frame by example"}</div></>}><div className={"headerButton"} onClick={e => { e.stopPropagation(); this.newFrame(); }}>
-                    <FontAwesomeIcon icon={"plus"} onPointerDown={e => e.stopPropagation()} />
-                </div></Tooltip>
-                <Tooltip title={<><div className="dash-tooltip">{"Edit in collection"}</div></>}><div className={"headerButton"} onClick={e => { e.stopPropagation(); console.log('New frame'); }}>
-                    <FontAwesomeIcon icon={"edit"} onPointerDown={e => e.stopPropagation()} />
-                </div></Tooltip>
-            </div>
-        </div>);
-    }
-
-    @computed get frameList() {
-        const activeItem: Doc = this.activeItem;
-        const targetDoc: Doc = this.targetDoc;
-        const frameList: List<number> = this.getList(activeItem.frameList);
-        if (frameList) {
-            const frameItems = frameList.map((value) =>
-                <div className="framList-item">
-
-                </div>
-            );
-            return (
-
-                <div className="frameList-container">
-                    {frameItems}
-                </div>
-            );
-        } else return (null);
-
-    }
-
-    @computed get playButtonFrames() {
-        const targetDoc: Doc = this.targetDoc;
-        return (
-            <>
-                {this.targetDoc ? <div className="presPanel-button-frame" style={{ display: targetDoc.lastFrame !== undefined && targetDoc.lastFrame >= 0 ? "inline-flex" : "none" }}>
-                    <div>{targetDoc._currentFrame}</div>
-                    <div className="presPanel-divider" style={{ border: 'solid 0.5px white', height: '60%' }}></div>
-                    <div>{targetDoc.lastFrame}</div>
-                </div> : null}
-            </>
-        );
-    }
-
-    @computed get playButtons() {
-        const presEnd: boolean = !this.layoutDoc.presLoop && (this.itemIndex === this.childDocs.length - 1);
-        const presStart: boolean = !this.layoutDoc.presLoop && (this.itemIndex === 0);
-        // Case 1: There are still other frames and should go through all frames before going to next slide
-        return (<div className="presPanelOverlay" style={{ display: this.layoutDoc.presStatus !== "edit" ? "inline-flex" : "none" }}>
-            <Tooltip title={<><div className="dash-tooltip">{"Loop"}</div></>}><div className="presPanel-button" style={{ color: this.layoutDoc.presLoop ? PresColor.DarkBlue : 'white' }} onClick={() => this.layoutDoc.presLoop = !this.layoutDoc.presLoop}><FontAwesomeIcon icon={"redo-alt"} /></div></Tooltip>
-            <div className="presPanel-divider"></div>
-            <div className="presPanel-button" style={{ opacity: presStart ? 0.4 : 1 }} onClick={() => { this.back(); if (this._presTimer) { clearTimeout(this._presTimer); this.layoutDoc.presStatus = PresStatus.Manual; } }}><FontAwesomeIcon icon={"arrow-left"} /></div>
-            <Tooltip title={<><div className="dash-tooltip">{this.layoutDoc.presStatus === PresStatus.Autoplay ? "Pause" : "Autoplay"}</div></>}><div className="presPanel-button" onClick={this.startOrPause}><FontAwesomeIcon icon={this.layoutDoc.presStatus === PresStatus.Autoplay ? "pause" : "play"} /></div></Tooltip>
-            <div className="presPanel-button" style={{ opacity: presEnd ? 0.4 : 1 }} onClick={() => { this.next(); if (this._presTimer) { clearTimeout(this._presTimer); this.layoutDoc.presStatus = PresStatus.Manual; } }}><FontAwesomeIcon icon={"arrow-right"} /></div>
-            <div className="presPanel-divider"></div>
-            <Tooltip title={<><div className="dash-tooltip">{"Click to return to 1st slide"}</div></>}><div className="presPanel-button" style={{ border: 'solid 1px white' }} onClick={() => this.gotoDocument(0, this.activeItem)}><b>1</b></div></Tooltip>
-            <div
-                className="presPanel-button-text"
-                onClick={() => this.gotoDocument(0, this.activeItem)}
-                style={{ display: this.props.PanelWidth() > 250 ? "inline-flex" : "none" }}>
-                Slide {this.itemIndex + 1} / {this.childDocs.length}
-                {this.playButtonFrames}
-            </div>
-            <div className="presPanel-divider"></div>
-            {this.props.PanelWidth() > 250 ? <div className="presPanel-button-text" onClick={undoBatch(action(() => { this.layoutDoc.presStatus = "edit"; clearTimeout(this._presTimer); }))}>EXIT</div>
-                : <div className="presPanel-button" onClick={undoBatch(action(() => this.layoutDoc.presStatus = "edit"))}>
-                    <FontAwesomeIcon icon={"times"} />
-                </div>}
-        </div>);
-    }
-
-    @action
-    startOrPause = () => {
-        if (this.layoutDoc.presStatus === PresStatus.Manual || this.layoutDoc.presStatus === PresStatus.Edit) this.startAutoPres(this.itemIndex);
-        else this.pauseAutoPres();
-    }
-
-    render() {
-        // calling this method for keyEvents
-        this.isPres;
-        // needed to ensure that the childDocs are loaded for looking up fields
-        this.childDocs.slice();
-        const mode = StrCast(this.rootDoc._viewType) as CollectionViewType;
-        const presKeyEvents: boolean = (this.isPres && this._presKeyEventsActive && this.rootDoc === Doc.UserDoc().activePresentation);
-        const presEnd: boolean = !this.layoutDoc.presLoop && (this.itemIndex === this.childDocs.length - 1);
-        const presStart: boolean = !this.layoutDoc.presLoop && (this.itemIndex === 0);
-        return CurrentUserUtils.OverlayDocs.includes(this.rootDoc) ?
-            <div className="miniPres">
-                <div className="presPanelOverlay" style={{ display: "inline-flex", height: 30, background: '#323232', top: 0, zIndex: 3000000, boxShadow: presKeyEvents ? '0 0 0px 3px ' + PresColor.DarkBlue : undefined }}>
-                    <Tooltip title={<><div className="dash-tooltip">{"Loop"}</div></>}><div className="presPanel-button" style={{ color: this.layoutDoc.presLoop ? PresColor.DarkBlue : undefined }} onClick={() => this.layoutDoc.presLoop = !this.layoutDoc.presLoop}><FontAwesomeIcon icon={"redo-alt"} /></div></Tooltip>
-                    <div className="presPanel-divider"></div>
-                    <div className="presPanel-button" style={{ opacity: presStart ? 0.4 : 1 }} onClick={() => { this.back(); if (this._presTimer) { clearTimeout(this._presTimer); this.layoutDoc.presStatus = PresStatus.Manual; } }}><FontAwesomeIcon icon={"arrow-left"} /></div>
-                    <Tooltip title={<><div className="dash-tooltip">{this.layoutDoc.presStatus === PresStatus.Autoplay ? "Pause" : "Autoplay"}</div></>}><div className="presPanel-button" onClick={this.startOrPause}><FontAwesomeIcon icon={this.layoutDoc.presStatus === "auto" ? "pause" : "play"} /></div></Tooltip>
-                    <div className="presPanel-button" style={{ opacity: presEnd ? 0.4 : 1 }} onClick={() => { this.next(); if (this._presTimer) { clearTimeout(this._presTimer); this.layoutDoc.presStatus = PresStatus.Manual; } }}><FontAwesomeIcon icon={"arrow-right"} /></div>
-                    <div className="presPanel-divider"></div>
-                    <Tooltip title={<><div className="dash-tooltip">{"Click to return to 1st slide"}</div></>}><div className="presPanel-button" style={{ border: 'solid 1px white' }} onClick={() => this.gotoDocument(0, this.activeItem)}><b>1</b></div></Tooltip>
-                    <div className="presPanel-button-text">
-                        Slide {this.itemIndex + 1} / {this.childDocs.length}
-                        {this.playButtonFrames}
-                    </div>
-                    <div className="presPanel-divider"></div>
-                    <div className="presPanel-button-text" onClick={undoBatch(action(() => { this.updateMinimize(); this.layoutDoc.presStatus = PresStatus.Edit; clearTimeout(this._presTimer); }))}>EXIT</div>
-                </div>
-            </div>
-            :
-            <div className="presBox-cont" style={{ minWidth: CurrentUserUtils.OverlayDocs.includes(this.layoutDoc) ? 240 : undefined }} >
-                {this.topPanel}
-                {this.toolbar}
-                {this.newDocumentToolbarDropdown}
-                <div className="presBox-listCont">
-                    {mode !== CollectionViewType.Invalid ?
-                        <CollectionView {...this.props}
-                            ContainingCollectionDoc={this.props.Document}
-                            PanelWidth={this.props.PanelWidth}
-                            PanelHeight={this.panelHeight}
-                            childIgnoreNativeSize={true}
-                            moveDocument={returnFalse}
-                            childFitWidth={returnTrue}
-                            childOpacity={returnOne}
-                            childLayoutTemplate={this.childLayoutTemplate}
-                            filterAddDocument={this.addDocumentFilter}
-                            removeDocument={returnFalse}
-                            dontRegisterView={true}
-                            focus={this.selectElement}
-                            ScreenToLocalTransform={this.getTransform}
-                        />
-                        : (null)
-                    }
-                </div>
-            </div>;
-    }
-}
-Scripting.addGlobal(function lookupPresBoxField(container: Doc, field: string, data: Doc) {
-    if (field === 'indexInPres') return DocListCast(container[StrCast(container.presentationFieldKey)]).indexOf(data);
-    if (field === 'presCollapsedHeight') return container._viewType === CollectionViewType.Stacking ? 35 : 31;
-    if (field === 'presStatus') return container.presStatus;
-    if (field === '_itemIndex') return container._itemIndex;
-    if (field === 'presBox') return container;
-    return undefined;
-});
\ No newline at end of file
diff --git a/src/client/views/nodes/formattedText/RichTextMenu.tsx b/src/client/views/nodes/formattedText/RichTextMenu.tsx
index 59b2d3753..d1c91cbb9 100644
--- a/src/client/views/nodes/formattedText/RichTextMenu.tsx
+++ b/src/client/views/nodes/formattedText/RichTextMenu.tsx
@@ -963,7 +963,7 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
             this.createHighlighterButton(),
             this.createLinkButton(),
             this.createBrushButton(),
-            <div className="richTextMenu-divider" key="divider 2" />,
+            <div className="collectionMenu-divider" key="divider 2" />,
             this.createButton("align-left", "Align Left", this.activeAlignment === "left", this.alignLeft),
             this.createButton("align-center", "Align Center", this.activeAlignment === "center", this.alignCenter),
             this.createButton("align-right", "Align Right", this.activeAlignment === "right", this.alignRight),
@@ -976,7 +976,7 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
         const row2 = <div className="antimodeMenu-row row-2" key="row2">
             {this.collapsed ? this.getDragger() : (null)}
             <div key="row 2" style={{ display: this.collapsed ? "none" : undefined }}>
-                <div className="richTextMenu-divider" key="divider 3" />
+                <div className="collectionMenu-divider" key="divider 3" />
                 {[this.createMarksDropdown(this.activeFontSize, this.fontSizeOptions, "font size", action((val: string) => {
                     this.activeFontSize = val;
                     SelectionManager.Views().map(dv => dv.props.Document._fontSize = val);
@@ -985,12 +985,12 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
                     this.activeFontFamily = val;
                     SelectionManager.Views().map(dv => dv.props.Document._fontFamily = val);
                 })),
-                <div className="richTextMenu-divider" key="divider 4" />,
+                <div className="collectionMenu-divider" key="divider 4" />,
                 this.createNodesDropdown(this.activeListType, this.listTypeOptions, "list type", () => ({})),
                 this.createButton("sort-amount-down", "Summarize", undefined, this.insertSummarizer),
                 this.createButton("quote-left", "Blockquote", undefined, this.insertBlockquote),
-                this.createButton("minus", "Horizontal Rule", undefined, this.insertHorizontalRule),
-                <div className="richTextMenu-divider" key="divider 5" />,]}
+                this.createButton("minus", "Horizontal Rule", undefined, this.insertHorizontalRule)
+                ]}
             </div>
             {/* <div key="collapser">
                 {<div key="collapser">
diff --git a/src/client/views/nodes/trails/PresBox.scss b/src/client/views/nodes/trails/PresBox.scss
new file mode 100644
index 000000000..06932d145
--- /dev/null
+++ b/src/client/views/nodes/trails/PresBox.scss
@@ -0,0 +1,1243 @@
+@import "../../global/globalCssVariables";
+
+.presBox-cont {
+    cursor: auto;
+    position: absolute;
+    display: block;
+    pointer-events: inherit;
+    z-index: 2;
+    font-family: Roboto;
+    width: 100%;
+    min-width: 20px;
+    height: 100%;
+    min-height: 35px;
+    letter-spacing: 2px;
+    overflow: hidden;
+    transition: 0.7s opacity ease;
+
+    .presBox-listCont {
+        position: relative;
+        height: calc(100% - 67px);
+        width: 100%;
+    }
+
+    .presBox-toolbar-dropdown {
+        border-radius: 5px;
+        background-color: white;
+        transform: translate(8px, -5px);
+        box-shadow: 1px 1px 4px 4px rgba(0, 0, 0, 0.25);
+        z-index: 1000;
+        width: calc(100% - 50px);
+        height: max-content;
+        justify-self: center;
+        letter-spacing: normal;
+        height: max-content;
+        font-weight: 500;
+        position: relative;
+        font-size: 13;
+    }
+
+    .presBox-toolbar {
+        position: relative;
+        display: inline-flex;
+        align-items: center;
+        height: 30px;
+        width: 100%;
+        color: $white;
+        background-color: $dark-gray;
+
+        .toolbar-button {
+            cursor: pointer;
+            margin-left: 10px;
+            margin-right: 10px;
+            letter-spacing: 0;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            transition: 0.5s;
+        }
+
+        .toolbar-button.active {
+            color: $light-blue;
+            background-color: white;
+            border-radius: 100%;
+        }
+
+        .toolbar-transitionButtons {
+            display: block;
+
+            .toolbar-transition {
+                display: flex;
+                font-size: 10;
+                width: 100;
+                background-color: rgba(0, 0, 0, 0);
+                min-width: max-content;
+
+                .toolbar-icon {
+                    margin-right: 5px;
+                }
+            }
+        }
+    }
+
+    .toolbar-moreInfo {
+        position: absolute;
+        right: 5px;
+        display: flex;
+        width: max-content;
+        height: 25px;
+        justify-content: center;
+        transform: rotate(90deg);
+        align-items: center;
+        transition: 0.7s ease;
+
+        .toolbar-moreInfoBall {
+            width: 4px;
+            height: 4px;
+            border-radius: 100%;
+            background-color: white;
+            margin: 1px;
+            position: relative;
+        }
+    }
+
+    .toolbar-moreInfo.active {
+        transform: rotate(0deg);
+    }
+
+    .toolbar-divider {
+        border-left: solid $medium-gray 0.5px;
+        height: 20px;
+    }
+}
+
+.dropdown {
+    font-size: 10;
+    margin-left: 5px;
+    color: $medium-gray;
+    transition: 0.5s ease;
+}
+
+.dropdown.active {
+    transform: rotate(180deg);
+    color: $light-blue;
+    opacity: 0.8;
+}
+
+.presBox-radioButtons {
+    font-size: 10px;
+    font-weight: 200;
+    // background-color: rgba(0, 0, 0, 0.1);
+
+    .checkbox-container {
+        margin-left: 10px;
+        display: inline-flex;
+        width: 100%;
+        height: 20px;
+        align-items: center;
+    }
+
+    .checkbox-dropdown {
+        display: flex;
+        width: 100%;
+        align-items: flex-end;
+        gap: 5px;
+
+        .presBox-viewPicker {
+            width: calc(100% - 120px);
+            min-width: 30px;
+        }
+    }
+}
+
+.presBox-ribbon {
+    position: relative;
+    display: inline;
+    font-family: Roboto;
+    z-index: 100;
+    transition: 0.7s;
+
+    .ribbon-doubleButton {
+        display: inline-flex;
+    }
+
+    .presBox-reactiveGrid {
+        display: grid;
+        justify-content: flex-start;
+        align-items: center;
+        grid-template-columns: repeat(auto-fit, 70px);
+    }
+
+    .ribbon-colorBox {
+        cursor: pointer;
+        border: solid 1px $black;
+        display: flex;
+        margin-left: 5px;
+        margin-top: 5px;
+        margin-bottom: 5px;
+        justify-content: center;
+        align-items: center;
+        height: 15px;
+        width: 15px;
+        padding: 0px;
+        transform: translate(2px, 3px);
+    }
+
+    .ribbon-property {
+        font-size: 11;
+        font-weight: 200;
+        height: 20;
+        background-color: $white;
+        color: $black;
+        border: solid 1px $black;
+        display: flex;
+        margin-left: 5px;
+        margin-top: 5px;
+        margin-bottom: 5px;
+        width: max-content;
+        justify-content: center;
+        align-items: center;
+        padding-right: 10px;
+        padding-left: 10px;
+    }
+
+    .ribbon-propertyUpDown {
+        height: 20;
+        width: 20;
+        margin-top: 5px;
+        display: grid;
+        grid-template-rows: 10px 10px;
+
+        .ribbon-propertyUpDownItem {
+            cursor: pointer;
+            color: white;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            height: 100%;
+            width: 100%;
+            background: $black;
+        }
+
+        .ribbon-propertyUpDownItem:hover {
+            background: $medium-gray;
+            transform: scale(1.05);
+        }
+    }
+
+    .presBox-subheading {
+        font-size: 11;
+        font-weight: 400;
+        margin-top: 10px;
+    }
+
+    @media screen and (-webkit-min-device-pixel-ratio:0) {
+
+        .multiThumb-slider {
+            display: grid;
+            background-color: $white;
+            height: 10px;
+            border-radius: 10px;
+            overflow: hidden;
+
+            .toolbar-slider {
+                margin-top: 0px;
+                background: none;
+                -webkit-appearance: none;
+                pointer-events: none;
+            }
+
+            .toolbar-slider.start::-webkit-slider-thumb {
+                width: 10px;
+                pointer-events: auto;
+                -webkit-appearance: none;
+                height: 10px;
+                cursor: ew-resize;
+                background: $medium-blue;
+                box-shadow: -100vw 0 0 100vw $white;
+            }
+
+            .toolbar-slider.end::-webkit-slider-thumb {
+                width: 10px;
+                pointer-events: auto;
+                -webkit-appearance: none;
+                height: 10px;
+                cursor: ew-resize;
+                background: $medium-blue;
+                box-shadow: -100vw 0 0 100vw $light-blue;
+            }
+        }
+
+        .toolbar-slider {
+            margin-top: 5px;
+            position: relative;
+            align-self: center;
+            justify-self: left;
+            overflow: hidden;
+            width: 100%;
+            height: 10px;
+            border-radius: 10px;
+            -webkit-appearance: none;
+            background-color: $white;
+        }
+
+        .toolbar-slider:focus {
+            outline: none;
+        }
+
+        .toolbar-slider::-webkit-slider-runnable-track {
+            height: 10px;
+            -webkit-appearance: none;
+            margin-top: -1px;
+        }
+
+        .toolbar-slider::-webkit-slider-thumb {
+            width: 10px;
+            pointer-events: auto;
+            -webkit-appearance: none;
+            height: 10px;
+            cursor: ew-resize;
+            background: $medium-blue;
+            box-shadow: -100vw 0 0 100vw $light-blue;
+        }
+
+        .presBox-checkbox {
+            -webkit-appearance: none;
+            -webkit-user-select: none;
+            -moz-user-select: none;
+            -ms-user-select: none;
+            user-select: none;
+            margin: 0;
+            margin-right: 3px;
+            border-radius: 100%;
+            height: 15px;
+            width: 15px;
+            min-width: 15px;
+            cursor: pointer;
+            background: $white;
+        }
+
+        .presBox-checkbox:focus {
+            outline: none;
+        }
+
+        .presBox-checkbox:hover {
+            background: $light-gray;
+        }
+
+        .presBox-checkbox:checked {
+            background: $light-blue;
+        }
+    }
+
+
+
+    .slider-headers {
+        position: relative;
+        display: grid;
+        justify-content: space-between;
+        width: 100%;
+        height: max-content;
+        grid-template-columns: auto auto auto;
+        grid-template-rows: max-content;
+        font-weight: 100;
+        margin-top: 3px;
+        font-size: 10px;
+
+        .slider-block {
+            width: 63px;
+            border-radius: 5px;
+            text-align: center;
+            margin-bottom: 8px;
+            margin-top: 8px;
+        }
+
+        .slider-number {
+            border-radius: 3px;
+            width: 30px;
+            margin: auto;
+        }
+    }
+
+    .slider-value {
+        top: -20;
+        color: #2f86a2;
+        position: absolute;
+    }
+
+    .slider-value.none,
+    .slider-headers.none,
+    .toolbar-slider.none {
+        display: none;
+    }
+
+    .dropdown-header {
+        padding-bottom: 10px;
+        font-weight: 800;
+        text-align: center;
+        font-size: 16;
+        width: 90%;
+        color: $black;
+        transform: translate(5%, 0px);
+        border-bottom: solid 2px $medium-gray;
+    }
+
+
+    .ribbon-textInput {
+        border-radius: 2px;
+        height: 20px;
+        font-size: 11.5;
+        font-weight: 100;
+        align-self: center;
+        justify-self: left;
+        margin-top: 5px;
+        padding-left: 10px;
+        background-color: $white;
+        border: solid 1px $black;
+        min-width: 80px;
+        max-width: 200px;
+        width: 100%;
+    }
+
+    .presBox-input {
+        width: 30;
+        height: 100%;
+        background: none;
+        border: none;
+        text-align: right;
+    }
+
+    .presBox-input:focus {
+        outline: none;
+    }
+
+    .ribbon-frameSelector {
+        border: $black solid 1px;
+        width: 60px;
+        height: 20px;
+        margin-top: 5px;
+        display: grid;
+        grid-template-columns: auto 27px auto;
+        position: relative;
+        border-radius: 5px;
+        overflow: hidden;
+        align-items: center;
+        justify-self: left;
+
+        .fwdKeyframe,
+        .backKeyframe {
+            cursor: pointer;
+            position: relative;
+            height: 100%;
+            background: $white;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            text-align: center;
+            color: $black;
+        }
+
+        .numKeyframe {
+            cursor: pointer;
+            font-size: 10;
+            font-weight: 600;
+            position: relative;
+            color: $black;
+            display: flex;
+            width: 100%;
+            height: 100%;
+            text-align: center;
+            align-items: center;
+            justify-content: center;
+        }
+    }
+
+    .ribbon-final-box {
+        align-self: flex-start;
+        justify-self: center;
+        display: grid;
+        margin-top: 10px;
+        grid-template-rows: auto auto;
+        /* padding-left: 10px; */
+        /* padding-right: 10px; */
+        letter-spacing: normal;
+        min-width: max-content;
+        width: 100%;
+        font-size: 13;
+        font-weight: 500;
+        position: relative;
+
+
+        .ribbon-final-button {
+            cursor: pointer;
+            position: relative;
+            font-size: 11;
+            font-weight: normal;
+            letter-spacing: normal;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            margin-bottom: 5px;
+            height: 25px;
+            color: white;
+            width: 100%;
+            max-width: 120;
+            padding-left: 10;
+            padding-right: 10;
+            border-radius: 10px;
+            background-color: $medium-gray;
+        }
+
+        .ribbon-final-button:hover {
+            transform: scale(1.05);
+            transition: all 0.4s;
+        }
+
+        .ribbon-final-button-hidden {
+            cursor: pointer;
+            position: relative;
+            font-size: 11;
+            font-weight: normal;
+            letter-spacing: normal;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            margin-bottom: 5px;
+            height: 25px;
+            color: $light-gray;
+            width: 100%;
+            max-width: 120;
+            padding-left: 10;
+            padding-right: 10;
+            border-radius: 10px;
+            background-color: $black;
+        }
+
+        .ribbon-final-button-hidden:hover {
+            transform: scale(1.05);
+            transition: all 0.4s;
+        }
+
+        .ribbon-frameList {
+            width: calc(100% - 5px);
+            height: 50px;
+            background-color: $white;
+            border: 1px solid $medium-gray;
+            grid-template-rows: max-content;
+
+            .frameList-header {
+                display: grid;
+                width: 100%;
+                height: 20px;
+                background-color: $medium-gray;
+
+                .frameList-headerButtons {
+                    display: flex;
+                    grid-column: 7;
+                    width: 60px;
+                    justify-self: right;
+                    justify-content: flex-end;
+
+                    .headerButton {
+                        cursor: pointer;
+                        position: relative;
+                        border-radius: 100%;
+                        z-index: 300;
+                        width: 15px;
+                        height: 15px;
+                        display: flex;
+                        font-size: 10px;
+                        justify-self: center;
+                        align-self: center;
+                        background-color: rgba(0, 0, 0, 0.5);
+                        color: white;
+                        justify-content: center;
+                        align-items: center;
+                        transition: 0.2s;
+                        margin-right: 3px;
+                    }
+
+                    .headerButton:hover {
+                        background-color: rgba(0, 0, 0, 1);
+                        transform: scale(1.15);
+                    }
+                }
+            }
+        }
+    }
+
+    .selectedList {
+        display: block;
+        min-width: 50;
+        max-width: 120;
+        height: 70;
+        overflow-y: scroll;
+
+        .selectedList-items {
+            font-size: 7;
+            font-weight: normal;
+        }
+    }
+
+    .ribbon-button {
+        cursor: pointer;
+        font-size: 10.5;
+        font-weight: 300;
+        height: 20;
+        background-color: $medium-gray;
+        color: white;
+        display: flex;
+        margin-top: 5px;
+        margin-bottom: 5px;
+        border-radius: 5px;
+        margin-right: 5px;
+        width: max-content;
+        justify-content: center;
+        align-items: center;
+        padding-right: 10px;
+        padding-left: 10px;
+    }
+
+    .ribbon-button:hover {
+        transform: scale(1.03);
+        transition: all 0.4s;
+        font-weight: 400;
+        opacity: 1;
+        color: $white;
+        background-color: $black;
+    }
+
+    .ribbon-toggle {
+        cursor: pointer;
+        font-size: 10.5;
+        font-weight: 200;
+        height: 20;
+        background-color: $white;
+        border: solid 1px rgba(0, 0, 0, 0.5);
+        display: flex;
+        color: $black;
+        margin-top: 5px;
+        margin-bottom: 5px;
+        border-radius: 5px;
+        margin-right: 5px;
+        width: max-content;
+        justify-content: center;
+        align-items: center;
+        padding-right: 10px;
+        padding-left: 10px;
+    }
+
+    .ribbon-toggle.active {
+        background-color: #aedef8;
+    }
+
+    .ribbon-toggle:hover {
+        transform: scale(1.03);
+        transition: all 0.4s;
+        border: solid 1px rgba(0, 0, 0, 0.75);
+    }
+
+    svg.svg-inline--fa.fa-thumbtack.fa-w-12.toolbar-thumbtack {
+        right: 40;
+        position: absolute;
+        transform: rotate(45deg);
+    }
+
+    .ribbon-box {
+        display: grid;
+        grid-template-rows: max-content auto;
+        justify-self: center;
+        margin-top: 10px;
+        padding-right: 10px;
+        letter-spacing: normal;
+        width: 100%;
+        height: max-content;
+        font-weight: 500;
+        position: relative;
+        font-size: 13;
+        padding-bottom: 10px;
+        border-bottom: solid 1px $dark-gray;
+
+        .presBox-dropdown:hover {
+            border: solid 1px $medium-blue;
+
+            .presBox-dropdownIcon {
+                color: $medium-blue;
+            }
+        }
+
+        .presBox-dropdown {
+            cursor: pointer;
+            display: grid;
+            grid-template-columns: auto 20%;
+            position: relative;
+            border: solid 1px $black;
+            background-color: $light-gray;
+            border-radius: 5px;
+            font-size: 10;
+            height: 25;
+            color: $black;
+            padding-left: 5px;
+            align-items: center;
+            margin-top: 5px;
+            margin-bottom: 5px;
+            font-weight: 200;
+            width: 100%;
+            min-width: max-content;
+            max-width: 200px;
+            overflow: visible;
+
+
+            .presBox-dropdownOption {
+                cursor: pointer;
+                font-size: 11;
+                display: block;
+                padding-left: 10px;
+                padding-right: 5px;
+                padding-top: 3;
+                padding-bottom: 3;
+            }
+
+            .presBox-dropdownOption:hover {
+                position: relative;
+                background-color: lightgrey;
+            }
+
+            .presBox-dropdownOption.active {
+                position: relative;
+                background-color: $light-blue;
+            }
+
+            .presBox-dropdownOptions {
+                position: absolute;
+                top: 23px;
+                left: -2px;
+                z-index: 200;
+                width: 85%;
+                min-width: max-content;
+                display: block;
+                background: #FFFFFF;
+                border: 0.5px solid #979797;
+                box-sizing: border-box;
+                box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+            }
+
+            .presBox-dropdownIcon {
+                position: relative;
+                color: black;
+                align-self: center;
+                justify-self: center;
+                margin-right: 2px;
+            }
+        }
+    }
+}
+
+.presBox-ribbon.active {
+    display: grid;
+    grid-template-columns: auto auto auto auto auto;
+    grid-template-rows: 100%;
+    height: 100px;
+    padding-top: 5px;
+    padding-bottom: 5px;
+    border: solid 1px $black;
+    // overflow: auto; 
+
+    ::-webkit-scrollbar {
+        -webkit-appearance: none;
+        height: 3px;
+        width: 8px;
+    }
+
+    ::-webkit-scrollbar-thumb {
+        border-radius: 2px;
+    }
+}
+
+.dropdown-play-button {
+    cursor: pointer;
+    font-size: 12;
+    padding-left: 5px;
+    padding-right: 5px;
+    padding-top: 5px;
+    padding-bottom: 5px;
+    text-align: left;
+    justify-content: left;
+}
+
+.dropdown-play-button:hover {
+    background-color: lightgrey;
+}
+
+.presBox-button-left {
+    cursor: pointer;
+    position: relative;
+    align-self: flex-start;
+    justify-self: flex-start;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 4px;
+    padding-left: 7px;
+    padding-right: 7px;
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0;
+}
+
+.presBox-button-right {
+    cursor: pointer;
+    position: relative;
+    text-align: center;
+    border-left: solid 1px $medium-gray;
+    width: 20%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 4px;
+    padding-left: 7px;
+    padding-right: 7px;
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0;
+}
+
+.presBox-button-right.active {
+    background-color: #223063;
+    border: #aedcf6 solid 1px;
+    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.8);
+}
+
+.dropdown-play {
+    cursor: pointer;
+    right: 0px;
+    top: calc(100% + 2px);
+    display: none;
+    border-radius: 5px;
+    width: max-content;
+    min-height: 20px;
+    height: max-content;
+    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.8);
+    z-index: 200;
+    background-color: white;
+    color: $black;
+    position: absolute;
+    overflow: hidden;
+}
+
+.dropdown-play.active {
+    display: block;
+}
+
+.open-layout {
+    cursor: pointer;
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transform: translate(0px, -1px);
+    background-color: $white;
+    width: 40px;
+    height: 15px;
+    align-self: center;
+    justify-self: center;
+    border: solid 1px $black;
+    border-top: 0px;
+    border-bottom-right-radius: 7px;
+    border-bottom-left-radius: 7px;
+}
+
+.layout-container {
+    padding: 5px;
+    display: grid;
+    background-color: $white;
+    grid-template-columns: repeat(auto-fit, minmax(90px, 100px));
+    width: 100%;
+    border: solid 1px $black;
+    min-width: 100px;
+    overflow: hidden;
+
+    .layout:hover {
+        border: solid 2px $medium-blue;
+    }
+
+    .layout {
+        cursor: pointer;
+        align-self: center;
+        justify-self: center;
+        margin-top: 5;
+        margin-bottom: 5;
+        position: relative;
+        height: 55px;
+        min-width: 90px;
+        width: 90px;
+        overflow: hidden;
+        background-color: white;
+        border: solid $medium-gray 1px;
+        display: grid;
+        grid-template-rows: auto;
+        align-items: center;
+        text-align: center;
+
+        .title {
+            position: relative;
+            align-self: end;
+            padding-left: 3px;
+            margin-left: 3px;
+            margin-right: 3px;
+            height: 13;
+            font-size: 12;
+            display: flex;
+            background-color: $white;
+        }
+
+        .subtitle {
+            align-self: flex-start;
+            position: relative;
+            padding-left: 3px;
+            margin-left: 3px;
+            margin-right: 3px;
+            font-weight: 400;
+            height: 13;
+            font-size: 9;
+            display: flex;
+            background-color: $white;
+        }
+
+        .content {
+            position: relative;
+            font-weight: 200;
+            align-self: flex-start;
+            padding-left: 3px;
+            margin-left: 3px;
+            margin-right: 3px;
+            height: 13;
+            font-size: 10;
+            display: flex;
+            background-color: $white;
+            height: 33;
+            text-align: left;
+            font-size: 8px;
+        }
+    }
+}
+
+.presBox-buttons {
+    position: relative;
+    width: 100%;
+    background: $medium-gray;
+    min-height: 35px;
+    padding-top: 5px;
+    padding-bottom: 5px;
+    display: grid;
+    grid-template-columns: auto auto;
+
+    .presBox-viewPicker {
+        cursor: pointer;
+        height: 25;
+        position: relative;
+        display: inline-block;
+        grid-column: 1;
+        border-radius: 5px;
+        min-width: 15px;
+        max-width: 100px;
+        left: 8px;
+    }
+
+    .presBox-presentPanel {
+        display: flex;
+        justify-self: end;
+        width: 100%;
+        max-width: 300px;
+        min-width: 150px;
+    }
+
+
+
+    select {
+        background: $dark-gray;
+        color: $white;
+    }
+
+    .presBox-button {
+        cursor: pointer;
+        height: 25px;
+        border-radius: 5px;
+        display: none;
+        justify-content: center;
+        align-content: center;
+        align-items: center;
+        text-align: center;
+        letter-spacing: normal;
+        width: inherit;
+        background: $dark-gray;
+        color: $white;
+    }
+
+    .presBox-button.active {
+        display: flex;
+    }
+
+    .presBox-button.active:hover {
+        background-color: $medium-blue;
+    }
+
+    .presBox-button.edit {
+        display: flex;
+        max-width: 25px;
+    }
+
+    .presBox-button.present {
+        display: flex;
+        width: max-content;
+        position: absolute;
+        right: 10px;
+
+        .present-icon {
+            margin-right: 7px;
+        }
+    }
+
+
+
+    .collectionViewBaseChrome-viewPicker {
+        min-width: 50;
+        width: 5%;
+        height: 25;
+        position: relative;
+        display: inline-block;
+        left: 8px;
+    }
+}
+
+.presBox-backward,
+.presBox-forward {
+    width: 25px;
+    border-radius: 5px;
+    top: 50%;
+    position: absolute;
+    display: inline-block;
+}
+
+.presBox-backward {
+    left: 5;
+}
+
+.presBox-forward {
+    right: 5;
+}
+
+// CSS adjusted for mobile devices
+@media only screen and (max-device-width: 480px) {
+    .presBox-cont .presBox-buttons {
+        position: absolute;
+        top: 70%;
+        left: 50%;
+        transform: translate(-50%, 0);
+        width: max-content;
+        height: 15%;
+        z-index: 2;
+        align-items: center;
+        background: rgba(0, 0, 0, 0);
+        display: inline-flex;
+
+        .presBox-button {
+            margin-top: 5%;
+            height: 250;
+            width: 300;
+            font-size: 100;
+            display: flex;
+            align-items: center;
+            background: $dark-gray;
+            color: $white;
+        }
+
+        .presBox-viewPicker {
+            top: -70;
+            left: 2.5%;
+            height: 50;
+            width: 95%;
+            font-size: 30px;
+            position: absolute;
+            min-width: 50px;
+        }
+    }
+
+    .presBox-cont .presBox-listCont {
+        top: 50;
+        height: calc(100% - 80px);
+    }
+
+    .input,
+    .select {
+        font-size: 100%;
+    }
+}
+
+.miniPres {
+    cursor: grab;
+    position: absolute;
+    right: 10;
+    top: 10;
+    opacity: 0.1;
+    transition: all 0.4s;
+    color: $white;
+}
+
+.miniPres:hover {
+    opacity: 1;
+}
+
+.presPanelOverlay {
+    background-color: $dark-gray;
+    color: $white;
+    border-radius: 5px;
+    grid-template-rows: 100%;
+    height: 25;
+    width: max-content;
+    min-width: max-content;
+    justify-content: space-evenly;
+    align-items: center;
+    display: flex;
+    position: absolute;
+    right: 10px;
+    transition: all 0.2s;
+
+    .presPanel-button-text {
+        cursor: pointer;
+        display: flex;
+        height: 20;
+        width: max-content;
+        font-family: Roboto;
+        font-weight: 400;
+        margin-left: 3px;
+        margin-right: 3px;
+        padding-right: 3px;
+        padding-left: 3px;
+        letter-spacing: normal;
+        border-radius: 5px;
+        align-items: center;
+        justify-content: center;
+        transition: all 0.3s;
+    }
+
+    .presPanel-divider {
+        width: 0.5px;
+        height: 80%;
+        border-right: solid 1px $medium-gray;
+    }
+
+    .presPanel-button-frame {
+        justify-self: center;
+        align-self: center;
+        align-items: center;
+        display: grid;
+        grid-template-columns: auto auto auto;
+        justify-content: space-around;
+        font-size: 11;
+        margin-left: 7;
+        width: 30;
+        height: 85%;
+        background-color: rgba(91, 157, 221, 0.4);
+        border-radius: 5px;
+    }
+
+    .presPanel-button {
+        cursor: pointer;
+        display: flex;
+        height: 20;
+        min-width: 20;
+        margin-left: 3px;
+        margin-right: 3px;
+        border-radius: 100%;
+        align-items: center;
+        justify-content: center;
+        transition: all 0.3s;
+    }
+
+    .presPanel-button:hover {
+        background-color: $medium-gray;
+        transform: scale(1.2);
+    }
+
+    .presPanel-button-text:hover {
+        background-color: $medium-gray;
+    }
+
+
+}
+
+// .miniPres {
+//     cursor: grab;
+//     position: absolute;
+//     overflow: hidden;
+//     right: 10;
+//     top: 10;
+//     opacity: 0.1;
+//     transition: all 0.4s;
+//     /* border: solid 1px; */
+//     color: white;
+//     /* box-shadow: black 0.4vw 0.4vw 0.8vw; */
+
+//     .miniPresOverlay {
+//         display: grid;
+//         grid-template-columns: auto auto auto auto auto auto auto auto auto auto;
+//         grid-template-rows: 100%;
+//         height: 100%;
+//         justify-items: center;
+//         align-items: center;
+
+//         .miniPres-button-text {
+//             cursor: pointer;
+//             display: flex;
+//             height: 20;
+//             font-weight: 400;
+//             min-width: 100%;
+//             border-radius: 5px;
+//             align-items: center;
+//             justify-content: center;
+//             transition: all 0.3s;
+//         }
+
+//         .miniPres-button-frame {
+//             justify-self: center;
+//             align-self: center;
+//             align-items: center;
+//             display: grid;
+//             grid-template-columns: auto auto auto;
+//             justify-content: space-around;
+//             font-size: 11;
+//             margin-left: 7;
+//             width: 30;
+//             height: 85%;
+//             background-color: rgba(91, 157, 221, 0.4);
+//             border-radius: 5px;
+//         }
+
+//         .miniPres-divider {
+//             width: 0.5px;
+//             height: 80%;
+//             border-right: solid 2px #5a5a5a;
+//         }
+
+//         .miniPres-button {
+//             cursor: pointer;
+//             display: flex;
+//             height: 20;
+//             min-width: 20;
+//             border-radius: 100%;
+//             align-items: center;
+//             justify-content: center;
+//             transition: all 0.3s;
+//         }
+
+//         .miniPres-button:hover {
+//             background-color: #5a5a5a;
+//         }
+
+//         .miniPres-button-text:hover {
+//             background-color: #5a5a5a;
+//         }
+//     }
+// }
\ No newline at end of file
diff --git a/src/client/views/nodes/trails/PresBox.tsx b/src/client/views/nodes/trails/PresBox.tsx
new file mode 100644
index 000000000..5cb9866f8
--- /dev/null
+++ b/src/client/views/nodes/trails/PresBox.tsx
@@ -0,0 +1,2440 @@
+import React = require("react");
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { Tooltip } from "@material-ui/core";
+import { action, computed, IReactionDisposer, observable, ObservableMap, reaction, runInAction } from "mobx";
+import { observer } from "mobx-react";
+import { ColorState, SketchPicker } from "react-color";
+import { Bounce, Fade, Flip, LightSpeed, Roll, Rotate, Zoom } from 'react-reveal';
+import { Doc, DocListCast, DocListCastAsync, FieldResult } from "../../../../fields/Doc";
+import { documentSchema } from "../../../../fields/documentSchemas";
+import { InkTool } from "../../../../fields/InkField";
+import { List } from "../../../../fields/List";
+import { PrefetchProxy } from "../../../../fields/Proxy";
+import { listSpec, makeInterface } from "../../../../fields/Schema";
+import { ScriptField } from "../../../../fields/ScriptField";
+import { BoolCast, Cast, NumCast, StrCast } from "../../../../fields/Types";
+import { emptyFunction, returnFalse, returnOne, returnTrue } from '../../../../Utils';
+import { Docs } from "../../../documents/Documents";
+import { DocumentType } from "../../../documents/DocumentTypes";
+import { CurrentUserUtils } from "../../../util/CurrentUserUtils";
+import { DocumentManager } from "../../../util/DocumentManager";
+import { Scripting } from "../../../util/Scripting";
+import { SelectionManager } from "../../../util/SelectionManager";
+import { undoBatch, UndoManager } from "../../../util/UndoManager";
+import { CollectionDockingView } from "../../collections/CollectionDockingView";
+import { CollectionView, CollectionViewType } from "../../collections/CollectionView";
+import { TabDocView } from "../../collections/TabDocView";
+import { ViewBoxBaseComponent } from "../../DocComponent";
+import { Colors } from "../../global/globalEnums";
+import { LightboxView } from "../../LightboxView";
+import { CollectionFreeFormDocumentView } from "../CollectionFreeFormDocumentView";
+import { FieldView, FieldViewProps } from '../FieldView';
+import "./PresBox.scss";
+import Color = require("color");
+import { PresEffect, PresStatus, PresMovement } from "./PresEnums";
+
+export class PinProps {
+    audioRange?: boolean;
+    unpin?: boolean;
+    setPosition?: boolean;
+    hidePresBox?: boolean;
+}
+
+type PresBoxSchema = makeInterface<[typeof documentSchema]>;
+const PresBoxDocument = makeInterface(documentSchema);
+
+@observer
+export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>(PresBoxDocument) {
+    public static LayoutString(fieldKey: string) { return FieldView.LayoutString(PresBox, fieldKey); }
+
+    static renderEffectsDoc(renderDoc: any, layoutDoc: Doc) {
+        const effectProps = {
+            left: layoutDoc.presEffectDirection === PresEffect.Left,
+            right: layoutDoc.presEffectDirection === PresEffect.Right,
+            top: layoutDoc.presEffectDirection === PresEffect.Top,
+            bottom: layoutDoc.presEffectDirection === PresEffect.Bottom,
+            opposite: true,
+            delay: layoutDoc.presTransition,
+            // when: this.layoutDoc === PresBox.Instance.childDocs[PresBox.Instance.itemIndex]?.presentationTargetDoc,
+        };
+        switch (layoutDoc.presEffect) {
+            case PresEffect.Zoom: return (<Zoom {...effectProps}>{renderDoc}</Zoom>);
+            case PresEffect.Fade: return (<Fade {...effectProps}>{renderDoc}</Fade>);
+            case PresEffect.Flip: return (<Flip {...effectProps}>{renderDoc}</Flip>);
+            case PresEffect.Rotate: return (<Rotate {...effectProps}>{renderDoc}</Rotate>);
+            case PresEffect.Bounce: return (<Bounce {...effectProps}>{renderDoc}</Bounce>);
+            case PresEffect.Roll: return (<Roll {...effectProps}>{renderDoc}</Roll>);
+            case PresEffect.Lightspeed: return (<LightSpeed {...effectProps}>{renderDoc}</LightSpeed>);
+            case PresEffect.None:
+            default: return renderDoc;
+        }
+    }
+    public static EffectsProvider(layoutDoc: Doc, renderDoc: any) {
+        return PresBox.Instance && layoutDoc === PresBox.Instance.childDocs[PresBox.Instance.itemIndex]?.presentationTargetDoc ?
+            PresBox.renderEffectsDoc(renderDoc, layoutDoc)
+            :
+            renderDoc;
+    }
+
+    @observable public static Instance: PresBox;
+
+    @observable _isChildActive = false;
+    @observable _moveOnFromAudio: boolean = true;
+    @observable _presTimer!: NodeJS.Timeout;
+    @observable _presKeyEventsActive: boolean = false;
+
+    @observable _selectedArray: ObservableMap = new ObservableMap<Doc, any>();
+    @observable _eleArray: HTMLElement[] = [];
+    @observable _dragArray: HTMLElement[] = [];
+    @observable _pathBoolean: boolean = false;
+    @observable _expandBoolean: boolean = false;
+
+    private _disposers: { [name: string]: IReactionDisposer } = {};
+    @observable private transitionTools: boolean = false;
+    @observable private newDocumentTools: boolean = false;
+    @observable private progressivizeTools: boolean = false;
+    @observable private openMovementDropdown: boolean = false;
+    @observable private openEffectDropdown: boolean = false;
+    @observable private presentTools: boolean = false;
+    @computed get childDocs() { return DocListCast(this.dataDoc[this.fieldKey]); }
+    @computed get tagDocs() {
+        const tagDocs: Doc[] = [];
+        for (const doc of this.childDocs) {
+            const tagDoc = Cast(doc.presentationTargetDoc, Doc, null);
+            tagDocs.push(tagDoc);
+        }
+        return tagDocs;
+    }
+    @computed get itemIndex() { return NumCast(this.rootDoc._itemIndex); }
+    @computed get activeItem() { return Cast(this.childDocs[NumCast(this.rootDoc._itemIndex)], Doc, null); }
+    @computed get targetDoc() { return Cast(this.activeItem?.presentationTargetDoc, Doc, null); }
+    @computed get scrollable(): boolean {
+        if (this.targetDoc.type === DocumentType.PDF || this.targetDoc.type === DocumentType.WEB || this.targetDoc.type === DocumentType.RTF || this.targetDoc._viewType === CollectionViewType.Stacking) return true;
+        else return false;
+    }
+    @computed get panable(): boolean {
+        if ((this.targetDoc.type === DocumentType.COL && this.targetDoc._viewType === CollectionViewType.Freeform) || this.targetDoc.type === DocumentType.IMG) return true;
+        else return false;
+    }
+    @computed get presElement() { return Cast(Doc.UserDoc().presElement, Doc, null); }
+    constructor(props: any) {
+        super(props);
+        if (Doc.UserDoc().activePresentation = this.rootDoc) runInAction(() => PresBox.Instance = this);
+        if (!this.presElement) { // create exactly one presElmentBox template to use by any and all presentations.
+            Doc.UserDoc().presElement = new PrefetchProxy(Docs.Create.PresElementBoxDocument({
+                title: "pres element template", type: DocumentType.PRESELEMENT, _xMargin: 0, isTemplateDoc: true, isTemplateForField: "data"
+            }));
+            // this script will be called by each presElement to get rendering-specific info that the PresBox knows about but which isn't written to the PresElement
+            // this is a design choice -- we could write this data to the presElements which would require a reaction to keep it up to date, and it would prevent
+            // the preselement docs from being part of multiple presentations since they would all have the same field, or we'd have to keep per-presentation data
+            // stored on each pres element.
+            (this.presElement as Doc).lookupField = ScriptField.MakeFunction("lookupPresBoxField(container, field, data)",
+                { field: "string", data: Doc.name, container: Doc.name });
+        }
+        this.props.Document.presentationFieldKey = this.fieldKey; // provide info to the presElement script so that it can look up rendering information about the presBox
+    }
+    @computed get selectedDocumentView() {
+        if (SelectionManager.Views().length) return SelectionManager.Views()[0];
+        if (this._selectedArray.size) return DocumentManager.Instance.getDocumentView(this.rootDoc);
+    }
+    @computed get isPres(): boolean {
+        document.removeEventListener("keydown", PresBox.keyEventsWrapper, true);
+        if (this.selectedDoc?.type === DocumentType.PRES) {
+            document.removeEventListener("keydown", PresBox.keyEventsWrapper, true);
+            document.addEventListener("keydown", PresBox.keyEventsWrapper, true);
+            return true;
+        }
+        return false;
+    }
+    @computed get selectedDoc() { return this.selectedDocumentView?.rootDoc; }
+
+    @action
+    componentWillUnmount() {
+        document.removeEventListener("keydown", PresBox.keyEventsWrapper, true);
+        this._presKeyEventsActive = false;
+        this.resetPresentation();
+        // Turn of progressivize editors
+        this.turnOffEdit(true);
+        Object.values(this._disposers).forEach(disposer => disposer?.());
+    }
+
+    @action
+    componentDidMount() {
+        this.rootDoc.presBox = this.rootDoc;
+        this.rootDoc._forceRenderEngine = "timeline";
+        this.layoutDoc.presStatus = PresStatus.Edit;
+        this.layoutDoc._gridGap = 0;
+        this.layoutDoc._yMargin = 0;
+        this.turnOffEdit(true);
+        DocListCastAsync((Doc.UserDoc().myPresentations as Doc).data).then(pres =>
+            !pres?.includes(this.rootDoc) && Doc.AddDocToList(Doc.UserDoc().myPresentations as Doc, "data", this.rootDoc));
+        this._disposers.selection = reaction(() => SelectionManager.Views(),
+            views => views.some(view => view.props.Document === this.rootDoc) && this.updateCurrentPresentation());
+    }
+
+    @action
+    updateCurrentPresentation = (pres?: Doc) => {
+        if (pres) Doc.UserDoc().activePresentation = pres;
+        else Doc.UserDoc().activePresentation = this.rootDoc;
+        document.removeEventListener("keydown", PresBox.keyEventsWrapper, true);
+        document.addEventListener("keydown", PresBox.keyEventsWrapper, true);
+        this._presKeyEventsActive = true;
+        PresBox.Instance = this;
+    }
+
+    // There are still other internal frames and should go through all frames before going to next slide
+    nextInternalFrame = (targetDoc: Doc, activeItem: Doc) => {
+        const currentFrame = Cast(targetDoc?._currentFrame, "number", null);
+        const childDocs = DocListCast(targetDoc[Doc.LayoutFieldKey(targetDoc)]);
+        targetDoc._viewTransition = "all 1s";
+        setTimeout(() => targetDoc._viewTransition = undefined, 1010);
+        this.nextKeyframe(targetDoc, activeItem);
+        if (activeItem.presProgressivize) CollectionFreeFormDocumentView.updateKeyframe(childDocs, currentFrame || 0, targetDoc);
+        else targetDoc.keyFrameEditing = true;
+    }
+
+    _mediaTimer!: [NodeJS.Timeout, Doc];
+    // 'Play on next' for audio or video therefore first navigate to the audio/video before it should be played
+    startTempMedia = (targetDoc: Doc, activeItem: Doc) => {
+        const duration: number = NumCast(activeItem.presEndTime) - NumCast(activeItem.presStartTime);
+        if ([DocumentType.VID, DocumentType.AUDIO].includes(targetDoc.type as any)) {
+            const targMedia = DocumentManager.Instance.getDocumentView(targetDoc);
+            targMedia?.ComponentView?.playFrom?.(NumCast(activeItem.presStartTime), NumCast(activeItem.presStartTime) + duration);
+        }
+        // if (targetDoc.type === DocumentType.AUDIO) {
+        //     if (this._mediaTimer && this._mediaTimer[1] === targetDoc) clearTimeout(this._mediaTimer[0]);
+        //     targetDoc._triggerAudio = NumCast(activeItem.presStartTime);
+        //     this._mediaTimer = [setTimeout(() => targetDoc._audioStop = true, duration * 1000), targetDoc];
+        // } else if (targetDoc.type === DocumentType.VID) {
+        //     targetDoc._triggerVideoStop = true;
+        //     setTimeout(() => targetDoc._currentTimecode = NumCast(activeItem.presStartTime), 10);
+        //     setTimeout(() => targetDoc._triggerVideo = true, 20);
+        //     this._mediaTimer = [setTimeout(() => targetDoc._triggerVideoStop = true, (duration * 1000) + 20), targetDoc];
+        // }
+    }
+
+    stopTempMedia = (targetDocField: FieldResult) => {
+        const targetDoc = Cast(targetDocField, Doc, null);
+        if (targetDoc?.type === DocumentType.AUDIO) {
+            if (this._mediaTimer && this._mediaTimer[1] === targetDoc) clearTimeout(this._mediaTimer[0]);
+            targetDoc._audioStop = true;
+        } else if (targetDoc?.type === DocumentType.VID) {
+            if (this._mediaTimer && this._mediaTimer[1] === targetDoc) clearTimeout(this._mediaTimer[0]);
+            targetDoc._triggerVideoStop = true;
+        }
+    }
+
+    // No more frames in current doc and next slide is defined, therefore move to next slide 
+    nextSlide = (activeNext: Doc) => {
+        const targetNext = Cast(activeNext.presentationTargetDoc, Doc, null);
+        let nextSelected = this.itemIndex + 1;
+        this.gotoDocument(nextSelected, this.activeItem);
+        for (nextSelected = nextSelected + 1; nextSelected < this.childDocs.length; nextSelected++) {
+            if (!this.childDocs[nextSelected].groupWithUp) {
+                break;
+            } else {
+                console.log("Title: " + this.childDocs[nextSelected].title);
+                this.gotoDocument(nextSelected, this.activeItem, true);
+            }
+        }
+    }
+
+    // Called when the user activates 'next' - to move to the next part of the pres. trail
+    @action
+    next = () => {
+        const activeNext = Cast(this.childDocs[this.itemIndex + 1], Doc, null);
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        const lastFrame = Cast(targetDoc?.lastFrame, "number", null);
+        const curFrame = NumCast(targetDoc?._currentFrame);
+        let internalFrames: boolean = false;
+        if (activeItem.presProgressivize || activeItem.zoomProgressivize || targetDoc.scrollProgressivize) internalFrames = true;
+        if (internalFrames && lastFrame !== undefined && curFrame < lastFrame) {
+            // Case 1: There are still other frames and should go through all frames before going to next slide
+            this.nextInternalFrame(targetDoc, activeItem);
+        } else if (this.childDocs[this.itemIndex + 1] !== undefined) {
+            // Case 2: No more frames in current doc and next slide is defined, therefore move to next slide 
+            this.nextSlide(activeNext);
+        } else if (this.childDocs[this.itemIndex + 1] === undefined && (this.layoutDoc.presLoop || this.layoutDoc.presStatus === PresStatus.Edit)) {
+            // Case 3: Last slide and presLoop is toggled ON or it is in Edit mode
+            this.gotoDocument(0, this.activeItem);
+        }
+    }
+
+    // Called when the user activates 'back' - to move to the previous part of the pres. trail
+    @action
+    back = () => {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        const prevItem = Cast(this.childDocs[Math.max(0, this.itemIndex - 1)], Doc, null);
+        const prevTargetDoc = Cast(prevItem.presentationTargetDoc, Doc, null);
+        const lastFrame = Cast(targetDoc.lastFrame, "number", null);
+        const curFrame = NumCast(targetDoc._currentFrame);
+        let prevSelected = this.itemIndex;
+        // Functionality for group with up
+        let didZoom = activeItem.presMovement;
+        for (; !didZoom && prevSelected > 0 && this.childDocs[prevSelected].groupButton; prevSelected--) {
+            didZoom = this.childDocs[prevSelected].presMovement;
+        }
+        if (lastFrame !== undefined && curFrame >= 1) {
+            // Case 1: There are still other frames and should go through all frames before going to previous slide
+            this.prevKeyframe(targetDoc, activeItem);
+        } else if (activeItem && this.childDocs[this.itemIndex - 1] !== undefined) {
+            // Case 2: There are no other frames so it should go to the previous slide
+            prevSelected = Math.max(0, prevSelected - 1);
+            this.gotoDocument(prevSelected, activeItem);
+            if (NumCast(prevTargetDoc.lastFrame) > 0) prevTargetDoc._currentFrame = NumCast(prevTargetDoc.lastFrame);
+        } else if (this.childDocs[this.itemIndex - 1] === undefined && this.layoutDoc.presLoop) {
+            // Case 3: Pres loop is on so it should go to the last slide
+            this.gotoDocument(this.childDocs.length - 1, activeItem);
+        }
+    }
+
+    //The function that is called when a document is clicked or reached through next or back.
+    //it'll also execute the necessary actions if presentation is playing.
+    public gotoDocument = action((index: number, from?: Doc, group?: boolean) => {
+        Doc.UnBrushAllDocs();
+        if (index >= 0 && index < this.childDocs.length) {
+            this.rootDoc._itemIndex = index;
+            const activeItem: Doc = this.activeItem;
+            const targetDoc: Doc = this.targetDoc;
+            if (from?.mediaStopTriggerList && this.layoutDoc.presStatus !== PresStatus.Edit) {
+                DocListCast(from.mediaStopTriggerList).forEach(this.stopTempMedia);
+            }
+            if (from?.mediaStop === "auto" && this.layoutDoc.presStatus !== PresStatus.Edit) {
+                this.stopTempMedia(from.presentationTargetDoc);
+            }
+            // If next slide is audio / video 'Play automatically' then the next slide should be played
+            if (this.layoutDoc.presStatus !== PresStatus.Edit && (targetDoc.type === DocumentType.AUDIO || targetDoc.type === DocumentType.VID) && (activeItem.mediaStart === "auto")) {
+                this.startTempMedia(targetDoc, activeItem);
+            }
+            if (targetDoc) {
+                targetDoc && runInAction(() => {
+                    if (activeItem.presMovement === PresMovement.Jump) targetDoc.focusSpeed = 0;
+                    else targetDoc.focusSpeed = activeItem.presTransition ? activeItem.presTransition : 500;
+                });
+                setTimeout(() => targetDoc.focusSpeed = 500, this.activeItem.presTransition ? NumCast(this.activeItem.presTransition) + 10 : 510);
+            }
+            if (targetDoc?.lastFrame !== undefined) {
+                targetDoc._currentFrame = 0;
+            }
+            if (!group) this._selectedArray.clear();
+            this.childDocs[index] && this._selectedArray.set(this.childDocs[index], undefined); //Update selected array
+            if (this.layoutDoc._viewType === "stacking" && !group) this.navigateToElement(this.childDocs[index]); //Handles movement to element only when presTrail is list
+            this.onHideDocument(); //Handles hide after/before
+        }
+    });
+
+    _navTimer!: NodeJS.Timeout;
+    navigateToView = (targetDoc: Doc, activeItem: Doc) => {
+        clearTimeout(this._navTimer);
+        const bestTarget = DocumentManager.Instance.getFirstDocumentView(targetDoc)?.props.Document;
+        bestTarget && runInAction(() => {
+            if (bestTarget.type === DocumentType.PDF || bestTarget.type === DocumentType.WEB || bestTarget.type === DocumentType.RTF || bestTarget._viewType === CollectionViewType.Stacking) {
+                bestTarget._viewTransition = activeItem.presTransition ? `transform ${activeItem.presTransition}ms` : 'all 0.5s';
+                bestTarget._scrollTop = activeItem.presPinViewScroll;
+            } else if (bestTarget.type === DocumentType.COMPARISON) {
+                bestTarget._clipWidth = activeItem.presPinClipWidth;
+            } else if (bestTarget.type === DocumentType.VID) {
+                bestTarget._currentTimecode = activeItem.presPinTimecode;
+            } else {
+                bestTarget._viewTransition = activeItem.presTransition ? `transform ${activeItem.presTransition}ms` : 'all 0.5s';
+                bestTarget._panX = activeItem.presPinViewX;
+                bestTarget._panY = activeItem.presPinViewY;
+                bestTarget._viewScale = activeItem.presPinViewScale;
+            }
+            this._navTimer = setTimeout(() => bestTarget._viewTransition = undefined, activeItem.presTransition ? NumCast(activeItem.presTransition) + 10 : 510);
+        });
+    }
+
+    /**
+     * This method makes sure that cursor navigates to the element that
+     * has the option open and last in the group. 
+     * Design choice: If the next document is not in presCollection or 
+     * presCollection itself then if there is a presCollection it will add
+     * a new tab. If presCollection is undefined it will open the document
+     * on the right. 
+     */
+    navigateToElement = async (curDoc: Doc) => {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        const srcContext = Cast(targetDoc.context, Doc, null);
+        const presCollection = Cast(this.layoutDoc.presCollection, Doc, null);
+        const collectionDocView = presCollection ? DocumentManager.Instance.getDocumentView(presCollection) : undefined;
+        const includesDoc: boolean = DocListCast(presCollection?.data).includes(targetDoc);
+        const tab = Array.from(CollectionDockingView.Instance.tabMap).find(tab => tab.DashDoc === srcContext);
+        this.turnOffEdit();
+        // Handles the setting of presCollection
+        if (includesDoc) {
+            //Case 1: Pres collection should not change as it is already the same
+        } else if (tab !== undefined) {
+            // Case 2: Pres collection should update
+            this.layoutDoc.presCollection = srcContext;
+        }
+        const presStatus = this.rootDoc.presStatus;
+        const selViewCache = Array.from(this._selectedArray.keys());
+        const dragViewCache = Array.from(this._dragArray);
+        const eleViewCache = Array.from(this._eleArray);
+        const self = this;
+        const resetSelection = action(() => {
+            const presDocView = DocumentManager.Instance.getDocumentView(self.rootDoc);
+            if (presDocView) SelectionManager.SelectView(presDocView, false);
+            self.rootDoc.presStatus = presStatus;
+            self._selectedArray.clear();
+            selViewCache.forEach(doc => self._selectedArray.set(doc, undefined));
+            self._dragArray.splice(0, self._dragArray.length, ...dragViewCache);
+            self._eleArray.splice(0, self._eleArray.length, ...eleViewCache);
+        });
+        const openInTab = (doc: Doc, finished?: () => void) => {
+            collectionDocView ? collectionDocView.props.addDocTab(doc, "") : this.props.addDocTab(doc, ":left");
+            this.layoutDoc.presCollection = targetDoc;
+            // this still needs some fixing
+            setTimeout(resetSelection, 500);
+            if (doc !== targetDoc) {
+                setTimeout(finished ?? emptyFunction, 100); /// give it some time to create the targetDoc if we're opening up its context
+            } else {
+                finished?.();
+            }
+        };
+        // If openDocument is selected then it should open the document for the user
+        if (activeItem.openDocument) {
+            LightboxView.SetLightboxDoc(targetDoc);
+        } else if (curDoc.presMovement === PresMovement.Pan && targetDoc) {
+            LightboxView.SetLightboxDoc(undefined);
+            await DocumentManager.Instance.jumpToDocument(targetDoc, false, openInTab, srcContext, undefined, undefined, undefined, includesDoc || tab ? undefined : resetSelection); // documents open in new tab instead of on right
+        } else if ((curDoc.presMovement === PresMovement.Zoom || curDoc.presMovement === PresMovement.Jump) && targetDoc) {
+            LightboxView.SetLightboxDoc(undefined);
+            //awaiting jump so that new scale can be found, since jumping is async     
+            await DocumentManager.Instance.jumpToDocument(targetDoc, true, openInTab, srcContext, undefined, undefined, undefined, includesDoc || tab ? undefined : resetSelection); // documents open in new tab instead of on right    
+        }
+        // After navigating to the document, if it is added as a presPinView then it will
+        // adjust the pan and scale to that of the pinView when it was added.
+        if (activeItem.presPinView) {
+            // if targetDoc is not displayed but one of its aliases is, then we need to modify that alias, not the original target
+            this.navigateToView(targetDoc, activeItem);
+        }
+        // TODO: Add progressivize for navigating web (storing websites for given frames)
+
+    }
+
+    /**
+     * Uses the viewfinder to progressivize through the different views of a single collection.
+     * @param presTargetDoc: document for which internal zoom is used
+     */
+    zoomProgressivizeNext = (activeItem: Doc) => {
+        const targetDoc: Doc = this.targetDoc;
+        const srcContext = Cast(targetDoc?.context, Doc, null);
+        const docView = DocumentManager.Instance.getDocumentView(targetDoc);
+        const vfLeft = this.checkList(targetDoc, activeItem["viewfinder-left-indexed"]);
+        const vfWidth = this.checkList(targetDoc, activeItem["viewfinder-width-indexed"]);
+        const vfTop = this.checkList(targetDoc, activeItem["viewfinder-top-indexed"]);
+        const vfHeight = this.checkList(targetDoc, activeItem["viewfinder-height-indexed"]);
+        // Case 1: document that is not a Golden Layout tab
+        if (srcContext) {
+            const srcDocView = DocumentManager.Instance.getDocumentView(srcContext);
+            if (srcDocView) {
+                const layoutdoc = Doc.Layout(targetDoc);
+                const panelWidth: number = srcDocView.props.PanelWidth();
+                const panelHeight: number = srcDocView.props.PanelHeight();
+                const newPanX = NumCast(targetDoc.x) + NumCast(layoutdoc._width) / 2;
+                const newPanY = NumCast(targetDoc.y) + NumCast(layoutdoc._height) / 2;
+                const newScale = 0.9 * Math.min(Number(panelWidth) / vfWidth, Number(panelHeight) / vfHeight);
+                srcContext._panX = newPanX + (vfLeft + (vfWidth / 2));
+                srcContext._panY = newPanY + (vfTop + (vfHeight / 2));
+                srcContext._viewScale = newScale;
+            }
+        }
+        // Case 2: document is the containing collection
+        if (docView && !srcContext) {
+            const panelWidth: number = docView.props.PanelWidth();
+            const panelHeight: number = docView.props.PanelHeight();
+            const newScale = 0.9 * Math.min(Number(panelWidth) / vfWidth, Number(panelHeight) / vfHeight);
+            targetDoc._panX = vfLeft + (vfWidth / 2);
+            targetDoc._panY = vfTop + (vfWidth / 2);
+            targetDoc._viewScale = newScale;
+        }
+        const resize = document.getElementById('resizable');
+        if (resize) {
+            resize.style.width = vfWidth + 'px';
+            resize.style.height = vfHeight + 'px';
+            resize.style.top = vfTop + 'px';
+            resize.style.left = vfLeft + 'px';
+        }
+    }
+
+    /**
+     * For 'Hide Before' and 'Hide After' buttons making sure that
+     * they are hidden each time the presentation is updated.
+     */
+    @action
+    onHideDocument = () => {
+        this.childDocs.forEach((doc, index) => {
+            const curDoc = Cast(doc, Doc, null);
+            const tagDoc = Cast(curDoc.presentationTargetDoc, Doc, null);
+            if (tagDoc) tagDoc.opacity = 1;
+            const itemIndexes: number[] = this.getAllIndexes(this.tagDocs, tagDoc);
+            const curInd: number = itemIndexes.indexOf(index);
+            if (tagDoc === this.layoutDoc.presCollection) { tagDoc.opacity = 1; }
+            else {
+                if (itemIndexes.length > 1 && curDoc.presHideBefore && curInd !== 0) { }
+                else if (curDoc.presHideBefore) {
+                    if (index > this.itemIndex) {
+                        tagDoc.opacity = 0;
+                    } else if (!curDoc.presHideAfter) {
+                        tagDoc.opacity = 1;
+                    }
+                }
+                if (itemIndexes.length > 1 && curDoc.presHideAfter && curInd !== (itemIndexes.length - 1)) { }
+                else if (curDoc.presHideAfter) {
+                    if (index < this.itemIndex) {
+                        tagDoc.opacity = 0;
+                    } else if (!curDoc.presHideBefore) {
+                        tagDoc.opacity = 1;
+                    }
+                }
+            }
+        });
+    }
+
+
+
+    //The function that starts or resets presentaton functionally, depending on presStatus of the layoutDoc
+    @action
+    startAutoPres = (startSlide: number) => {
+        this.updateCurrentPresentation();
+        let activeItem: Doc = this.activeItem;
+        let targetDoc: Doc = this.targetDoc;
+        let duration = NumCast(activeItem.presDuration) + NumCast(activeItem.presTransition);
+        const timer = (ms: number) => new Promise(res => this._presTimer = setTimeout(res, ms));
+        const load = async () => { // Wrap the loop into an async function for this to work
+            for (var i = startSlide; i < this.childDocs.length; i++) {
+                activeItem = Cast(this.childDocs[this.itemIndex], Doc, null);
+                targetDoc = Cast(activeItem.presentationTargetDoc, Doc, null);
+                duration = NumCast(activeItem.presDuration) + NumCast(activeItem.presTransition);
+                if (duration < 100) { duration = 2500; }
+                if (NumCast(targetDoc.lastFrame) > 0) {
+                    for (var f = 0; f < NumCast(targetDoc.lastFrame); f++) {
+                        await timer(duration / NumCast(targetDoc.lastFrame));
+                        this.next();
+                    }
+                }
+
+                await timer(duration); this.next(); // then the created Promise can be awaited
+                if (i === this.childDocs.length - 1) {
+                    setTimeout(() => {
+                        clearTimeout(this._presTimer);
+                        if (this.layoutDoc.presStatus === 'auto' && !this.layoutDoc.presLoop) this.layoutDoc.presStatus = PresStatus.Manual;
+                        else if (this.layoutDoc.presLoop) this.startAutoPres(0);
+                    }, duration);
+                }
+            }
+        };
+        this.layoutDoc.presStatus = PresStatus.Autoplay;
+        this.startPresentation(startSlide);
+        this.gotoDocument(startSlide, activeItem);
+        load();
+    }
+
+    @action
+    pauseAutoPres = () => {
+        if (this.layoutDoc.presStatus === PresStatus.Autoplay) {
+            if (this._presTimer) clearTimeout(this._presTimer);
+            this.layoutDoc.presStatus = PresStatus.Manual;
+            this.layoutDoc.presLoop = false;
+            this.childDocs.forEach(this.stopTempMedia);
+        }
+    }
+
+    //The function that resets the presentation by removing every action done by it. It also
+    //stops the presentaton.
+    resetPresentation = () => {
+        this.rootDoc._itemIndex = 0;
+        this.childDocs.map(doc => Cast(doc.presentationTargetDoc, Doc, null)).filter(doc => doc instanceof Doc).forEach(doc => {
+            try {
+                doc.opacity = 1;
+            } catch (e) {
+                console.log("Reset presentation error: ", e);
+            }
+        });
+    }
+
+    @action togglePath = (srcContext: Doc, off?: boolean) => {
+        if (off) {
+            this._pathBoolean = false;
+            srcContext.presPathView = false;
+        } else {
+            runInAction(() => this._pathBoolean = !this._pathBoolean);
+            srcContext.presPathView = this._pathBoolean;
+        }
+    }
+
+    @action toggleExpandMode = () => {
+        runInAction(() => this._expandBoolean = !this._expandBoolean);
+        this.rootDoc.expandBoolean = this._expandBoolean;
+        this.childDocs.forEach((doc) => {
+            doc.presExpandInlineButton = this._expandBoolean;
+        });
+    }
+
+    /**
+     * The function that starts the presentation at the given index, also checking if actions should be applied
+     * directly at start.
+     * @param startIndex: index that the presentation will start at
+     */
+    startPresentation = (startIndex: number) => {
+        this.updateCurrentPresentation();
+        this.childDocs.map(doc => {
+            const tagDoc = doc.presentationTargetDoc as Doc;
+            if (doc.presHideBefore && this.childDocs.indexOf(doc) > startIndex) {
+                tagDoc.opacity = 0;
+            }
+            if (doc.presHideAfter && this.childDocs.indexOf(doc) < startIndex) {
+                tagDoc.opacity = 0;
+            }
+        });
+    }
+
+    /**
+     * The method called to open the presentation as a minimized view
+     */
+    @action
+    updateMinimize = () => {
+        const docView = DocumentManager.Instance.getDocumentView(this.layoutDoc);
+        if (CurrentUserUtils.OverlayDocs.includes(this.layoutDoc)) {
+            console.log("case 1");
+            this.layoutDoc.presStatus = PresStatus.Edit;
+            Doc.RemoveDocFromList((Doc.UserDoc().myOverlayDocs as Doc), undefined, this.rootDoc);
+            CollectionDockingView.AddSplit(this.rootDoc, "right");
+        } else if (this.layoutDoc.context && docView) {
+            console.log("case 2");
+            this.layoutDoc.presStatus = PresStatus.Edit;
+            clearTimeout(this._presTimer);
+            const pt = this.props.ScreenToLocalTransform().inverse().transformPoint(0, 0);
+            this.rootDoc.x = pt[0] + (this.props.PanelWidth() - 250);
+            this.rootDoc.y = pt[1] + 10;
+            this.rootDoc._height = 35;
+            this.rootDoc._width = 250;
+            docView.props.removeDocument?.(this.layoutDoc);
+            Doc.AddDocToList((Doc.UserDoc().myOverlayDocs as Doc), undefined, this.rootDoc);
+        } else {
+            console.log("case 3");
+            // TODO glr: fix this case
+        }
+    }
+
+    /**
+     * Called when the user changes the view type
+     * Either 'List' (stacking) or 'Slides' (carousel)
+     */
+    // @undoBatch
+    viewChanged = action((e: React.ChangeEvent) => {
+        //@ts-ignore
+        const viewType = e.target.selectedOptions[0].value as CollectionViewType;
+        // pivot field may be set by the user in timeline view (or some other way) -- need to reset it here
+        viewType === CollectionViewType.Stacking && (this.rootDoc._pivotField = undefined);
+        this.rootDoc._viewType = viewType;
+        if (viewType === CollectionViewType.Stacking) this.layoutDoc._gridGap = 0;
+    });
+
+    /**
+     * Called when the user changes the view type
+     * Either 'List' (stacking) or 'Slides' (carousel)
+     */
+    // @undoBatch
+    mediaStopChanged = action((e: React.ChangeEvent) => {
+        const activeItem: Doc = this.activeItem;
+        //@ts-ignore
+        const stopDoc = e.target.selectedOptions[0].value as string;
+        const stopDocIndex: number = Number(stopDoc[0]);
+        activeItem.mediaStopDoc = stopDocIndex;
+        if (this.childDocs[stopDocIndex - 1].mediaStopTriggerList) {
+            const list = DocListCast(this.childDocs[stopDocIndex - 1].mediaStopTriggerList);
+            list.push(activeItem);
+            // this.childDocs[stopDocIndex - 1].mediaStopTriggerList = list;
+            console.log(list);
+        } else {
+            this.childDocs[stopDocIndex - 1].mediaStopTriggerList = new List<Doc>();
+            const list = DocListCast(this.childDocs[stopDocIndex - 1].mediaStopTriggerList);
+            list.push(activeItem);
+            // this.childDocs[stopDocIndex - 1].mediaStopTriggerList = list;
+            console.log(list);
+        }
+    });
+
+
+    setMovementName = action((movement: any, activeItem: Doc): string => {
+        let output: string = 'none';
+        switch (movement) {
+            case PresMovement.Zoom: output = 'Pan & Zoom'; break; //Pan and zoom
+            case PresMovement.Pan: output = 'Pan'; break; //Pan
+            case PresMovement.Jump: output = 'Jump cut'; break; //Jump Cut
+            case PresMovement.None: output = 'None'; break; //None
+            default: output = 'Zoom'; activeItem.presMovement = 'zoom'; break; //default set as zoom
+        }
+        return output;
+    });
+
+    whenChildContentsActiveChanged = action((isActive: boolean) => this.props.whenChildContentsActiveChanged(this._isChildActive = isActive));
+    // For dragging documents into the presentation trail
+    addDocumentFilter = (docs: Doc[]) => {
+        docs.forEach((doc, i) => {
+            if (doc.presentationTargetDoc) return true;
+            if (doc.type === DocumentType.LABEL) {
+                const audio = Cast(doc.annotationOn, Doc, null);
+                if (audio) {
+                    audio.mediaStart = "manual";
+                    audio.mediaStop = "manual";
+                    audio.presStartTime = NumCast(doc._timecodeToShow /* audioStart */, NumCast(doc._timecodeToShow /* videoStart */));
+                    audio.presEndTime = NumCast(doc._timecodeToHide /* audioEnd */, NumCast(doc._timecodeToHide /* videoEnd */));
+                    audio.presDuration = audio.presStartTime - audio.presEndTime;
+                    TabDocView.PinDoc(audio, { audioRange: true });
+                    setTimeout(() => this.removeDocument(doc), 0);
+                    return false;
+                }
+            } else {
+                if (!doc.aliasOf) {
+                    const original = Doc.MakeAlias(doc);
+                    TabDocView.PinDoc(original);
+                    setTimeout(() => this.removeDocument(doc), 0);
+                    return false;
+                } else {
+                    if (!doc.presentationTargetDoc) doc.title = doc.title + " - Slide";
+                    doc.aliasOf instanceof Doc && (doc.presentationTargetDoc = doc.aliasOf);
+                    doc.presMovement = PresMovement.Zoom;
+                    if (this._expandBoolean) doc.presExpandInlineButton = true;
+                }
+            }
+        });
+        return true;
+    }
+    childLayoutTemplate = () => this.rootDoc._viewType !== CollectionViewType.Stacking ? undefined : this.presElement;
+    removeDocument = (doc: Doc) => Doc.RemoveDocFromList(this.dataDoc, this.fieldKey, doc);
+    getTransform = () => this.props.ScreenToLocalTransform().translate(-5, -65);// listBox padding-left and pres-box-cont minHeight
+    panelHeight = () => this.props.PanelHeight() - 40;
+    isContentActive = (outsideReaction?: boolean) => ((CurrentUserUtils.SelectedTool === InkTool.None && this.props.layerProvider?.(this.layoutDoc) !== false) &&
+        (this.layoutDoc.forceActive || this.props.isSelected(outsideReaction) || this._isChildActive || this.props.renderDepth === 0) ? true : false)
+
+    /**
+     * For sorting the array so that the order is maintained when it is dropped.
+     */
+    @action
+    sortArray = (): Doc[] => {
+        return this.childDocs.filter(doc => this._selectedArray.has(doc));
+    }
+
+    /**
+     * Method to get the list of selected items in the order in which they have been selected
+     */
+    @computed get listOfSelected() {
+        const list = Array.from(this._selectedArray.keys()).map((doc: Doc, index: any) => {
+            const curDoc = Cast(doc, Doc, null);
+            const tagDoc = Cast(curDoc.presentationTargetDoc, Doc, null);
+            if (curDoc && curDoc === this.activeItem) return <div key={index} className="selectedList-items"><b>{index + 1}.  {curDoc.title}</b></div>;
+            else if (tagDoc) return <div key={index} className="selectedList-items">{index + 1}.  {curDoc.title}</div>;
+            else if (curDoc) return <div key={index} className="selectedList-items">{index + 1}.  {curDoc.title}</div>;
+        });
+        return list;
+    }
+
+    @action
+    selectPres = () => {
+        const presDocView = DocumentManager.Instance.getDocumentView(this.rootDoc);
+        presDocView && SelectionManager.SelectView(presDocView, false);
+    }
+
+    //Regular click
+    @action
+    selectElement = async (doc: Doc) => {
+        const context = Cast(doc.context, Doc, null);
+        this.gotoDocument(this.childDocs.indexOf(doc), this.activeItem);
+        if (doc.presPinView || doc.presentationTargetDoc === this.layoutDoc.presCollection) setTimeout(() => this.updateCurrentPresentation(context), 0);
+        else this.updateCurrentPresentation(context);
+
+        if (this.activeItem.setPosition &&
+            this.activeItem.y !== undefined &&
+            this.activeItem.x !== undefined &&
+            this.targetDoc.x !== undefined &&
+            this.targetDoc.y !== undefined) {
+            const timer = (ms: number) => new Promise(res => this._presTimer = setTimeout(res, ms));
+            const time = 10;
+            const ydiff = NumCast(this.activeItem.y) - NumCast(this.targetDoc.y);
+            const xdiff = NumCast(this.activeItem.x) - NumCast(this.targetDoc.x);
+
+            for (let i = 0; i < time; i++) {
+                this.targetDoc.x = NumCast(this.targetDoc.x) + xdiff / time;
+                this.targetDoc.y = NumCast(this.targetDoc.y) + ydiff / time;
+                await timer(0.1);
+            }
+        }
+    }
+
+    //Command click
+    @action
+    multiSelect = (doc: Doc, ref: HTMLElement, drag: HTMLElement) => {
+        if (!this._selectedArray.has(doc)) {
+            this._selectedArray.set(doc, undefined);
+            this._eleArray.push(ref);
+            this._dragArray.push(drag);
+        } else {
+            this._selectedArray.delete(doc);
+            this.removeFromArray(this._eleArray, doc);
+            this.removeFromArray(this._dragArray, doc);
+        }
+        this.selectPres();
+    }
+
+    removeFromArray = (arr: any[], val: any) => {
+        const index: number = arr.indexOf(val);
+        const ret: any[] = arr.splice(index, 1);
+        arr = ret;
+    }
+
+    //Shift click
+    @action
+    shiftSelect = (doc: Doc, ref: HTMLElement, drag: HTMLElement) => {
+        this._selectedArray.clear();
+        // const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null);
+        if (this.activeItem) {
+            for (let i = Math.min(this.itemIndex, this.childDocs.indexOf(doc)); i <= Math.max(this.itemIndex, this.childDocs.indexOf(doc)); i++) {
+                this._selectedArray.set(this.childDocs[i], undefined);
+                this._eleArray.push(ref);
+                this._dragArray.push(drag);
+            }
+        }
+        this.selectPres();
+    }
+
+    //regular click
+    @action
+    regularSelect = (doc: Doc, ref: HTMLElement, drag: HTMLElement, focus: boolean) => {
+        this._selectedArray.clear();
+        this._selectedArray.set(doc, undefined);
+        this._eleArray.splice(0, this._eleArray.length, ref);
+        this._dragArray.splice(0, this._dragArray.length, drag);
+        focus && this.selectElement(doc);
+        this.selectPres();
+    }
+
+    modifierSelect = (doc: Doc, ref: HTMLElement, drag: HTMLElement, focus: boolean, cmdClick: boolean, shiftClick: boolean) => {
+        if (cmdClick) this.multiSelect(doc, ref, drag);
+        else if (shiftClick) this.shiftSelect(doc, ref, drag);
+        else this.regularSelect(doc, ref, drag, focus);
+    }
+
+    static keyEventsWrapper = (e: KeyboardEvent) => {
+        PresBox.Instance.keyEvents(e);
+    }
+
+    // Key for when the presentaiton is active
+    @action
+    keyEvents = (e: KeyboardEvent) => {
+        if (e.target instanceof HTMLInputElement) return;
+        let handled = false;
+        const anchorNode = document.activeElement as HTMLDivElement;
+        if (anchorNode && anchorNode.className?.includes("lm_title")) return;
+        switch (e.key) {
+            case "Backspace":
+                if (this.layoutDoc.presStatus === "edit") {
+                    undoBatch(action(() => {
+                        for (const doc of Array.from(this._selectedArray.keys())) {
+                            this.removeDocument(doc);
+                        }
+                        this._selectedArray.clear();
+                        this._eleArray.length = 0;
+                        this._dragArray.length = 0;
+                    }))();
+                    handled = true;
+                }
+                break;
+            case "Escape":
+                if (CurrentUserUtils.OverlayDocs.includes(this.layoutDoc)) { this.updateMinimize(); }
+                else if (this.layoutDoc.presStatus === "edit") { this._selectedArray.clear(); this._eleArray.length = this._dragArray.length = 0; }
+                else this.layoutDoc.presStatus = "edit";
+                if (this._presTimer) clearTimeout(this._presTimer);
+                handled = true;
+                break;
+            case "Down": case "ArrowDown":
+            case "Right": case "ArrowRight":
+                if (e.shiftKey && this.itemIndex < this.childDocs.length - 1) { // TODO: update to work properly
+                    this.rootDoc._itemIndex = NumCast(this.rootDoc._itemIndex) + 1;
+                    this._selectedArray.set(this.childDocs[this.rootDoc._itemIndex], undefined);
+                } else {
+                    this.next();
+                    if (this._presTimer) { clearTimeout(this._presTimer); this.layoutDoc.presStatus = PresStatus.Manual; }
+                }
+                handled = true;
+                break;
+            case "Up": case "ArrowUp":
+            case "Left": case "ArrowLeft":
+                if (e.shiftKey && this.itemIndex !== 0) { // TODO: update to work properly
+                    this.rootDoc._itemIndex = NumCast(this.rootDoc._itemIndex) - 1;
+                    this._selectedArray.set(this.childDocs[this.rootDoc._itemIndex], undefined);
+                } else {
+                    this.back();
+                    if (this._presTimer) { clearTimeout(this._presTimer); this.layoutDoc.presStatus = PresStatus.Manual; }
+                }
+                handled = true;
+                break;
+            case "Spacebar": case " ":
+                if (this.layoutDoc.presStatus === PresStatus.Manual) this.startAutoPres(this.itemIndex);
+                else if (this.layoutDoc.presStatus === PresStatus.Autoplay) if (this._presTimer) clearTimeout(this._presTimer);
+                handled = true;
+                break;
+            case "a":
+                if ((e.metaKey || e.altKey) && this.layoutDoc.presStatus === "edit") {
+                    this._selectedArray.clear();
+                    this.childDocs.forEach(doc => this._selectedArray.set(doc, undefined));
+                    handled = true;
+                }
+            default:
+                break;
+        }
+        if (handled) {
+            e.stopPropagation();
+            e.preventDefault();
+        }
+    }
+
+    /**
+     * 
+     */
+    @action
+    viewPaths = () => {
+        const srcContext = Cast(this.rootDoc.presCollection, Doc, null);
+        if (srcContext) {
+            this.togglePath(srcContext);
+        }
+    }
+
+    getAllIndexes = (arr: Doc[], val: Doc): number[] => {
+        const indexes = [];
+        for (let i = 0; i < arr.length; i++) {
+            arr[i] === val && indexes.push(i);
+        }
+        return indexes;
+    }
+
+    // Adds the index in the pres path graphically
+    @computed get order() {
+        const order: JSX.Element[] = [];
+        const docs: Doc[] = [];
+        const presCollection = Cast(this.rootDoc.presCollection, Doc, null);
+        const dv = DocumentManager.Instance.getDocumentView(presCollection);
+        this.childDocs.filter(doc => Cast(doc.presentationTargetDoc, Doc, null)).forEach((doc, index) => {
+            const tagDoc = Cast(doc.presentationTargetDoc, Doc, null);
+            const srcContext = Cast(tagDoc.context, Doc, null);
+            const width = NumCast(tagDoc._width) / 10;
+            const height = Math.max(NumCast(tagDoc._height) / 10, 15);
+            const edge = Math.max(width, height);
+            const fontSize = edge * 0.8;
+            const gap = 2;
+            if (presCollection === srcContext) {
+                // Case A: Document is contained within the collection
+                if (docs.includes(tagDoc)) {
+                    const prevOccurances: number = this.getAllIndexes(docs, tagDoc).length;
+                    docs.push(tagDoc);
+                    order.push(
+                        <div className="pathOrder"
+                            key={tagDoc.id + 'pres' + index}
+                            style={{ top: NumCast(tagDoc.y) + (prevOccurances * (edge + gap) - (edge / 2)), left: NumCast(tagDoc.x) - (edge / 2), width: edge, height: edge, fontSize: fontSize }}
+                            onClick={() => this.selectElement(doc)}>
+                            <div className="pathOrder-frame">{index + 1}</div>
+                        </div>);
+                } else {
+                    docs.push(tagDoc);
+                    order.push(
+                        <div className="pathOrder"
+                            key={tagDoc.id + 'pres' + index}
+                            style={{ top: NumCast(tagDoc.y) - (edge / 2), left: NumCast(tagDoc.x) - (edge / 2), width: edge, height: edge, fontSize: fontSize }}
+                            onClick={() => this.selectElement(doc)}>
+                            <div className="pathOrder-frame">{index + 1}</div>
+                        </div>);
+                }
+            } else if (doc.presPinView && presCollection === tagDoc && dv) {
+                // Case B: Document is presPinView and is presCollection
+                const scale: number = 1 / NumCast(doc.presPinViewScale);
+                const height: number = dv.props.PanelHeight() * scale;
+                const width: number = dv.props.PanelWidth() * scale;
+                const indWidth = width / 10;
+                const indHeight = Math.max(height / 10, 15);
+                const indEdge = Math.max(indWidth, indHeight);
+                const indFontSize = indEdge * 0.8;
+                const xLoc: number = NumCast(doc.presPinViewX) - (width / 2);
+                const yLoc: number = NumCast(doc.presPinViewY) - (height / 2);
+                docs.push(tagDoc);
+                order.push(
+                    <>
+                        <div className="pathOrder"
+                            key={tagDoc.id + 'pres' + index}
+                            style={{ top: yLoc - (indEdge / 2), left: xLoc - (indEdge / 2), width: indEdge, height: indEdge, fontSize: indFontSize }}
+                            onClick={() => this.selectElement(doc)}
+                        >
+                            <div className="pathOrder-frame">{index + 1}</div>
+                        </div>
+                        <div className="pathOrder-presPinView" style={{ top: yLoc, left: xLoc, width: width, height: height, borderWidth: indEdge / 10 }}></div>
+                    </>);
+            }
+        });
+        return order;
+    }
+
+    /**
+     * Method called for viewing paths which adds a single line with
+     * points at the center of each document added.
+     * Design choice: When this is called it sets _fitToBox as true so the
+     * user can have an overview of all of the documents in the collection.
+     * (Design needed for when documents in presentation trail are in another
+     * collection)
+     */
+    @computed get paths() {
+        let pathPoints = "";
+        const presCollection = Cast(this.rootDoc.presCollection, Doc, null);
+        this.childDocs.forEach((doc, index) => {
+            const tagDoc = Cast(doc.presentationTargetDoc, Doc, null);
+            const srcContext = Cast(tagDoc?.context, Doc, null);
+            if (tagDoc && presCollection === srcContext) {
+                const n1x = NumCast(tagDoc.x) + (NumCast(tagDoc._width) / 2);
+                const n1y = NumCast(tagDoc.y) + (NumCast(tagDoc._height) / 2);
+                if (index = 0) pathPoints = n1x + "," + n1y;
+                else pathPoints = pathPoints + " " + n1x + "," + n1y;
+            } else if (doc.presPinView && presCollection === tagDoc) {
+                const n1x = NumCast(doc.presPinViewX);
+                const n1y = NumCast(doc.presPinViewY);
+                if (index = 0) pathPoints = n1x + "," + n1y;
+                else pathPoints = pathPoints + " " + n1x + "," + n1y;
+            }
+        });
+        return (<polyline
+            points={pathPoints}
+            style={{
+                opacity: 1,
+                stroke: "#69a6db",
+                strokeWidth: 5,
+                strokeDasharray: '10 5',
+                boxShadow: '0px 4px 4px rgba(0, 0, 0, 0.25)',
+            }}
+            fill="none"
+            markerStart="url(#markerArrow)"
+            markerMid="url(#markerSquare)"
+            markerEnd="url(#markerSquareFilled)"
+        />);
+    }
+
+    // Converts seconds to ms and updates presTransition
+    setTransitionTime = (number: String, change?: number) => {
+        let timeInMS = Number(number) * 1000;
+        if (change) timeInMS += change;
+        if (timeInMS < 100) timeInMS = 100;
+        if (timeInMS > 10000) timeInMS = 10000;
+        Array.from(this._selectedArray.keys()).forEach((doc) => doc.presTransition = timeInMS);
+    }
+
+    // Converts seconds to ms and updates presDuration
+    setDurationTime = (number: String, change?: number) => {
+        let timeInMS = Number(number) * 1000;
+        if (change) timeInMS += change;
+        if (timeInMS < 100) timeInMS = 100;
+        if (timeInMS > 20000) timeInMS = 20000;
+        Array.from(this._selectedArray.keys()).forEach((doc) => doc.presDuration = timeInMS);
+    }
+
+    /**
+     * When the movement dropdown is changes
+     */
+    @undoBatch
+    updateMovement = action((movement: any, all?: boolean) => {
+        const array: any[] = all ? this.childDocs : Array.from(this._selectedArray.keys());
+        array.forEach((doc) => {
+            switch (movement) {
+                case PresMovement.Zoom: //Pan and zoom
+                    doc.presMovement = PresMovement.Zoom;
+                    break;
+                case PresMovement.Pan: //Pan
+                    doc.presMovement = PresMovement.Pan;
+                    break;
+                case PresMovement.Jump: //Jump Cut
+                    doc.presJump = true;
+                    doc.presMovement = PresMovement.Jump;
+                    break;
+                case PresMovement.None: default:
+                    doc.presMovement = PresMovement.None;
+                    break;
+            }
+        });
+    });
+
+    @undoBatch
+    @action
+    updateHideBefore = (activeItem: Doc) => {
+        activeItem.presHideBefore = !activeItem.presHideBefore;
+        Array.from(this._selectedArray.keys()).forEach((doc) => doc.presHideBefore = activeItem.presHideBefore);
+    }
+
+    @undoBatch
+    @action
+    updateHideAfter = (activeItem: Doc) => {
+        activeItem.presHideAfter = !activeItem.presHideAfter;
+        Array.from(this._selectedArray.keys()).forEach((doc) => doc.presHideAfter = activeItem.presHideAfter);
+    }
+
+    @undoBatch
+    @action
+    updateOpenDoc = (activeItem: Doc) => {
+        activeItem.openDocument = !activeItem.openDocument;
+        Array.from(this._selectedArray.keys()).forEach((doc) => {
+            doc.openDocument = activeItem.openDocument;
+        });
+    }
+
+    @undoBatch
+    @action
+    updateEffectDirection = (effect: any, all?: boolean) => {
+        const array: any[] = all ? this.childDocs : Array.from(this._selectedArray.keys());
+        array.forEach((doc) => {
+            const tagDoc = Cast(doc.presentationTargetDoc, Doc, null);
+            switch (effect) {
+                case PresEffect.Left:
+                    tagDoc.presEffectDirection = PresEffect.Left;
+                    break;
+                case PresEffect.Right:
+                    tagDoc.presEffectDirection = PresEffect.Right;
+                    break;
+                case PresEffect.Top:
+                    tagDoc.presEffectDirection = PresEffect.Top;
+                    break;
+                case PresEffect.Bottom:
+                    tagDoc.presEffectDirection = PresEffect.Bottom;
+                    break;
+                case PresEffect.Center: default:
+                    tagDoc.presEffectDirection = PresEffect.Center;
+                    break;
+            }
+        });
+    }
+
+    @undoBatch
+    @action
+    updateEffect = (effect: any, all?: boolean) => {
+        const array: any[] = all ? this.childDocs : Array.from(this._selectedArray.keys());
+        array.forEach((doc) => {
+            const tagDoc = Cast(doc.presentationTargetDoc, Doc, null);
+            switch (effect) {
+                case PresEffect.Bounce:
+                    tagDoc.presEffect = PresEffect.Bounce;
+                    break;
+                case PresEffect.Fade:
+                    tagDoc.presEffect = PresEffect.Fade;
+                    break;
+                case PresEffect.Flip:
+                    tagDoc.presEffect = PresEffect.Flip;
+                    break;
+                case PresEffect.Roll:
+                    tagDoc.presEffect = PresEffect.Roll;
+                    break;
+                case PresEffect.Rotate:
+                    tagDoc.presEffect = PresEffect.Rotate;
+                    break;
+                case PresEffect.None: default:
+                    tagDoc.presEffect = PresEffect.None;
+                    break;
+            }
+        });
+    }
+
+    _batch: UndoManager.Batch | undefined = undefined;
+
+    @computed get transitionDropdown() {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        const type = targetDoc.type;
+        const isPresCollection: boolean = (targetDoc === this.layoutDoc.presCollection);
+        const isPinWithView: boolean = BoolCast(activeItem.presPinView);
+        if (activeItem && targetDoc) {
+            const transitionSpeed = activeItem.presTransition ? NumCast(activeItem.presTransition) / 1000 : 0.5;
+            let duration = activeItem.presDuration ? NumCast(activeItem.presDuration) / 1000 : 2;
+            if (activeItem.type === DocumentType.AUDIO) duration = NumCast(activeItem.duration);
+            const effect = targetDoc.presEffect ? targetDoc.presEffect : 'None';
+            activeItem.presMovement = activeItem.presMovement ? activeItem.presMovement : 'Zoom';
+            return (
+                <div className={`presBox-ribbon ${this.transitionTools && this.layoutDoc.presStatus === PresStatus.Edit ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onClick={action(e => { e.stopPropagation(); this.openMovementDropdown = false; this.openEffectDropdown = false; })}>
+                    <div className="ribbon-box">
+                        Movement
+                        {isPresCollection || (isPresCollection && isPinWithView) ?
+                            <div className="ribbon-property" style={{ marginLeft: 0, height: 25, textAlign: 'left', paddingLeft: 5, paddingRight: 5, fontSize: 10 }}>
+                                {this.scrollable ? "Scroll to pinned view" : !isPinWithView ? "No movement" : "Pan & Zoom to pinned view"}
+                            </div>
+                            :
+                            <div className="presBox-dropdown" onClick={action(e => { e.stopPropagation(); this.openMovementDropdown = !this.openMovementDropdown; })} style={{ borderBottomLeftRadius: this.openMovementDropdown ? 0 : 5, border: this.openMovementDropdown ? `solid 2px ${Colors.MEDIUM_BLUE}` : 'solid 1px black' }}>
+                                {this.setMovementName(activeItem.presMovement, activeItem)}
+                                <FontAwesomeIcon className='presBox-dropdownIcon' style={{ gridColumn: 2, color: this.openMovementDropdown ? Colors.MEDIUM_BLUE : 'black' }} icon={"angle-down"} />
+                                <div className={'presBox-dropdownOptions'} id={'presBoxMovementDropdown'} onPointerDown={e => e.stopPropagation()} style={{ display: this.openMovementDropdown ? "grid" : "none" }}>
+                                    <div className={`presBox-dropdownOption ${activeItem.presMovement === PresMovement.None ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.None)}>None</div>
+                                    <div className={`presBox-dropdownOption ${activeItem.presMovement === PresMovement.Zoom ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.Zoom)}>Pan {"&"} Zoom</div>
+                                    <div className={`presBox-dropdownOption ${activeItem.presMovement === PresMovement.Pan ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.Pan)}>Pan</div>
+                                    <div className={`presBox-dropdownOption ${activeItem.presMovement === PresMovement.Jump ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.Jump)}>Jump cut</div>
+                                </div>
+                            </div>
+                        }
+                        <div className="ribbon-doubleButton" style={{ display: activeItem.presMovement === PresMovement.Pan || activeItem.presMovement === PresMovement.Zoom ? "inline-flex" : "none" }}>
+                            <div className="presBox-subheading">Movement Speed</div>
+                            <div className="ribbon-property">
+                                <input className="presBox-input"
+                                    type="number" value={transitionSpeed}
+                                    onChange={action((e) => this.setTransitionTime(e.target.value))} /> s
+                            </div>
+                            <div className="ribbon-propertyUpDown">
+                                <div className="ribbon-propertyUpDownItem" onClick={undoBatch(() => this.setTransitionTime(String(transitionSpeed), 1000))}>
+                                    <FontAwesomeIcon icon={"caret-up"} />
+                                </div>
+                                <div className="ribbon-propertyUpDownItem" onClick={undoBatch(() => this.setTransitionTime(String(transitionSpeed), -1000))}>
+                                    <FontAwesomeIcon icon={"caret-down"} />
+                                </div>
+                            </div>
+                        </div>
+                        <input type="range" step="0.1" min="0.1" max="10" value={transitionSpeed}
+                            className={`toolbar-slider ${activeItem.presMovement === PresMovement.Pan || activeItem.presMovement === PresMovement.Zoom ? "" : "none"}`}
+                            id="toolbar-slider"
+                            onPointerDown={() => this._batch = UndoManager.StartBatch("presTransition")}
+                            onPointerUp={() => this._batch?.end()}
+                            onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
+                                e.stopPropagation();
+                                this.setTransitionTime(e.target.value);
+                            }} />
+                        <div className={`slider-headers ${activeItem.presMovement === PresMovement.Pan || activeItem.presMovement === PresMovement.Zoom ? "" : "none"}`}>
+                            <div className="slider-text">Fast</div>
+                            <div className="slider-text">Medium</div>
+                            <div className="slider-text">Slow</div>
+                        </div>
+                    </div>
+                    <div className="ribbon-box">
+                        Visibility {"&"} Duration
+                        <div className="ribbon-doubleButton">
+                            {isPresCollection ? (null) : <Tooltip title={<><div className="dash-tooltip">{"Hide before presented"}</div></>}><div className={`ribbon-toggle ${activeItem.presHideBefore ? "active" : ""}`} onClick={() => this.updateHideBefore(activeItem)}>Hide before</div></Tooltip>}
+                            {isPresCollection ? (null) : <Tooltip title={<><div className="dash-tooltip">{"Hide after presented"}</div></>}><div className={`ribbon-toggle ${activeItem.presHideAfter ? "active" : ""}`} onClick={() => this.updateHideAfter(activeItem)}>Hide after</div></Tooltip>}
+                            <Tooltip title={<><div className="dash-tooltip">{"Open in lightbox view"}</div></>}><div className="ribbon-toggle" style={{ backgroundColor: activeItem.openDocument ? Colors.LIGHT_BLUE : "" }} onClick={() => this.updateOpenDoc(activeItem)}>Lightbox</div></Tooltip>
+                        </div>
+                        {(type === DocumentType.AUDIO || type === DocumentType.VID) ? (null) : <>
+                            <div className="ribbon-doubleButton" >
+                                <div className="presBox-subheading">Slide Duration</div>
+                                <div className="ribbon-property">
+                                    <input className="presBox-input"
+                                        type="number" value={duration}
+                                        onChange={action((e) => this.setDurationTime(e.target.value))} /> s
+                            </div>
+                                <div className="ribbon-propertyUpDown">
+                                    <div className="ribbon-propertyUpDownItem" onClick={undoBatch(() => this.setDurationTime(String(duration), 1000))}>
+                                        <FontAwesomeIcon icon={"caret-up"} />
+                                    </div>
+                                    <div className="ribbon-propertyUpDownItem" onClick={undoBatch(() => this.setDurationTime(String(duration), -1000))}>
+                                        <FontAwesomeIcon icon={"caret-down"} />
+                                    </div>
+                                </div>
+                            </div>
+                            <input type="range" step="0.1" min="0.1" max="20" value={duration}
+                                style={{ display: targetDoc.type === DocumentType.AUDIO ? "none" : "block" }}
+                                className={"toolbar-slider"} id="duration-slider"
+                                onPointerDown={() => { this._batch = UndoManager.StartBatch("presDuration"); }}
+                                onPointerUp={() => { if (this._batch) this._batch.end(); }}
+                                onChange={(e: React.ChangeEvent<HTMLInputElement>) => { e.stopPropagation(); this.setDurationTime(e.target.value); }}
+                            />
+                            <div className={"slider-headers"} style={{ display: targetDoc.type === DocumentType.AUDIO ? "none" : "grid" }}>
+                                <div className="slider-text">Short</div>
+                                <div className="slider-text">Medium</div>
+                                <div className="slider-text">Long</div>
+                            </div>
+                        </>}
+                    </div>
+                    {isPresCollection ? (null) : <div className="ribbon-box">
+                        Effects
+                        <div className="presBox-dropdown" onClick={action(e => { e.stopPropagation(); this.openEffectDropdown = !this.openEffectDropdown; })} style={{ borderBottomLeftRadius: this.openEffectDropdown ? 0 : 5, border: this.openEffectDropdown ? `solid 2px ${Colors.MEDIUM_BLUE}` : 'solid 1px black' }}>
+                            {effect}
+                            <FontAwesomeIcon className='presBox-dropdownIcon' style={{ gridColumn: 2, color: this.openEffectDropdown ? Colors.MEDIUM_BLUE : 'black' }} icon={"angle-down"} />
+                            <div className={'presBox-dropdownOptions'} id={'presBoxMovementDropdown'} style={{ display: this.openEffectDropdown ? "grid" : "none" }} onPointerDown={e => e.stopPropagation()}>
+                                <div className={`presBox-dropdownOption ${targetDoc.presEffect === PresEffect.None || !targetDoc.presEffect ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateEffect(PresEffect.None)}>None</div>
+                                <div className={`presBox-dropdownOption ${targetDoc.presEffect === PresEffect.Fade ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateEffect(PresEffect.Fade)}>Fade In</div>
+                                <div className={`presBox-dropdownOption ${targetDoc.presEffect === PresEffect.Flip ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateEffect(PresEffect.Flip)}>Flip</div>
+                                <div className={`presBox-dropdownOption ${targetDoc.presEffect === PresEffect.Rotate ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateEffect(PresEffect.Rotate)}>Rotate</div>
+                                <div className={`presBox-dropdownOption ${targetDoc.presEffect === PresEffect.Bounce ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateEffect(PresEffect.Bounce)}>Bounce</div>
+                                <div className={`presBox-dropdownOption ${targetDoc.presEffect === PresEffect.Roll ? "active" : ""}`} onPointerDown={e => e.stopPropagation()} onClick={() => this.updateEffect(PresEffect.Roll)}>Roll</div>
+                            </div>
+                        </div>
+                        <div className="ribbon-doubleButton" style={{ display: effect === 'None' ? "none" : "inline-flex" }}>
+                            <div className="presBox-subheading" >Effect direction</div>
+                            <div className="ribbon-property">
+                                {this.effectDirection}
+                            </div>
+                        </div>
+                        <div className="effectDirection" style={{ display: effect === 'None' ? "none" : "grid", width: 40 }}>
+                            <Tooltip title={<><div className="dash-tooltip">{"Enter from left"}</div></>}><div style={{ gridColumn: 1, gridRow: 2, justifySelf: 'center', color: targetDoc.presEffectDirection === PresEffect.Left ? Colors.LIGHT_BLUE : "black", cursor: "pointer" }} onClick={() => this.updateEffectDirection(PresEffect.Left)}><FontAwesomeIcon icon={"angle-right"} /></div></Tooltip>
+                            <Tooltip title={<><div className="dash-tooltip">{"Enter from right"}</div></>}><div style={{ gridColumn: 3, gridRow: 2, justifySelf: 'center', color: targetDoc.presEffectDirection === PresEffect.Right ? Colors.LIGHT_BLUE : "black", cursor: "pointer" }} onClick={() => this.updateEffectDirection(PresEffect.Right)}><FontAwesomeIcon icon={"angle-left"} /></div></Tooltip>
+                            <Tooltip title={<><div className="dash-tooltip">{"Enter from top"}</div></>}><div style={{ gridColumn: 2, gridRow: 1, justifySelf: 'center', color: targetDoc.presEffectDirection === PresEffect.Top ? Colors.LIGHT_BLUE : "black", cursor: "pointer" }} onClick={() => this.updateEffectDirection(PresEffect.Top)}><FontAwesomeIcon icon={"angle-down"} /></div></Tooltip>
+                            <Tooltip title={<><div className="dash-tooltip">{"Enter from bottom"}</div></>}><div style={{ gridColumn: 2, gridRow: 3, justifySelf: 'center', color: targetDoc.presEffectDirection === PresEffect.Bottom ? Colors.LIGHT_BLUE : "black", cursor: "pointer" }} onClick={() => this.updateEffectDirection(PresEffect.Bottom)}><FontAwesomeIcon icon={"angle-up"} /></div></Tooltip>
+                            <Tooltip title={<><div className="dash-tooltip">{"Enter from center"}</div></>}><div style={{ gridColumn: 2, gridRow: 2, width: 10, height: 10, alignSelf: 'center', justifySelf: 'center', border: targetDoc.presEffectDirection === PresEffect.Center || !targetDoc.presEffectDirection ? `solid 2px ${Colors.LIGHT_BLUE}` : "solid 2px black", borderRadius: "100%", cursor: "pointer" }} onClick={() => this.updateEffectDirection(PresEffect.Center)}></div></Tooltip>
+                        </div>
+                    </div>}
+                    <div className="ribbon-final-box">
+                        <div className="ribbon-final-button-hidden" onClick={() => this.applyTo(this.childDocs)}>
+                            Apply to all
+                        </div>
+                    </div>
+                </div >
+            );
+        }
+    }
+
+    @computed get effectDirection(): string {
+        let effect = '';
+        switch (this.targetDoc.presEffectDirection) {
+            case 'left': effect = "Enter from left"; break;
+            case 'right': effect = "Enter from right"; break;
+            case 'top': effect = "Enter from top"; break;
+            case 'bottom': effect = "Enter from bottom"; break;
+            default: effect = "Enter from center"; break;
+        }
+        return effect;
+    }
+
+    @undoBatch
+    @action
+    applyTo = (array: Doc[]) => {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        this.updateMovement(activeItem.presMovement, true);
+        this.updateEffect(targetDoc.presEffect, true);
+        this.updateEffectDirection(targetDoc.presEffectDirection, true);
+        array.forEach((doc) => {
+            const curDoc = Cast(doc, Doc, null);
+            const tagDoc = Cast(curDoc.presentationTargetDoc, Doc, null);
+            if (tagDoc && targetDoc) {
+                curDoc.presTransition = activeItem.presTransition;
+                curDoc.presDuration = activeItem.presDuration;
+                curDoc.presHideBefore = activeItem.presHideBefore;
+                curDoc.presHideAfter = activeItem.presHideAfter;
+            }
+        });
+    }
+
+    @computed get presPinViewOptionsDropdown() {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        const presPinWithViewIcon = <img src="/assets/pinWithView.png" style={{ margin: "auto", width: 16, filter: 'invert(1)' }} />;
+        return (
+            <>
+                {this.panable || this.scrollable || this.targetDoc.type === DocumentType.COMPARISON ? 'Pinned view' : (null)}
+                <div className="ribbon-doubleButton">
+                    <Tooltip title={<><div className="dash-tooltip">{activeItem.presPinView ? "Turn off pin with view" : "Turn on pin with view"}</div></>}><div className="ribbon-toggle" style={{ width: 20, padding: 0, backgroundColor: activeItem.presPinView ? Colors.LIGHT_BLUE : "" }}
+                        onClick={() => {
+                            activeItem.presPinView = !activeItem.presPinView;
+                            targetDoc.presPinView = activeItem.presPinView;
+                            if (activeItem.presPinView) {
+                                if (targetDoc.type === DocumentType.PDF || targetDoc.type === DocumentType.RTF || targetDoc.type === DocumentType.WEB || targetDoc._viewType === CollectionViewType.Stacking) {
+                                    const scroll = targetDoc._scrollTop;
+                                    activeItem.presPinView = true;
+                                    activeItem.presPinViewScroll = scroll;
+                                } else if (targetDoc.type === DocumentType.VID) {
+                                    activeItem.presPinTimecode = targetDoc._currentTimecode;
+                                } else if ((targetDoc.type === DocumentType.COL && targetDoc._viewType === CollectionViewType.Freeform) || targetDoc.type === DocumentType.IMG) {
+                                    const x = targetDoc._panX;
+                                    const y = targetDoc._panY;
+                                    const scale = targetDoc._viewScale;
+                                    activeItem.presPinView = true;
+                                    activeItem.presPinViewX = x;
+                                    activeItem.presPinViewY = y;
+                                    activeItem.presPinViewScale = scale;
+                                } else if (targetDoc.type === DocumentType.COMPARISON) {
+                                    const width = targetDoc._clipWidth;
+                                    activeItem.presPinClipWidth = width;
+                                    activeItem.presPinView = true;
+                                }
+                            }
+                        }}>{presPinWithViewIcon}</div></Tooltip>
+                    {activeItem.presPinView ? <Tooltip title={<><div className="dash-tooltip">{"Update the pinned view with the view of the selected document"}</div></>}><div className="ribbon-button"
+                        onClick={() => {
+                            if (targetDoc.type === DocumentType.PDF || targetDoc.type === DocumentType.WEB || targetDoc.type === DocumentType.RTF) {
+                                const scroll = targetDoc._scrollTop;
+                                activeItem.presPinViewScroll = scroll;
+                            } else if (targetDoc.type === DocumentType.VID) {
+                                activeItem.presPinTimecode = targetDoc._currentTimecode;
+                            } else if (targetDoc.type === DocumentType.COMPARISON) {
+                                const clipWidth = targetDoc._clipWidth;
+                                activeItem.presPinClipWidth = clipWidth;
+                            } else {
+                                const x = targetDoc._panX;
+                                const y = targetDoc._panY;
+                                const scale = targetDoc._viewScale;
+                                activeItem.presPinViewX = x;
+                                activeItem.presPinViewY = y;
+                                activeItem.presPinViewScale = scale;
+                            }
+                        }}>Update</div></Tooltip> : (null)}
+                </div>
+            </>
+        );
+    }
+
+    @computed get panOptionsDropdown() {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        return (
+            <>
+                {this.panable ? <div style={{ display: activeItem.presPinView ? "block" : "none" }}>
+                    <div className="ribbon-doubleButton" style={{ marginRight: 10 }}>
+                        <div className="presBox-subheading">Pan X</div>
+                        <div className="ribbon-property" style={{ paddingRight: 0, paddingLeft: 0 }}>
+                            <input className="presBox-input"
+                                style={{ textAlign: 'left', width: 50 }}
+                                type="number" value={NumCast(activeItem.presPinViewX)}
+                                onChange={action((e: React.ChangeEvent<HTMLInputElement>) => { const val = e.target.value; activeItem.presPinViewX = Number(val); })} />
+                        </div>
+                    </div>
+                    <div className="ribbon-doubleButton" style={{ marginRight: 10 }}>
+                        <div className="presBox-subheading">Pan Y</div>
+                        <div className="ribbon-property" style={{ paddingRight: 0, paddingLeft: 0 }}>
+                            <input className="presBox-input"
+                                style={{ textAlign: 'left', width: 50 }}
+                                type="number" value={NumCast(activeItem.presPinViewY)}
+                                onChange={action((e: React.ChangeEvent<HTMLInputElement>) => { const val = e.target.value; activeItem.presPinViewY = Number(val); })} />
+                        </div>
+                    </div>
+                    <div className="ribbon-doubleButton" style={{ marginRight: 10 }}>
+                        <div className="presBox-subheading">Scale</div>
+                        <div className="ribbon-property" style={{ paddingRight: 0, paddingLeft: 0 }}>
+                            <input className="presBox-input"
+                                style={{ textAlign: 'left', width: 50 }}
+                                type="number" value={NumCast(activeItem.presPinViewScale)}
+                                onChange={action((e: React.ChangeEvent<HTMLInputElement>) => { const val = e.target.value; activeItem.presPinViewScale = Number(val); })} />
+                        </div>
+                    </div>
+                </div> : (null)}
+            </>
+        );
+    }
+
+    @computed get scrollOptionsDropdown() {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        return (
+            <>
+                {this.scrollable ? <div style={{ display: activeItem.presPinView ? "block" : "none" }}>
+                    <div className="ribbon-doubleButton" style={{ marginRight: 10 }}>
+                        <div className="presBox-subheading">Scroll</div>
+                        <div className="ribbon-property" style={{ paddingRight: 0, paddingLeft: 0 }}>
+                            <input className="presBox-input"
+                                style={{ textAlign: 'left', width: 50 }}
+                                type="number" value={NumCast(activeItem.presPinViewScroll)}
+                                onChange={action((e: React.ChangeEvent<HTMLInputElement>) => { const val = e.target.value; activeItem.presPinViewScroll = Number(val); })} />
+                        </div>
+                    </div>
+                </div> : (null)}
+            </>
+        );
+    }
+
+    @computed get mediaStopSlides() {
+        const activeItem: Doc = this.activeItem;
+        const list = this.childDocs.map((doc, i) => {
+            if (i > this.itemIndex) {
+                return (
+                    <option>{i + 1}. {doc.title}</option>
+                );
+            }
+        });
+        return (
+            list
+        );
+    }
+
+    @computed get mediaOptionsDropdown() {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        const duration = Math.round(NumCast(activeItem[`${Doc.LayoutFieldKey(activeItem)}-duration`]) * 10);
+        const mediaStopDocInd: number = NumCast(activeItem.mediaStopDoc);
+        const mediaStopDocStr: string = mediaStopDocInd ? mediaStopDocInd + ". " + this.childDocs[mediaStopDocInd - 1].title : "";
+        if (activeItem && targetDoc) {
+            return (
+                <div>
+                    <div className={'presBox-ribbon'} onClick={e => e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
+                        <div>
+                            <div className="ribbon-box">
+                                Start {"&"} End Time
+                                <div className={"slider-headers"}>
+                                    <div className="slider-block" >
+                                        <div className="slider-text" style={{ fontWeight: 500 }}>
+                                            Start time (s)
+                                        </div>
+                                        <div id={"startTime"} className="slider-number" style={{ backgroundColor: Colors.LIGHT_GRAY }}>
+                                            <input className="presBox-input"
+                                                style={{ textAlign: 'center', width: 30, height: 15, fontSize: 10 }}
+                                                type="number" value={NumCast(activeItem.presStartTime)}
+                                                onChange={action((e: React.ChangeEvent<HTMLInputElement>) => { activeItem.presStartTime = Number(e.target.value); })}
+                                            />
+                                        </div>
+                                    </div>
+                                    <div className="slider-block">
+                                        <div className="slider-text" style={{ fontWeight: 500 }}>
+                                            Duration (s)
+                                        </div>
+                                        <div className="slider-number" style={{ backgroundColor: Colors.LIGHT_BLUE }}>
+                                            {Math.round((NumCast(activeItem.presEndTime) - NumCast(activeItem.presStartTime)) * 10) / 10}
+                                        </div>
+                                    </div>
+                                    <div className="slider-block">
+                                        <div className="slider-text" style={{ fontWeight: 500 }}>
+                                            End time (s)
+                                        </div>
+                                        <div id={"endTime"} className="slider-number" style={{ backgroundColor: Colors.LIGHT_GRAY }}>
+                                            <input className="presBox-input"
+                                                style={{ textAlign: 'center', width: 30, height: 15, fontSize: 10 }}
+                                                type="number" value={NumCast(activeItem.presEndTime)}
+                                                onChange={action((e: React.ChangeEvent<HTMLInputElement>) => { activeItem.presEndTime = Number(e.target.value); })}
+                                            />
+                                        </div>
+                                    </div>
+                                </div>
+                                <div className="multiThumb-slider">
+                                    <input type="range" step="0.1" min="0" max={duration / 10} value={NumCast(activeItem.presEndTime)}
+                                        style={{ gridColumn: 1, gridRow: 1 }}
+                                        className={`toolbar-slider ${"end"}`}
+                                        id="toolbar-slider"
+                                        onPointerDown={() => {
+                                            this._batch = UndoManager.StartBatch("presEndTime");
+                                            const endBlock = document.getElementById("endTime");
+                                            if (endBlock) {
+                                                endBlock.style.color = Colors.LIGHT_GRAY;
+                                                endBlock.style.backgroundColor = Colors.MEDIUM_BLUE;
+                                            }
+                                        }}
+                                        onPointerUp={() => {
+                                            this._batch?.end();
+                                            const endBlock = document.getElementById("endTime");
+                                            if (endBlock) {
+                                                endBlock.style.color = Colors.BLACK;
+                                                endBlock.style.backgroundColor = Colors.LIGHT_GRAY;
+                                            }
+                                        }}
+                                        onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
+                                            e.stopPropagation();
+                                            activeItem.presEndTime = Number(e.target.value);
+                                        }} />
+                                    <input type="range" step="0.1" min="0" max={duration / 10} value={NumCast(activeItem.presStartTime)}
+                                        style={{ gridColumn: 1, gridRow: 1 }}
+                                        className={`toolbar-slider ${"start"}`}
+                                        id="toolbar-slider"
+                                        onPointerDown={() => {
+                                            this._batch = UndoManager.StartBatch("presStartTime");
+                                            const startBlock = document.getElementById("startTime");
+                                            if (startBlock) {
+                                                startBlock.style.color = Colors.LIGHT_GRAY;
+                                                startBlock.style.backgroundColor = Colors.MEDIUM_BLUE;
+                                            }
+                                        }}
+                                        onPointerUp={() => {
+                                            this._batch?.end();
+                                            const startBlock = document.getElementById("startTime");
+                                            if (startBlock) {
+                                                startBlock.style.color = Colors.BLACK;
+                                                startBlock.style.backgroundColor = Colors.LIGHT_GRAY;
+                                            }
+                                        }}
+                                        onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
+                                            e.stopPropagation();
+                                            activeItem.presStartTime = Number(e.target.value);
+                                        }} />
+                                </div>
+                                <div className={`slider-headers ${activeItem.presMovement === PresMovement.Pan || activeItem.presMovement === PresMovement.Zoom ? "" : "none"}`}>
+                                    <div className="slider-text">0 s</div>
+                                    <div className="slider-text"></div>
+                                    <div className="slider-text">{duration / 10} s</div>
+                                </div>
+                            </div>
+                            <div className="ribbon-final-box">
+                                Playback
+                                <div className="presBox-subheading">Start playing:</div>
+                                <div className="presBox-radioButtons">
+                                    <div className="checkbox-container">
+                                        <input className="presBox-checkbox"
+                                            type="checkbox"
+                                            onChange={() => activeItem.mediaStart = "manual"}
+                                            checked={activeItem.mediaStart === "manual"}
+                                        />
+                                        <div>On click</div>
+                                    </div>
+                                    <div className="checkbox-container">
+                                        <input className="presBox-checkbox"
+                                            type="checkbox"
+                                            onChange={() => activeItem.mediaStart = "auto"}
+                                            checked={activeItem.mediaStart === "auto"}
+                                        />
+                                        <div>Automatically</div>
+                                    </div>
+                                </div>
+                                <div className="presBox-subheading">Stop playing:</div>
+                                <div className="presBox-radioButtons">
+                                    <div className="checkbox-container">
+                                        <input className="presBox-checkbox"
+                                            type="checkbox"
+                                            onChange={() => activeItem.mediaStop = "manual"}
+                                            checked={activeItem.mediaStop === "manual"}
+                                        />
+                                        <div>At audio end time</div>
+                                    </div>
+                                    <div className="checkbox-container">
+                                        <input className="presBox-checkbox"
+                                            type="checkbox"
+                                            onChange={() => activeItem.mediaStop = "auto"}
+                                            checked={activeItem.mediaStop === "auto"}
+                                        />
+                                        <div>On slide change</div>
+                                    </div>
+                                    {/* <div className="checkbox-container">
+                                    <input className="presBox-checkbox"
+                                        type="checkbox"
+                                        onChange={() => activeItem.mediaStop = "afterSlide"}
+                                        checked={activeItem.mediaStop === "afterSlide"}
+                                    />
+                                    <div className="checkbox-dropdown">
+                                        After chosen slide
+                                        <select className="presBox-viewPicker"
+                                            style={{ opacity: activeItem.mediaStop === "afterSlide" && this.itemIndex !== this.childDocs.length - 1 ? 1 : 0.3 }}
+                                            onPointerDown={e => e.stopPropagation()}
+                                            onChange={this.mediaStopChanged}
+                                            value={mediaStopDocStr}>
+                                            {this.mediaStopSlides}
+                                        </select>
+                                    </div>
+                                </div> */}
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div >
+            );
+        }
+    }
+
+    @computed get newDocumentToolbarDropdown() {
+        return (
+            <div>
+                <div className={'presBox-toolbar-dropdown'} style={{ display: this.newDocumentTools && this.layoutDoc.presStatus === "edit" ? "inline-flex" : "none" }} onClick={e => e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
+                    <div className="layout-container" style={{ height: 'max-content' }}>
+                        <div className="layout" style={{ border: this.layout === 'blank' ? `solid 2px ${Colors.MEDIUM_BLUE}` : '' }} onClick={action(() => { this.layout = 'blank'; this.createNewSlide(this.layout); })} />
+                        <div className="layout" style={{ border: this.layout === 'title' ? `solid 2px ${Colors.MEDIUM_BLUE}` : '' }} onClick={action(() => { this.layout = 'title'; this.createNewSlide(this.layout); })}>
+                            <div className="title">Title</div>
+                            <div className="subtitle">Subtitle</div>
+                        </div>
+                        <div className="layout" style={{ border: this.layout === 'header' ? `solid 2px ${Colors.MEDIUM_BLUE}` : '' }} onClick={action(() => { this.layout = 'header'; this.createNewSlide(this.layout); })}>
+                            <div className="title" style={{ alignSelf: 'center', fontSize: 10 }}>Section header</div>
+                        </div>
+                        <div className="layout" style={{ border: this.layout === 'content' ? `solid 2px ${Colors.MEDIUM_BLUE}` : '' }} onClick={action(() => { this.layout = 'content'; this.createNewSlide(this.layout); })}>
+                            <div className="title" style={{ alignSelf: 'center' }}>Title</div>
+                            <div className="content">Text goes here</div>
+                        </div>
+                    </div>
+                </div>
+            </div >
+        );
+    }
+
+    @observable openLayouts: boolean = false;
+    @observable addFreeform: boolean = true;
+    @observable layout: string = "";
+    @observable title: string = "";
+
+    @computed get newDocumentDropdown() {
+        return (
+            <div>
+                <div className={"presBox-ribbon"} onClick={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
+                    <div className="ribbon-box">
+                        Slide Title: <br></br>
+                        <input className="ribbon-textInput" placeholder="..." type="text" name="fname"
+                            onChange={(e) => {
+                                e.stopPropagation();
+                                e.preventDefault();
+                                runInAction(() => this.title = e.target.value);
+                            }}>
+                        </input>
+                    </div>
+                    <div className="ribbon-box">
+                        Choose type:
+                        <div className="ribbon-doubleButton">
+                            <div title="Text" className={'ribbon-toggle'} style={{ background: this.addFreeform ? "" : Colors.LIGHT_BLUE }} onClick={action(() => this.addFreeform = !this.addFreeform)}>Text</div>
+                            <div title="Freeform" className={'ribbon-toggle'} style={{ background: this.addFreeform ? Colors.LIGHT_BLUE : "" }} onClick={action(() => this.addFreeform = !this.addFreeform)}>Freeform</div>
+                        </div>
+                    </div>
+                    <div className="ribbon-box" style={{ display: this.addFreeform ? "grid" : "none" }}>
+                        Preset layouts:
+                        <div className="layout-container" style={{ height: this.openLayouts ? 'max-content' : '75px' }}>
+                            <div className="layout" style={{ border: this.layout === 'blank' ? `solid 2px ${Colors.MEDIUM_BLUE}` : '' }} onClick={action(() => this.layout = 'blank')} />
+                            <div className="layout" style={{ border: this.layout === 'title' ? `solid 2px ${Colors.MEDIUM_BLUE}` : '' }} onClick={action(() => this.layout = 'title')}>
+                                <div className="title">Title</div>
+                                <div className="subtitle">Subtitle</div>
+                            </div>
+                            <div className="layout" style={{ border: this.layout === 'header' ? `solid 2px ${Colors.MEDIUM_BLUE}` : '' }} onClick={action(() => this.layout = 'header')}>
+                                <div className="title" style={{ alignSelf: 'center', fontSize: 10 }}>Section header</div>
+                            </div>
+                            <div className="layout" style={{ border: this.layout === 'content' ? `solid 2px ${Colors.MEDIUM_BLUE}` : '' }} onClick={action(() => this.layout = 'content')}>
+                                <div className="title" style={{ alignSelf: 'center' }}>Title</div>
+                                <div className="content">Text goes here</div>
+                            </div>
+                            <div className="layout" style={{ border: this.layout === 'twoColumns' ? `solid 2px ${Colors.MEDIUM_BLUE}` : '' }} onClick={action(() => this.layout = 'twoColumns')}>
+                                <div className="title" style={{ alignSelf: 'center', gridColumn: '1/3' }}>Title</div>
+                                <div className="content" style={{ gridColumn: 1, gridRow: 2 }}>Column one text</div>
+                                <div className="content" style={{ gridColumn: 2, gridRow: 2 }}>Column two text</div>
+                            </div>
+                        </div>
+                        <div className="open-layout" onClick={action(() => this.openLayouts = !this.openLayouts)}>
+                            <FontAwesomeIcon style={{ transition: 'all 0.3s', transform: this.openLayouts ? 'rotate(180deg)' : 'rotate(0deg)' }} icon={"caret-down"} size={"lg"} />
+                        </div>
+                    </div>
+                    <div className="ribbon-final-box">
+                        <div className={this.title !== "" && (this.addFreeform && this.layout !== "" || !this.addFreeform) ? "ribbon-final-button-hidden" : "ribbon-final-button"} onClick={() => this.createNewSlide(this.layout, this.title, this.addFreeform)}>
+                            Create New Slide
+                        </div>
+                    </div>
+                </div>
+            </div >
+        );
+    }
+
+    createNewSlide = (layout?: string, title?: string, freeform?: boolean) => {
+        let doc = undefined;
+        if (layout) doc = this.createTemplate(layout);
+        if (freeform && layout) doc = this.createTemplate(layout, title);
+        if (!freeform && !layout) doc = Docs.Create.TextDocument("", { _nativeWidth: 400, _width: 225, title: title });
+        if (doc) {
+            const presCollection = Cast(this.layoutDoc.presCollection, Doc, null);
+            const data = Cast(presCollection?.data, listSpec(Doc));
+            const presData = Cast(this.rootDoc.data, listSpec(Doc));
+            if (data && presData) {
+                data.push(doc);
+                TabDocView.PinDoc(doc);
+                this.gotoDocument(this.childDocs.length, this.activeItem);
+            } else {
+                this.props.addDocTab(doc, "add:right");
+            }
+        }
+    }
+
+    createTemplate = (layout: string, input?: string) => {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        let x = 0;
+        let y = 0;
+        if (activeItem && targetDoc) {
+            x = NumCast(targetDoc.x);
+            y = NumCast(targetDoc.y) + NumCast(targetDoc._height) + 20;
+        }
+        let doc = undefined;
+        const title = Docs.Create.TextDocument("Click to change title", { title: "Slide title", _width: 380, _height: 60, x: 10, y: 58, _fontSize: "24pt", });
+        const subtitle = Docs.Create.TextDocument("Click to change subtitle", { title: "Slide subtitle", _width: 380, _height: 50, x: 10, y: 118, _fontSize: "16pt" });
+        const header = Docs.Create.TextDocument("Click to change header", { title: "Slide header", _width: 380, _height: 65, x: 10, y: 80, _fontSize: "20pt" });
+        const contentTitle = Docs.Create.TextDocument("Click to change title", { title: "Slide title", _width: 380, _height: 60, x: 10, y: 10, _fontSize: "24pt" });
+        const content = Docs.Create.TextDocument("Click to change text", { title: "Slide text", _width: 380, _height: 145, x: 10, y: 70, _fontSize: "14pt" });
+        const content1 = Docs.Create.TextDocument("Click to change text", { title: "Column 1", _width: 185, _height: 140, x: 10, y: 80, _fontSize: "14pt" });
+        const content2 = Docs.Create.TextDocument("Click to change text", { title: "Column 2", _width: 185, _height: 140, x: 205, y: 80, _fontSize: "14pt" });
+        switch (layout) {
+            case 'blank':
+                doc = Docs.Create.FreeformDocument([], { title: input ? input : "Blank slide", _width: 400, _height: 225, x: x, y: y });
+                break;
+            case 'title':
+                doc = Docs.Create.FreeformDocument([title, subtitle], { title: input ? input : "Title slide", _width: 400, _height: 225, _fitToBox: true, x: x, y: y });
+                break;
+            case 'header':
+                doc = Docs.Create.FreeformDocument([header], { title: input ? input : "Section header", _width: 400, _height: 225, _fitToBox: true, x: x, y: y });
+                break;
+            case 'content':
+                doc = Docs.Create.FreeformDocument([contentTitle, content], { title: input ? input : "Title and content", _width: 400, _height: 225, _fitToBox: true, x: x, y: y });
+                break;
+            case 'twoColumns':
+                doc = Docs.Create.FreeformDocument([contentTitle, content1, content2], { title: input ? input : "Title and two columns", _width: 400, _height: 225, _fitToBox: true, x: x, y: y });
+                break;
+            default:
+                break;
+        }
+        return doc;
+    }
+
+    // Dropdown that appears when the user wants to begin presenting (either minimize or sidebar view)
+    @computed get presentDropdown() {
+        return (
+            <div className={`dropdown-play ${this.presentTools ? "active" : ""}`} onClick={e => e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
+                <div className="dropdown-play-button" onClick={undoBatch(action(() => { this.updateMinimize(); this.turnOffEdit(true); this.gotoDocument(this.itemIndex, this.activeItem); }))}>
+                    Mini-player
+                </div>
+                <div className="dropdown-play-button" onClick={undoBatch(action(() => { this.layoutDoc.presStatus = "manual"; this.turnOffEdit(true); this.gotoDocument(this.itemIndex, this.activeItem); }))}>
+                    Sidebar player
+                </div>
+            </div>
+        );
+    }
+
+    // Case in which the document has keyframes to navigate to next key frame
+    @action
+    nextKeyframe = (tagDoc: Doc, curDoc: Doc): void => {
+        const childDocs = DocListCast(tagDoc[Doc.LayoutFieldKey(tagDoc)]);
+        const currentFrame = Cast(tagDoc._currentFrame, "number", null);
+        if (currentFrame === undefined) {
+            tagDoc._currentFrame = 0;
+            // CollectionFreeFormDocumentView.setupScroll(tagDoc, 0);
+            // CollectionFreeFormDocumentView.setupKeyframes(childDocs, 0);
+        }
+        // if (tagDoc.editScrollProgressivize) CollectionFreeFormDocumentView.updateScrollframe(tagDoc, currentFrame);
+        CollectionFreeFormDocumentView.updateKeyframe(childDocs, currentFrame || 0, tagDoc);
+        tagDoc._currentFrame = Math.max(0, (currentFrame || 0) + 1);
+        tagDoc.lastFrame = Math.max(NumCast(tagDoc._currentFrame), NumCast(tagDoc.lastFrame));
+    }
+
+    @action
+    prevKeyframe = (tagDoc: Doc, actItem: Doc): void => {
+        const childDocs = DocListCast(tagDoc[Doc.LayoutFieldKey(tagDoc)]);
+        const currentFrame = Cast(tagDoc._currentFrame, "number", null);
+        if (currentFrame === undefined) {
+            tagDoc._currentFrame = 0;
+            // CollectionFreeFormDocumentView.setupKeyframes(childDocs, 0);
+        }
+        CollectionFreeFormDocumentView.gotoKeyframe(childDocs.slice());
+        tagDoc._currentFrame = Math.max(0, (currentFrame || 0) - 1);
+    }
+
+    /**
+     * Returns the collection type as a string for headers
+     */
+    @computed get stringType(): string {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        let type: string = '';
+        if (activeItem) {
+            switch (targetDoc.type) {
+                case DocumentType.PDF: type = "PDF"; break;
+                case DocumentType.RTF: type = "Text node"; break;
+                case DocumentType.COL: type = "Collection"; break;
+                case DocumentType.AUDIO: type = "Audio"; break;
+                case DocumentType.VID: type = "Video"; break;
+                case DocumentType.IMG: type = "Image"; break;
+                case DocumentType.WEB: type = "Web page"; break;
+                default: type = "Other node"; break;
+            }
+        }
+        return type;
+    }
+
+    @observable private openActiveColorPicker: boolean = false;
+    @observable private openViewedColorPicker: boolean = false;
+
+
+
+    @computed get progressivizeDropdown() {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        if (activeItem && targetDoc) {
+            const activeFontColor = targetDoc["pres-text-color"] ? StrCast(targetDoc["pres-text-color"]) : "Black";
+            const viewedFontColor = targetDoc["pres-text-viewed-color"] ? StrCast(targetDoc["pres-text-viewed-color"]) : "Black";
+            return (
+                <div>
+                    <div className={`presBox-ribbon ${this.progressivizeTools && this.layoutDoc.presStatus === "edit" ? "active" : ""}`} onClick={e => e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
+                        <div className="ribbon-box">
+                            {this.stringType} selected
+                            <div className="ribbon-doubleButton" style={{ borderTop: 'solid 1px darkgrey', display: (targetDoc.type === DocumentType.COL && targetDoc._viewType === 'freeform') || targetDoc.type === DocumentType.IMG || targetDoc.type === DocumentType.RTF ? "inline-flex" : "none" }}>
+                                <div className="ribbon-toggle" style={{ backgroundColor: activeItem.presProgressivize ? Colors.LIGHT_BLUE : "" }} onClick={this.progressivizeChild}>Contents</div>
+                                <div className="ribbon-toggle" style={{ opacity: activeItem.presProgressivize ? 1 : 0.4, backgroundColor: targetDoc.editProgressivize ? Colors.LIGHT_BLUE : "" }} onClick={this.editProgressivize}>Edit</div>
+                            </div>
+                            <div className="ribbon-doubleButton" style={{ display: activeItem.presProgressivize ? "inline-flex" : "none" }}>
+                                <div className="presBox-subheading">Active text color</div>
+                                <div className="ribbon-colorBox" style={{ backgroundColor: activeFontColor, height: 15, width: 15 }} onClick={action(() => { this.openActiveColorPicker = !this.openActiveColorPicker; })}>
+                                </div>
+                            </div>
+                            {this.activeColorPicker}
+                            <div className="ribbon-doubleButton" style={{ display: activeItem.presProgressivize ? "inline-flex" : "none" }}>
+                                <div className="presBox-subheading">Viewed font color</div>
+                                <div className="ribbon-colorBox" style={{ backgroundColor: viewedFontColor, height: 15, width: 15 }} onClick={action(() => this.openViewedColorPicker = !this.openViewedColorPicker)}>
+                                </div>
+                            </div>
+                            {this.viewedColorPicker}
+                            <div className="ribbon-doubleButton" style={{ borderTop: 'solid 1px darkgrey', display: (targetDoc.type === DocumentType.COL && targetDoc._viewType === 'freeform') || targetDoc.type === DocumentType.IMG ? "inline-flex" : "none" }}>
+                                <div className="ribbon-toggle" style={{ backgroundColor: activeItem.zoomProgressivize ? Colors.LIGHT_BLUE : "" }} onClick={this.progressivizeZoom}>Zoom</div>
+                                <div className="ribbon-toggle" style={{ opacity: activeItem.zoomProgressivize ? 1 : 0.4, backgroundColor: activeItem.editZoomProgressivize ? Colors.LIGHT_BLUE : "" }} onClick={this.editZoomProgressivize}>Edit</div>
+                            </div>
+                            <div className="ribbon-doubleButton" style={{ borderTop: 'solid 1px darkgrey', display: targetDoc._viewType === "stacking" || targetDoc.type === DocumentType.PDF || targetDoc.type === DocumentType.WEB || targetDoc.type === DocumentType.RTF ? "inline-flex" : "none" }}>
+                                <div className="ribbon-toggle" style={{ backgroundColor: activeItem.scrollProgressivize ? Colors.LIGHT_BLUE : "" }} onClick={this.progressivizeScroll}>Scroll</div>
+                                <div className="ribbon-toggle" style={{ opacity: activeItem.scrollProgressivize ? 1 : 0.4, backgroundColor: targetDoc.editScrollProgressivize ? Colors.LIGHT_BLUE : "" }} onClick={this.editScrollProgressivize}>Edit</div>
+                            </div>
+                        </div>
+                        <div className="ribbon-final-box">
+                            Frames
+                            <div className="ribbon-doubleButton">
+                                <div className="ribbon-frameSelector">
+                                    <div key="back" title="back frame" className="backKeyframe" onClick={e => { e.stopPropagation(); this.prevKeyframe(targetDoc, activeItem); }}>
+                                        <FontAwesomeIcon icon={"caret-left"} size={"lg"} />
+                                    </div>
+                                    <div key="num" title="toggle view all" className="numKeyframe" style={{ color: targetDoc.keyFrameEditing ? "white" : "black", backgroundColor: targetDoc.keyFrameEditing ? Colors.MEDIUM_BLUE : Colors.LIGHT_BLUE }}
+                                        onClick={action(() => targetDoc.keyFrameEditing = !targetDoc.keyFrameEditing)} >
+                                        {NumCast(targetDoc._currentFrame)}
+                                    </div>
+                                    <div key="fwd" title="forward frame" className="fwdKeyframe" onClick={e => { e.stopPropagation(); this.nextKeyframe(targetDoc, activeItem); }}>
+                                        <FontAwesomeIcon icon={"caret-right"} size={"lg"} />
+                                    </div>
+                                </div>
+                                <Tooltip title={<><div className="dash-tooltip">{"Last frame"}</div></>}><div className="ribbon-property">{NumCast(targetDoc.lastFrame)}</div></Tooltip>
+                            </div>
+                            <div className="ribbon-frameList">
+                                {this.frameListHeader}
+                                {this.frameList}
+                            </div>
+                            <div className="ribbon-toggle" style={{ height: 20, backgroundColor: Colors.LIGHT_BLUE }} onClick={() => console.log(" TODO: play frames")}>Play</div>
+                        </div>
+                    </div>
+                </div>
+            );
+        }
+    }
+
+    @undoBatch
+    @action
+    switchActive = (color: ColorState) => {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        const val = String(color.hex);
+        targetDoc["pres-text-color"] = val;
+        return true;
+    }
+    @undoBatch
+    @action
+    switchPresented = (color: ColorState) => {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        const val = String(color.hex);
+        targetDoc["pres-text-viewed-color"] = val;
+        return true;
+    }
+
+    @computed get activeColorPicker() {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        return !this.openActiveColorPicker ? (null) : <SketchPicker onChange={this.switchActive}
+            presetColors={['#D0021B', '#F5A623', '#F8E71C', '#8B572A', '#7ED321', '#417505',
+                '#9013FE', '#4A90E2', '#50E3C2', '#B8E986', '#000000', '#4A4A4A', '#9B9B9B',
+                '#FFFFFF', '#f1efeb', 'transparent']}
+            color={StrCast(targetDoc["pres-text-color"])} />;
+    }
+
+    @computed get viewedColorPicker() {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        return !this.openViewedColorPicker ? (null) : <SketchPicker onChange={this.switchPresented}
+            presetColors={['#D0021B', '#F5A623', '#F8E71C', '#8B572A', '#7ED321', '#417505',
+                '#9013FE', '#4A90E2', '#50E3C2', '#B8E986', '#000000', '#4A4A4A', '#9B9B9B',
+                '#FFFFFF', '#f1efeb', 'transparent']}
+            color={StrCast(targetDoc["pres-text-viewed-color"])} />;
+    }
+
+    @action
+    turnOffEdit = (paths?: boolean) => {
+        // Turn off paths
+        if (paths) {
+            const srcContext = Cast(this.rootDoc.presCollection, Doc, null);
+            if (srcContext) this.togglePath(srcContext, true);
+        }
+        // Turn off the progressivize editors for each document
+        this.childDocs.forEach((doc) => {
+            doc.editSnapZoomProgressivize = false;
+            doc.editZoomProgressivize = false;
+            const targetDoc = Cast(doc.presentationTargetDoc, Doc, null);
+            if (targetDoc) {
+                targetDoc.editZoomProgressivize = false;
+                // targetDoc.editScrollProgressivize = false;
+            }
+        });
+    }
+
+    //Toggle whether the user edits or not
+    @action
+    editZoomProgressivize = (e: React.MouseEvent) => {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        if (!targetDoc.editZoomProgressivize) {
+            if (!activeItem.zoomProgressivize) activeItem.zoomProgressivize = true; targetDoc.zoomProgressivize = true;
+            targetDoc.editZoomProgressivize = true;
+            activeItem.editZoomProgressivize = true;
+        } else {
+            targetDoc.editZoomProgressivize = false;
+            activeItem.editZoomProgressivize = false;
+        }
+    }
+
+    //Toggle whether the user edits or not
+    @action
+    editScrollProgressivize = (e: React.MouseEvent) => {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        if (!targetDoc.editScrollProgressivize) {
+            if (!targetDoc.scrollProgressivize) { targetDoc.scrollProgressivize = true; activeItem.scrollProgressivize = true; }
+            targetDoc.editScrollProgressivize = true;
+        } else {
+            targetDoc.editScrollProgressivize = false;
+        }
+    }
+
+    //Progressivize Zoom
+    @action
+    progressivizeScroll = (e: React.MouseEvent) => {
+        e.stopPropagation();
+        const activeItem: Doc = this.activeItem;
+        activeItem.scrollProgressivize = !activeItem.scrollProgressivize;
+        const targetDoc: Doc = this.targetDoc;
+        targetDoc.scrollProgressivize = !targetDoc.scrollProgressivize;
+        // CollectionFreeFormDocumentView.setupScroll(targetDoc, NumCast(targetDoc._currentFrame));
+        if (targetDoc.editScrollProgressivize) {
+            targetDoc.editScrollProgressivize = false;
+            targetDoc._currentFrame = 0;
+            targetDoc.lastFrame = 0;
+        }
+    }
+
+    //Progressivize Zoom
+    @action
+    progressivizeZoom = (e: React.MouseEvent) => {
+        e.stopPropagation();
+        const activeItem: Doc = this.activeItem;
+        activeItem.zoomProgressivize = !activeItem.zoomProgressivize;
+        const targetDoc: Doc = this.targetDoc;
+        targetDoc.zoomProgressivize = !targetDoc.zoomProgressivize;
+        CollectionFreeFormDocumentView.setupZoom(activeItem, targetDoc);
+        if (activeItem.editZoomProgressivize) {
+            activeItem.editZoomProgressivize = false;
+            targetDoc._currentFrame = 0;
+            targetDoc.lastFrame = 0;
+        }
+    }
+
+    //Progressivize Child Docs
+    @action
+    editProgressivize = (e: React.MouseEvent) => {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        targetDoc._currentFrame = targetDoc.lastFrame;
+        if (!targetDoc.editProgressivize) {
+            if (!activeItem.presProgressivize) { activeItem.presProgressivize = true; targetDoc.presProgressivize = true; }
+            targetDoc.editProgressivize = true;
+        } else {
+            targetDoc.editProgressivize = false;
+        }
+    }
+
+    @action
+    progressivizeChild = (e: React.MouseEvent) => {
+        e.stopPropagation();
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        const docs = DocListCast(targetDoc[Doc.LayoutFieldKey(targetDoc)]);
+        if (!activeItem.presProgressivize) {
+            targetDoc.keyFrameEditing = false;
+            activeItem.presProgressivize = true;
+            targetDoc.presProgressivize = true;
+            targetDoc._currentFrame = 0;
+            docs.forEach((doc, i) => CollectionFreeFormDocumentView.setupKeyframes([doc], i, true));
+            targetDoc.lastFrame = targetDoc.lastFrame ? NumCast(targetDoc.lastFrame) : docs.length - 1;
+        } else {
+            // targetDoc.editProgressivize = false;
+            activeItem.presProgressivize = false;
+            targetDoc.presProgressivize = false;
+            targetDoc._currentFrame = 0;
+            targetDoc.keyFrameEditing = true;
+        }
+    }
+
+    @action
+    checkMovementLists = (doc: Doc, xlist: any, ylist: any) => {
+        const x: List<number> = xlist;
+        const y: List<number> = ylist;
+        const tags: JSX.Element[] = [];
+        let pathPoints = ""; //List of all of the pathpoints that need to be added
+        for (let i = 0; i < x.length - 1; i++) {
+            if (y[i] || x[i]) {
+                if (i === 0) pathPoints = (x[i] - 11) + "," + (y[i] + 33);
+                else pathPoints = pathPoints + " " + (x[i] - 11) + "," + (y[i] + 33);
+                tags.push(<div className="progressivizeMove-frame" style={{ position: 'absolute', top: y[i], left: x[i] }}>{i}</div>);
+            }
+        }
+        tags.push(<svg style={{ overflow: 'visible', position: 'absolute' }}><polyline
+            points={pathPoints}
+            style={{
+                position: 'absolute',
+                opacity: 1,
+                stroke: "#000000",
+                strokeWidth: 2,
+                strokeDasharray: '10 5',
+            }}
+            fill="none"
+        /></svg>);
+        return tags;
+    }
+
+    @observable
+    toggleDisplayMovement = (doc: Doc) => {
+        if (doc.displayMovement) doc.displayMovement = false;
+        else doc.displayMovement = true;
+    }
+
+    @action
+    checkList = (doc: Doc, list: any): number => {
+        const x: List<number> = list;
+        if (x && x.length >= NumCast(doc._currentFrame) + 1) {
+            return x[NumCast(doc._currentFrame)];
+        } else if (x) {
+            x.length = NumCast(doc._currentFrame) + 1;
+            x[NumCast(doc._currentFrame)] = x[NumCast(doc._currentFrame) - 1];
+            return x[NumCast(doc._currentFrame)];
+        } else return 100;
+    }
+
+    @computed get progressivizeChildDocs() {
+        const targetDoc: Doc = this.targetDoc;
+        const docs = DocListCast(targetDoc[Doc.LayoutFieldKey(targetDoc)]);
+        const tags: JSX.Element[] = [];
+        docs.forEach((doc, index) => {
+            if (doc["x-indexed"] && doc["y-indexed"]) {
+                tags.push(<div style={{ position: 'absolute', display: doc.displayMovement ? "block" : "none" }}>{this.checkMovementLists(doc, doc["x-indexed"], doc["y-indexed"])}</div>);
+            }
+            tags.push(
+                <div className="progressivizeButton" key={index} onPointerLeave={() => { if (NumCast(targetDoc._currentFrame) < NumCast(doc.appearFrame)) doc.opacity = 0; }} onPointerOver={() => { if (NumCast(targetDoc._currentFrame) < NumCast(doc.appearFrame)) doc.opacity = 0.5; }} onClick={e => { this.toggleDisplayMovement(doc); e.stopPropagation(); }} style={{ backgroundColor: doc.displayMovement ? Colors.LIGHT_BLUE : "#c8c8c8", top: NumCast(doc.y), left: NumCast(doc.x) }}>
+                    <div className="progressivizeButton-prev"><FontAwesomeIcon icon={"caret-left"} size={"lg"} onClick={e => { e.stopPropagation(); this.prevAppearFrame(doc, index); }} /></div>
+                    <div className="progressivizeButton-frame">{doc.appearFrame}</div>
+                    <div className="progressivizeButton-next"><FontAwesomeIcon icon={"caret-right"} size={"lg"} onClick={e => { e.stopPropagation(); this.nextAppearFrame(doc, index); }} /></div>
+                </div>);
+        });
+        return tags;
+    }
+
+    @action
+    nextAppearFrame = (doc: Doc, i: number): void => {
+        // const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null);
+        // const targetDoc = Cast(activeItem?.presentationTargetDoc, Doc, null);
+        const appearFrame = Cast(doc.appearFrame, "number", null);
+        if (appearFrame === undefined) {
+            doc.appearFrame = 0;
+        }
+        doc.appearFrame = appearFrame + 1;
+        this.updateOpacityList(doc["opacity-indexed"], NumCast(doc.appearFrame));
+    }
+
+    @action
+    prevAppearFrame = (doc: Doc, i: number): void => {
+        // const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null);
+        // const targetDoc = Cast(activeItem?.presentationTargetDoc, Doc, null);
+        const appearFrame = Cast(doc.appearFrame, "number", null);
+        if (appearFrame === undefined) {
+            doc.appearFrame = 0;
+        }
+        doc.appearFrame = Math.max(0, appearFrame - 1);
+        this.updateOpacityList(doc["opacity-indexed"], NumCast(doc.appearFrame));
+    }
+
+    @action
+    updateOpacityList = (list: any, frame: number) => {
+        const x: List<number> = list;
+        if (x && x.length >= frame) {
+            for (let i = 0; i < x.length; i++) {
+                if (i < frame) {
+                    x[i] = 0;
+                } else if (i >= frame) {
+                    x[i] = 1;
+                }
+            }
+            list = x;
+        } else {
+            x.length = frame + 1;
+            for (let i = 0; i < x.length; i++) {
+                if (i < frame) {
+                    x[i] = 0;
+                } else if (i >= frame) {
+                    x[i] = 1;
+                }
+            }
+            list = x;
+        }
+    }
+
+    @computed get moreInfoDropdown() {
+        return (<div></div>);
+    }
+
+    @computed
+    get toolbarWidth(): number {
+        const width = this.props.PanelWidth();
+        return width;
+    }
+
+    @action
+    toggleProperties = () => {
+        if (CurrentUserUtils.propertiesWidth > 0) {
+            CurrentUserUtils.propertiesWidth = 0;
+        } else {
+            CurrentUserUtils.propertiesWidth = 250;
+        }
+    }
+
+    @computed get toolbar() {
+        const propIcon = CurrentUserUtils.propertiesWidth > 0 ? "angle-double-right" : "angle-double-left";
+        const propTitle = CurrentUserUtils.propertiesWidth > 0 ? "Close Presentation Panel" : "Open Presentation Panel";
+        const mode = StrCast(this.rootDoc._viewType) as CollectionViewType;
+        const isMini: boolean = this.toolbarWidth <= 100;
+        const presKeyEvents: boolean = (this.isPres && this._presKeyEventsActive && this.rootDoc === Doc.UserDoc().activePresentation);
+        const activeColor = Colors.LIGHT_BLUE;
+        const inactiveColor = Colors.WHITE;
+        return (mode === CollectionViewType.Carousel3D) ? (null) : (
+            <div id="toolbarContainer" className={'presBox-toolbar'}>
+                {/* <Tooltip title={<><div className="dash-tooltip">{"Add new slide"}</div></>}><div className={`toolbar-button ${this.newDocumentTools ? "active" : ""}`} onClick={action(() => this.newDocumentTools = !this.newDocumentTools)}>
+                    <FontAwesomeIcon icon={"plus"} />
+                    <FontAwesomeIcon className={`dropdown ${this.newDocumentTools ? "active" : ""}`} icon={"angle-down"} />
+                </div></Tooltip> */}
+                <Tooltip title={<><div className="dash-tooltip">{"View paths"}</div></>}>
+                    <div style={{ opacity: this.childDocs.length > 1 && this.layoutDoc.presCollection ? 1 : 0.3, color: this._pathBoolean ? Colors.MEDIUM_BLUE : 'white', width: isMini ? "100%" : undefined }} className={"toolbar-button"} onClick={this.childDocs.length > 1 && this.layoutDoc.presCollection ? this.viewPaths : undefined}>
+                        <FontAwesomeIcon icon={"exchange-alt"} />
+                    </div>
+                </Tooltip>
+                {isMini ? (null) :
+                    <>
+                        <div className="toolbar-divider" />
+                        {/* <Tooltip title={<><div className="dash-tooltip">{this._expandBoolean ? "Minimize all" : "Expand all"}</div></>}>
+                            <div className={"toolbar-button"}
+                                style={{ color: this._expandBoolean ? Colors.MEDIUM_BLUE : 'white' }}
+                                onClick={this.toggleExpandMode}>
+                                <FontAwesomeIcon icon={"eye"} />
+                            </div>
+                        </Tooltip>
+                        <div className="toolbar-divider" /> */}
+                        <Tooltip title={<><div className="dash-tooltip">{presKeyEvents ? "Keys are active" : "Keys are not active - click anywhere on the presentation trail to activate keys"}</div></>}>
+                            <div className="toolbar-button" style={{ cursor: presKeyEvents ? 'default' : 'pointer', position: 'absolute', right: 30, fontSize: 16 }}>
+                                <FontAwesomeIcon className={"toolbar-thumbtack"} icon={"keyboard"} style={{ color: presKeyEvents ? activeColor : inactiveColor }} />
+                            </div>
+                        </Tooltip>
+                        <Tooltip title={<><div className="dash-tooltip">{propTitle}</div></>}>
+                            <div className="toolbar-button" style={{ position: 'absolute', right: 4, fontSize: 16 }} onClick={this.toggleProperties}>
+                                <FontAwesomeIcon className={"toolbar-thumbtack"} icon={propIcon} style={{ color: CurrentUserUtils.propertiesWidth > 0 ? activeColor : inactiveColor }} />
+                            </div>
+                        </Tooltip>
+                    </>
+                }
+            </div>
+        );
+    }
+
+    /**
+     * Top panel containes:
+     * viewPicker: The option to choose between List and Slides view for the presentaiton trail
+     * presentPanel: The button to start the presentation / open minimized view of the presentation
+     */
+    @computed get topPanel() {
+        const mode = StrCast(this.rootDoc._viewType) as CollectionViewType;
+        const isMini: boolean = this.toolbarWidth <= 100;
+        return (
+            <div className="presBox-buttons" style={{ display: !this.rootDoc._chromeHidden ? "none" : undefined }}>
+                {isMini ? (null) : <select className="presBox-viewPicker"
+                    style={{ display: this.layoutDoc.presStatus === "edit" ? "block" : "none" }}
+                    onPointerDown={e => e.stopPropagation()}
+                    onChange={this.viewChanged}
+                    value={mode}>
+                    <option onPointerDown={e => e.stopPropagation()} value={CollectionViewType.Stacking}>List</option>
+                    <option onPointerDown={e => e.stopPropagation()} value={CollectionViewType.Carousel3D}>3D Carousel</option>
+                </select>}
+                <div className="presBox-presentPanel" style={{ opacity: this.childDocs.length ? 1 : 0.3 }}>
+                    <span className={`presBox-button ${this.layoutDoc.presStatus === "edit" ? "present" : ""}`}>
+                        <div className="presBox-button-left"
+                            onClick={undoBatch(() => {
+                                if (this.childDocs.length) {
+                                    this.layoutDoc.presStatus = "manual";
+                                    this.gotoDocument(this.itemIndex, this.activeItem);
+                                }
+                            })}>
+                            <FontAwesomeIcon icon={"play-circle"} />
+                            <div style={{ display: this.props.PanelWidth() > 200 ? "inline-flex" : "none" }}>&nbsp; Present</div>
+                        </div>
+                        {(mode === CollectionViewType.Carousel3D || isMini) ? (null) : <div className={`presBox-button-right ${this.presentTools ? "active" : ""}`}
+                            onClick={(action(() => {
+                                if (this.childDocs.length) this.presentTools = !this.presentTools;
+                            }))}>
+                            <FontAwesomeIcon className="dropdown" style={{ margin: 0, transform: this.presentTools ? 'rotate(180deg)' : 'rotate(0deg)' }} icon={"angle-down"} />
+                            {this.presentDropdown}
+                        </div>}
+                    </span>
+                    {this.playButtons}
+                </div>
+            </div>
+        );
+    }
+
+    @action
+    getList = (list: any): List<number> => {
+        const x: List<number> = list;
+        return x;
+    }
+
+    @action
+    updateList = (list: any): List<number> => {
+        const targetDoc: Doc = this.targetDoc;
+        const x: List<number> = list;
+        x.length + 1;
+        x[x.length - 1] = NumCast(targetDoc._scrollY);
+        return x;
+    }
+
+    @action
+    newFrame = () => {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        const type: string = StrCast(targetDoc.type);
+        if (!activeItem.frameList) activeItem.frameList = new List<number>();
+        switch (type) {
+            case (DocumentType.PDF || DocumentType.RTF || DocumentType.WEB):
+                this.updateList(activeItem.frameList);
+                break;
+            case DocumentType.COL:
+                break;
+            default:
+                break;
+        }
+    }
+
+    @computed get frameListHeader() {
+        return (<div className="frameList-header">
+            &nbsp; Frames {this.panable ? <i>Panable</i> : this.scrollable ? <i>Scrollable</i> : (null)}
+            <div className={"frameList-headerButtons"}>
+                <Tooltip title={<><div className="dash-tooltip">{"Add frame by example"}</div></>}><div className={"headerButton"} onClick={e => { e.stopPropagation(); this.newFrame(); }}>
+                    <FontAwesomeIcon icon={"plus"} onPointerDown={e => e.stopPropagation()} />
+                </div></Tooltip>
+                <Tooltip title={<><div className="dash-tooltip">{"Edit in collection"}</div></>}><div className={"headerButton"} onClick={e => { e.stopPropagation(); console.log('New frame'); }}>
+                    <FontAwesomeIcon icon={"edit"} onPointerDown={e => e.stopPropagation()} />
+                </div></Tooltip>
+            </div>
+        </div>);
+    }
+
+    @computed get frameList() {
+        const activeItem: Doc = this.activeItem;
+        const targetDoc: Doc = this.targetDoc;
+        const frameList: List<number> = this.getList(activeItem.frameList);
+        if (frameList) {
+            const frameItems = frameList.map((value) =>
+                <div className="framList-item">
+
+                </div>
+            );
+            return (
+
+                <div className="frameList-container">
+                    {frameItems}
+                </div>
+            );
+        } else return (null);
+
+    }
+
+    @computed get playButtonFrames() {
+        const targetDoc: Doc = this.targetDoc;
+        return (
+            <>
+                {this.targetDoc ? <div className="presPanel-button-frame" style={{ display: targetDoc.lastFrame !== undefined && targetDoc.lastFrame >= 0 ? "inline-flex" : "none" }}>
+                    <div>{targetDoc._currentFrame}</div>
+                    <div className="presPanel-divider" style={{ border: 'solid 0.5px white', height: '60%' }}></div>
+                    <div>{targetDoc.lastFrame}</div>
+                </div> : null}
+            </>
+        );
+    }
+
+    @computed get playButtons() {
+        const presEnd: boolean = !this.layoutDoc.presLoop && (this.itemIndex === this.childDocs.length - 1);
+        const presStart: boolean = !this.layoutDoc.presLoop && (this.itemIndex === 0);
+        // Case 1: There are still other frames and should go through all frames before going to next slide
+        return (<div className="presPanelOverlay" style={{ display: this.layoutDoc.presStatus !== "edit" ? "inline-flex" : "none" }}>
+            <Tooltip title={<><div className="dash-tooltip">{"Loop"}</div></>}><div className="presPanel-button" style={{ color: this.layoutDoc.presLoop ? Colors.MEDIUM_BLUE : 'white' }} onClick={() => this.layoutDoc.presLoop = !this.layoutDoc.presLoop}><FontAwesomeIcon icon={"redo-alt"} /></div></Tooltip>
+            <div className="presPanel-divider"></div>
+            <div className="presPanel-button" style={{ opacity: presStart ? 0.4 : 1 }} onClick={() => { this.back(); if (this._presTimer) { clearTimeout(this._presTimer); this.layoutDoc.presStatus = PresStatus.Manual; } }}><FontAwesomeIcon icon={"arrow-left"} /></div>
+            <Tooltip title={<><div className="dash-tooltip">{this.layoutDoc.presStatus === PresStatus.Autoplay ? "Pause" : "Autoplay"}</div></>}><div className="presPanel-button" onClick={this.startOrPause}><FontAwesomeIcon icon={this.layoutDoc.presStatus === PresStatus.Autoplay ? "pause" : "play"} /></div></Tooltip>
+            <div className="presPanel-button" style={{ opacity: presEnd ? 0.4 : 1 }} onClick={() => { this.next(); if (this._presTimer) { clearTimeout(this._presTimer); this.layoutDoc.presStatus = PresStatus.Manual; } }}><FontAwesomeIcon icon={"arrow-right"} /></div>
+            <div className="presPanel-divider"></div>
+            <Tooltip title={<><div className="dash-tooltip">{"Click to return to 1st slide"}</div></>}><div className="presPanel-button" style={{ border: 'solid 1px white' }} onClick={() => this.gotoDocument(0, this.activeItem)}><b>1</b></div></Tooltip>
+            <div
+                className="presPanel-button-text"
+                onClick={() => this.gotoDocument(0, this.activeItem)}
+                style={{ display: this.props.PanelWidth() > 250 ? "inline-flex" : "none" }}>
+                Slide {this.itemIndex + 1} / {this.childDocs.length}
+                {this.playButtonFrames}
+            </div>
+            <div className="presPanel-divider"></div>
+            {this.props.PanelWidth() > 250 ? <div className="presPanel-button-text" onClick={undoBatch(action(() => { this.layoutDoc.presStatus = "edit"; clearTimeout(this._presTimer); }))}>EXIT</div>
+                : <div className="presPanel-button" onClick={undoBatch(action(() => this.layoutDoc.presStatus = "edit"))}>
+                    <FontAwesomeIcon icon={"times"} />
+                </div>}
+        </div>);
+    }
+
+    @action
+    startOrPause = () => {
+        if (this.layoutDoc.presStatus === PresStatus.Manual || this.layoutDoc.presStatus === PresStatus.Edit) this.startAutoPres(this.itemIndex);
+        else this.pauseAutoPres();
+    }
+
+    render() {
+        // calling this method for keyEvents
+        this.isPres;
+        // needed to ensure that the childDocs are loaded for looking up fields
+        this.childDocs.slice();
+        const mode = StrCast(this.rootDoc._viewType) as CollectionViewType;
+        const presKeyEvents: boolean = (this.isPres && this._presKeyEventsActive && this.rootDoc === Doc.UserDoc().activePresentation);
+        const presEnd: boolean = !this.layoutDoc.presLoop && (this.itemIndex === this.childDocs.length - 1);
+        const presStart: boolean = !this.layoutDoc.presLoop && (this.itemIndex === 0);
+        return CurrentUserUtils.OverlayDocs.includes(this.rootDoc) ?
+            <div className="miniPres">
+                <div className="presPanelOverlay" style={{ display: "inline-flex", height: 30, background: '#323232', top: 0, zIndex: 3000000, boxShadow: presKeyEvents ? '0 0 0px 3px ' + Colors.MEDIUM_BLUE : undefined }}>
+                    <Tooltip title={<><div className="dash-tooltip">{"Loop"}</div></>}><div className="presPanel-button" style={{ color: this.layoutDoc.presLoop ? Colors.MEDIUM_BLUE : undefined }} onClick={() => this.layoutDoc.presLoop = !this.layoutDoc.presLoop}><FontAwesomeIcon icon={"redo-alt"} /></div></Tooltip>
+                    <div className="presPanel-divider"></div>
+                    <div className="presPanel-button" style={{ opacity: presStart ? 0.4 : 1 }} onClick={() => { this.back(); if (this._presTimer) { clearTimeout(this._presTimer); this.layoutDoc.presStatus = PresStatus.Manual; } }}><FontAwesomeIcon icon={"arrow-left"} /></div>
+                    <Tooltip title={<><div className="dash-tooltip">{this.layoutDoc.presStatus === PresStatus.Autoplay ? "Pause" : "Autoplay"}</div></>}><div className="presPanel-button" onClick={this.startOrPause}><FontAwesomeIcon icon={this.layoutDoc.presStatus === "auto" ? "pause" : "play"} /></div></Tooltip>
+                    <div className="presPanel-button" style={{ opacity: presEnd ? 0.4 : 1 }} onClick={() => { this.next(); if (this._presTimer) { clearTimeout(this._presTimer); this.layoutDoc.presStatus = PresStatus.Manual; } }}><FontAwesomeIcon icon={"arrow-right"} /></div>
+                    <div className="presPanel-divider"></div>
+                    <Tooltip title={<><div className="dash-tooltip">{"Click to return to 1st slide"}</div></>}><div className="presPanel-button" style={{ border: 'solid 1px white' }} onClick={() => this.gotoDocument(0, this.activeItem)}><b>1</b></div></Tooltip>
+                    <div className="presPanel-button-text">
+                        Slide {this.itemIndex + 1} / {this.childDocs.length}
+                        {this.playButtonFrames}
+                    </div>
+                    <div className="presPanel-divider"></div>
+                    <div className="presPanel-button-text" onClick={undoBatch(action(() => { this.updateMinimize(); this.layoutDoc.presStatus = PresStatus.Edit; clearTimeout(this._presTimer); }))}>EXIT</div>
+                </div>
+            </div>
+            :
+            <div className="presBox-cont" style={{ minWidth: CurrentUserUtils.OverlayDocs.includes(this.layoutDoc) ? 240 : undefined }} >
+                {this.topPanel}
+                {this.toolbar}
+                {this.newDocumentToolbarDropdown}
+                <div className="presBox-listCont">
+                    {mode !== CollectionViewType.Invalid ?
+                        <CollectionView {...this.props}
+                            ContainingCollectionDoc={this.props.Document}
+                            PanelWidth={this.props.PanelWidth}
+                            PanelHeight={this.panelHeight}
+                            childIgnoreNativeSize={true}
+                            moveDocument={returnFalse}
+                            childFitWidth={returnTrue}
+                            childOpacity={returnOne}
+                            childLayoutTemplate={this.childLayoutTemplate}
+                            filterAddDocument={this.addDocumentFilter}
+                            removeDocument={returnFalse}
+                            dontRegisterView={true}
+                            focus={this.selectElement}
+                            ScreenToLocalTransform={this.getTransform}
+                        />
+                        : (null)
+                    }
+                </div>
+            </div>;
+    }
+}
+Scripting.addGlobal(function lookupPresBoxField(container: Doc, field: string, data: Doc) {
+    if (field === 'indexInPres') return DocListCast(container[StrCast(container.presentationFieldKey)]).indexOf(data);
+    if (field === 'presCollapsedHeight') return container._viewType === CollectionViewType.Stacking ? 35 : 31;
+    if (field === 'presStatus') return container.presStatus;
+    if (field === '_itemIndex') return container._itemIndex;
+    if (field === 'presBox') return container;
+    return undefined;
+});
\ No newline at end of file
diff --git a/src/client/views/nodes/trails/PresElementBox.scss b/src/client/views/nodes/trails/PresElementBox.scss
new file mode 100644
index 000000000..1ad4b820e
--- /dev/null
+++ b/src/client/views/nodes/trails/PresElementBox.scss
@@ -0,0 +1,235 @@
+$light-blue: #AEDDF8;
+$dark-blue: #5B9FDD;
+$light-background: #ececec;
+$slide-background: #d5dce2;
+$slide-active: #5B9FDD;
+
+.presItem-container {
+    cursor: grab;
+    display: grid;
+    grid-template-columns: 20px auto;
+    font-family: Roboto;
+    letter-spacing: normal;
+    position: relative;
+    pointer-events: all;
+    width: 100%;
+    height: 100%;
+    font-weight: 400;
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    align-items: center;
+
+    .presItem-number {
+        margin-top: 3.5px;
+        font-size: 12px;
+        font-weight: 700;
+        text-align: center;
+        justify-self: center;
+        align-self: flex-start;
+        position: relative;
+        display: inline-block;
+        overflow: hidden;
+    }
+
+}
+
+.presItem-slide {
+    position: relative;
+    background-color: #d5dce2;
+    border-radius: 5px;
+    height: calc(100% - 7px);
+    width: calc(100% - 15px);
+    display: grid;
+    grid-template-rows: 16px 10px auto;
+    grid-template-columns: max-content max-content max-content max-content auto;
+
+    .presItem-name {
+        min-width: 20px;
+        z-index: 300;
+        top: 2px;
+        align-self: center;
+        font-size: 11px;
+        font-family: Roboto;
+        font-weight: 500;
+        position: relative;
+        padding-left: 10px;
+        padding-right: 10px;
+        letter-spacing: normal;
+        width: max-content;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        white-space: pre;
+    }
+
+    .presItem-docName {
+        min-width: 20px;
+        z-index: 300;
+        align-self: center;
+        font-size: 9px;
+        font-family: Roboto;
+        font-weight: 300;
+        position: relative;
+        padding-left: 10px;
+        padding-right: 10px;
+        letter-spacing: normal;
+        width: max-content;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        white-space: pre;
+        grid-row: 2;
+        grid-column: 1/6;
+    }
+
+    .presItem-time {
+        align-self: center;
+        position: relative;
+        padding-right: 10px;
+        top: 1px;
+        font-size: 10;
+        font-weight: 300;
+        font-family: Roboto;
+        z-index: 300;
+        letter-spacing: normal;
+    }
+
+    .presItem-embedded {
+        overflow: hidden;
+        grid-row: 3;
+        grid-column: 1/8;
+        position: relative;
+        display: flex;
+        width: auto;
+        justify-content: center;
+        margin: auto;
+        margin-bottom: 2px;
+        border-bottom-left-radius: 5px;
+        border-bottom-right-radius: 5px;
+    }
+
+    .presItem-embeddedMask {
+        width: 100%;
+        height: 100%;
+        position: absolute;
+        border-radius: 3px;
+        top: 0;
+        left: 0;
+        z-index: 1;
+        overflow: hidden;
+    }
+
+
+    .presItem-slideButtons {
+        display: flex;
+        grid-column: 7;
+        grid-row: 1/3;
+        width: max-content;
+        justify-self: right;
+        justify-content: flex-end;
+
+        .slideButton {
+            cursor: pointer;
+            position: relative;
+            border-radius: 100px;
+            z-index: 300;
+            width: 18px;
+            height: 18px;
+            display: flex;
+            font-size: 12px;
+            justify-self: center;
+            align-self: center;
+            background-color: rgba(0, 0, 0, 0.5);
+            color: white;
+            justify-content: center;
+            align-items: center;
+            transition: 0.2s;
+            margin-right: 3px;
+        }
+
+        .slideButton:hover {
+            background-color: rgba(0, 0, 0, 1);
+            transform: scale(1.2);
+        }
+    }
+}
+
+// .presItem-slide:hover {
+//     .presItem-slideButtons {
+//         display: flex;
+//         grid-column: 7;
+//         grid-row: 1/3;
+//         width: max-content;
+//         justify-self: right;
+//         justify-content: flex-end;
+
+//         .slideButton {
+//             cursor: pointer;
+//             position: relative;
+//             border-radius: 100px;
+//             z-index: 300;
+//             width: 18px;
+//             height: 18px;
+//             display: flex;
+//             font-size: 12px;
+//             justify-self: center;
+//             align-self: center;
+//             background-color: rgba(0, 0, 0, 0.5);
+//             color: white;
+//             justify-content: center;
+//             align-items: center;
+//             transition: 0.2s;
+//             margin-right: 3px;
+//         }
+
+//         .slideButton:hover {
+//             background-color: rgba(0, 0, 0, 1);
+//             transform: scale(1.2);
+//         }
+//     }
+// }
+
+.presItem-slide.active {
+    box-shadow: 0 0 0px 1.5px $dark-blue;
+}
+
+.presItem-multiDrag {
+    font-family: Roboto;
+    font-weight: 600;
+    color: white;
+    text-align: center;
+    justify-content: center;
+    align-content: center;
+    width: 100px;
+    height: 30px;
+    position: absolute;
+    background-color: $dark-blue;
+    z-index: 4000;
+    border-radius: 10px;
+    box-shadow: black 0.4vw 0.4vw 0.8vw;
+    line-height: 30px;
+}
+
+.presItem-miniSlide {
+    font-weight: 700;
+    font-size: 12;
+    grid-column: 1/8;
+    align-self: center;
+    justify-self: center;
+    background-color: #d5dce2;
+    width: 26px;
+    text-align: center;
+    height: 26px;
+    line-height: 28px;
+    border-radius: 100%;
+}
+
+.presItem-miniSlide.active {
+    box-shadow: 0 0 0px 1.5px $dark-blue;
+}
+
+// .presItem-slide:hover {
+//     background: $slide-hover;
+// }
\ No newline at end of file
diff --git a/src/client/views/nodes/trails/PresElementBox.tsx b/src/client/views/nodes/trails/PresElementBox.tsx
new file mode 100644
index 000000000..5e713c3cf
--- /dev/null
+++ b/src/client/views/nodes/trails/PresElementBox.tsx
@@ -0,0 +1,388 @@
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { Tooltip } from "@material-ui/core";
+import { action, computed, IReactionDisposer, observable, reaction } from "mobx";
+import { observer } from "mobx-react";
+import { DataSym, Doc, Opt } from "../../../../fields/Doc";
+import { documentSchema } from '../../../../fields/documentSchemas';
+import { Id } from "../../../../fields/FieldSymbols";
+import { createSchema, makeInterface } from '../../../../fields/Schema';
+import { Cast, NumCast, StrCast } from "../../../../fields/Types";
+import { emptyFunction, returnFalse, returnTrue, setupMoveUpEvents, emptyPath, returnEmptyDoclist } from "../../../../Utils";
+import { DocumentType } from "../../../documents/DocumentTypes";
+import { CurrentUserUtils } from "../../../util/CurrentUserUtils";
+import { DocumentManager } from "../../../util/DocumentManager";
+import { DragManager } from "../../../util/DragManager";
+import { Transform } from "../../../util/Transform";
+import { undoBatch } from "../../../util/UndoManager";
+import { ViewBoxBaseComponent } from '../../DocComponent';
+import { EditableView } from "../../EditableView";
+import { DocumentView, DocumentViewProps } from "../../nodes/DocumentView";
+import { FieldView, FieldViewProps } from '../../nodes/FieldView';
+import { PresBox } from "./PresBox";
+import { Colors } from "../../global/globalEnums";
+import { StyleProp } from "../../StyleProvider";
+import "./PresElementBox.scss";
+import React = require("react");
+import { DocUtils } from "../../../documents/Documents";
+import { PresMovement } from "./PresEnums";
+
+export const presSchema = createSchema({
+    presentationTargetDoc: Doc,
+    presBox: Doc,
+    presZoomButton: "boolean",
+    presNavButton: "boolean",
+    presHideTillShownButton: "boolean",
+    presFadeButton: "boolean",
+    presHideAfterButton: "boolean",
+    presGroupButton: "boolean",
+    presExpandInlineButton: "boolean"
+});
+
+type PresDocument = makeInterface<[typeof presSchema, typeof documentSchema]>;
+const PresDocument = makeInterface(presSchema, documentSchema);
+/**
+ * This class models the view a document added to presentation will have in the presentation.
+ * It involves some functionality for its buttons and options.
+ */
+@observer
+export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps, PresDocument>(PresDocument) {
+    public static LayoutString(fieldKey: string) { return FieldView.LayoutString(PresElementBox, fieldKey); }
+    _heightDisposer: IReactionDisposer | undefined;
+
+    @observable _dragging = false;
+    // these fields are conditionally computed fields on the layout document that take this document as a parameter
+    @computed get indexInPres() { return Number(this.lookupField("indexInPres")); }  // the index field is where this document is in the presBox display list (since this value is different for each presentation element, the value can't be stored on the layout template which is used by all display elements)
+    @computed get collapsedHeight() { return Number(this.lookupField("presCollapsedHeight")); } // the collapsed height changes depending on the state of the presBox.  We could store this on the presentation element template if it's used by only one presentation - but if it's shared by multiple, then this value must be looked up
+    @computed get presStatus() { return StrCast(this.lookupField("presStatus")); }
+    @computed get itemIndex() { return NumCast(this.lookupField("_itemIndex")); }
+    @computed get presBox() { return Cast(this.lookupField("presBox"), Doc, null); }
+    @computed get targetDoc() { return Cast(this.rootDoc.presentationTargetDoc, Doc, null) || this.rootDoc; }
+
+    componentDidMount() {
+        this.layoutDoc.hideLinkButton = true;
+        this._heightDisposer = reaction(() => [this.rootDoc.presExpandInlineButton, this.collapsedHeight],
+            params => this.layoutDoc._height = NumCast(params[1]) + (Number(params[0]) ? 100 : 0), { fireImmediately: true });
+    }
+    componentWillUnmount() {
+        this._heightDisposer?.();
+    }
+
+    /**
+     * Returns a local transformed coordinate array for given coordinates.
+     */
+    ScreenToLocalListTransform = (xCord: number, yCord: number) => [xCord, yCord];
+
+    @action
+    presExpandDocumentClick = () => {
+        this.rootDoc.presExpandInlineButton = !this.rootDoc.presExpandInlineButton;
+    }
+
+    embedHeight = (): number => 97;
+    // embedWidth = () => this.props.PanelWidth();
+    // embedHeight = () => Math.min(this.props.PanelWidth() - 20, this.props.PanelHeight() - this.collapsedHeight);
+    embedWidth = (): number => this.props.PanelWidth() - 35;
+    styleProvider = (doc: (Doc | undefined), props: Opt<DocumentViewProps>, property: string): any => {
+        if (property === StyleProp.Opacity) return 1;
+        return this.props.styleProvider?.(doc, props, property);
+    }
+    /**
+     * The function that is responsible for rendering a preview or not for this
+     * presentation element.
+     */
+    @computed get renderEmbeddedInline() {
+        return !this.rootDoc.presExpandInlineButton || !this.targetDoc ? (null) :
+            <div className="presItem-embedded" style={{ height: this.embedHeight(), width: this.embedWidth() }}>
+                <DocumentView
+                    Document={this.targetDoc}
+                    DataDoc={this.targetDoc[DataSym] !== this.targetDoc && this.targetDoc[DataSym]}
+                    styleProvider={this.styleProvider}
+                    layerProvider={this.props.layerProvider}
+                    docViewPath={returnEmptyDoclist}
+                    rootSelected={returnTrue}
+                    addDocument={returnFalse}
+                    removeDocument={returnFalse}
+                    isContentActive={this.props.isContentActive}
+                    addDocTab={returnFalse}
+                    pinToPres={returnFalse}
+                    PanelWidth={this.embedWidth}
+                    PanelHeight={this.embedHeight}
+                    ScreenToLocalTransform={Transform.Identity}
+                    moveDocument={this.props.moveDocument!}
+                    renderDepth={this.props.renderDepth + 1}
+                    focus={DocUtils.DefaultFocus}
+                    whenChildContentsActiveChanged={returnFalse}
+                    bringToFront={returnFalse}
+                    docFilters={this.props.docFilters}
+                    docRangeFilters={this.props.docRangeFilters}
+                    searchFilterDocs={this.props.searchFilterDocs}
+                    ContainingCollectionView={undefined}
+                    ContainingCollectionDoc={undefined}
+                    hideLinkButton={true}
+                />
+                <div className="presItem-embeddedMask" />
+            </div>;
+    }
+
+    @computed get duration() {
+        let durationInS: number;
+        if (this.rootDoc.type === DocumentType.AUDIO || this.rootDoc.type === DocumentType.VID) { durationInS = NumCast(this.rootDoc.presEndTime) - NumCast(this.rootDoc.presStartTime); durationInS = Math.round(durationInS * 10) / 10; }
+        else if (this.rootDoc.presDuration) durationInS = NumCast(this.rootDoc.presDuration) / 1000;
+        else durationInS = 2;
+        return "D: " + durationInS + "s";
+    }
+
+    @computed get transition() {
+        let transitionInS: number;
+        if (this.rootDoc.presTransition) transitionInS = NumCast(this.rootDoc.presTransition) / 1000;
+        else transitionInS = 0.5;
+        return this.rootDoc.presMovement === PresMovement.Jump || this.rootDoc.presMovement === PresMovement.None ? (null) : "M: " + transitionInS + "s";
+    }
+
+    private _itemRef: React.RefObject<HTMLDivElement> = React.createRef();
+    private _dragRef: React.RefObject<HTMLDivElement> = React.createRef();
+    private _titleRef: React.RefObject<EditableView> = React.createRef();
+
+
+    @action
+    headerDown = (e: React.PointerEvent<HTMLDivElement>) => {
+        const element = e.target as any;
+        e.stopPropagation();
+        e.preventDefault();
+        if (element && !(e.ctrlKey || e.metaKey)) {
+            if (PresBox.Instance._selectedArray.has(this.rootDoc)) {
+                PresBox.Instance._selectedArray.size === 1 && PresBox.Instance.regularSelect(this.rootDoc, this._itemRef.current!, this._dragRef.current!, false);
+                setupMoveUpEvents(this, e, this.startDrag, emptyFunction, emptyFunction);
+            } else {
+                setupMoveUpEvents(this, e, ((e: PointerEvent) => {
+                    PresBox.Instance.regularSelect(this.rootDoc, this._itemRef.current!, this._dragRef.current!, false);
+                    return this.startDrag(e);
+                }), emptyFunction, emptyFunction);
+            }
+        }
+    }
+
+    headerUp = (e: React.PointerEvent<HTMLDivElement>) => {
+        e.stopPropagation();
+        e.preventDefault();
+    }
+
+    startDrag = (e: PointerEvent) => {
+        const miniView: boolean = this.toolbarWidth <= 100;
+        const activeItem = this.rootDoc;
+        const dragArray = PresBox.Instance._dragArray;
+        const dragData = new DragManager.DocumentDragData(PresBox.Instance.sortArray());
+        const dragItem: HTMLElement[] = [];
+        if (dragArray.length === 1) {
+            const doc = dragArray[0];
+            doc.className = miniView ? "presItem-miniSlide" : "presItem-slide";
+            dragItem.push(doc);
+        } else if (dragArray.length >= 1) {
+            const doc = document.createElement('div');
+            doc.className = "presItem-multiDrag";
+            doc.innerText = "Move " + PresBox.Instance._selectedArray.size + " slides";
+            doc.style.position = 'absolute';
+            doc.style.top = (e.clientY) + 'px';
+            doc.style.left = (e.clientX - 50) + 'px';
+            dragItem.push(doc);
+        }
+
+        // const dropEvent = () => runInAction(() => this._dragging = false);
+        if (activeItem) {
+            DragManager.StartDocumentDrag(dragItem.map(ele => ele), dragData, e.clientX, e.clientY, undefined);
+            // runInAction(() => this._dragging = true);
+            return true;
+        }
+        return false;
+    }
+
+    onPointerOver = (e: any) => {
+        document.removeEventListener("pointermove", this.onPointerMove);
+        document.addEventListener("pointermove", this.onPointerMove);
+    }
+
+    onPointerMove = (e: PointerEvent) => {
+        const slide = this._itemRef.current!;
+        let dragIsPresItem: boolean = DragManager.docsBeingDragged.length > 0 ? true : false;
+        for (const doc of DragManager.docsBeingDragged) {
+            if (!doc.presentationTargetDoc) dragIsPresItem = false;
+        }
+        if (slide && dragIsPresItem) {
+            const rect = slide.getBoundingClientRect();
+            const y = e.clientY - rect.top;  //y position within the element.
+            const height = slide.clientHeight;
+            const halfLine = height / 2;
+            if (y <= halfLine) {
+                slide.style.borderTop = `solid 2px ${Colors.MEDIUM_BLUE}`;
+                slide.style.borderBottom = "0px";
+            } else if (y > halfLine) {
+                slide.style.borderTop = "0px";
+                slide.style.borderBottom = `solid 2px ${Colors.MEDIUM_BLUE}`;
+            }
+        }
+        document.removeEventListener("pointermove", this.onPointerMove);
+    }
+
+    onPointerLeave = (e: any) => {
+        this._itemRef.current!.style.borderTop = "0px";
+        this._itemRef.current!.style.borderBottom = "0px";
+        document.removeEventListener("pointermove", this.onPointerMove);
+    }
+
+    @action
+    toggleProperties = () => {
+        if (CurrentUserUtils.propertiesWidth < 5) {
+            action(() => (CurrentUserUtils.propertiesWidth = 250));
+        }
+    }
+
+    @undoBatch
+    removeItem = action((e: React.MouseEvent) => {
+        this.props.removeDocument?.(this.rootDoc);
+        if (PresBox.Instance._selectedArray.has(this.rootDoc)) {
+            PresBox.Instance._selectedArray.delete(this.rootDoc);
+        }
+        e.stopPropagation();
+    });
+
+    @undoBatch
+    @action
+    onSetValue = (value: string) => {
+        this.rootDoc.title = !value.trim().length ? "-untitled-" : value;
+        return true;
+    }
+
+    /**
+     * Method called for updating the view of the currently selected document
+     * 
+     * @param targetDoc 
+     * @param activeItem 
+     */
+    @undoBatch
+    @action
+    updateView = (targetDoc: Doc, activeItem: Doc) => {
+        if (targetDoc.type === DocumentType.PDF || targetDoc.type === DocumentType.WEB || targetDoc.type === DocumentType.RTF) {
+            const scroll = targetDoc._scrollTop;
+            activeItem.presPinViewScroll = scroll;
+        } else if (targetDoc.type === DocumentType.VID) {
+            activeItem.presPinTimecode = targetDoc._currentTimecode;
+        } else if (targetDoc.type === DocumentType.COMPARISON) {
+            const clipWidth = targetDoc._clipWidth;
+            activeItem.presPinClipWidth = clipWidth;
+        } else {
+            const x = targetDoc._panX;
+            const y = targetDoc._panY;
+            const scale = targetDoc._viewScale;
+            activeItem.presPinViewX = x;
+            activeItem.presPinViewY = y;
+            activeItem.presPinViewScale = scale;
+        }
+    }
+
+    @computed
+    get toolbarWidth(): number {
+        const presBoxDocView = DocumentManager.Instance.getDocumentView(this.presBox);
+        let width: number = NumCast(this.presBox._width);
+        if (presBoxDocView) width = presBoxDocView.props.PanelWidth();
+        if (width === 0) width = 300;
+        return width;
+    }
+
+    @computed get mainItem() {
+        const isSelected: boolean = PresBox.Instance._selectedArray.has(this.rootDoc);
+        const toolbarWidth: number = this.toolbarWidth;
+        const showMore: boolean = this.toolbarWidth >= 300;
+        const miniView: boolean = this.toolbarWidth <= 110;
+        const presBox: Doc = this.presBox; //presBox
+        const presBoxColor: string = StrCast(presBox._backgroundColor);
+        const presColorBool: boolean = presBoxColor ? (presBoxColor !== Colors.WHITE && presBoxColor !== "transparent") : false;
+        const targetDoc: Doc = this.targetDoc;
+        const activeItem: Doc = this.rootDoc;
+        return (
+            <div className={`presItem-container`}
+                key={this.props.Document[Id] + this.indexInPres}
+                ref={this._itemRef}
+                style={{
+                    backgroundColor: presColorBool ? isSelected ? "rgba(250,250,250,0.3)" : "transparent" : isSelected ? Colors.LIGHT_BLUE : "transparent",
+                    opacity: this._dragging ? 0.3 : 1
+                }}
+                onClick={e => {
+                    e.stopPropagation();
+                    e.preventDefault();
+                    PresBox.Instance.modifierSelect(this.rootDoc, this._itemRef.current!, this._dragRef.current!, !e.shiftKey && !e.ctrlKey && !e.metaKey, e.ctrlKey || e.metaKey, e.shiftKey);
+                }}
+                onDoubleClick={action(e => {
+                    this.toggleProperties();
+                    PresBox.Instance.regularSelect(this.rootDoc, this._itemRef.current!, this._dragRef.current!, true);
+                })}
+                onPointerOver={this.onPointerOver}
+                onPointerLeave={this.onPointerLeave}
+                onPointerDown={this.headerDown}
+                onPointerUp={this.headerUp}
+            >
+                {miniView ?
+                    // when width is LESS than 110 px 
+                    <div className={`presItem-miniSlide ${isSelected ? "active" : ""}`} ref={miniView ? this._dragRef : null}>
+                        {`${this.indexInPres + 1}.`}
+                    </div>
+                    :
+                    // when width is MORE than 110 px 
+                    <div className="presItem-number">
+                        {`${this.indexInPres + 1}.`}
+                    </div>}
+                {miniView ? (null) : <div ref={miniView ? null : this._dragRef} className={`presItem-slide ${isSelected ? "active" : ""}`}
+                    style={{
+                        backgroundColor: this.props.styleProvider?.(this.layoutDoc, this.props, StyleProp.BackgroundColor),
+                        boxShadow: presBoxColor && presBoxColor !== "white" && presBoxColor !== "transparent" ? isSelected ? "0 0 0px 1.5px" + presBoxColor : undefined : undefined
+                    }}>
+                    <div className="presItem-name" style={{ maxWidth: showMore ? (toolbarWidth - 195) : toolbarWidth - 105, cursor: isSelected ? 'text' : 'grab' }}>
+                        <EditableView
+                            ref={this._titleRef}
+                            editing={!isSelected ? false : undefined}
+                            contents={activeItem.title}
+                            overflow={'ellipsis'}
+                            GetValue={() => StrCast(activeItem.title)}
+                            SetValue={this.onSetValue}
+                        />
+                    </div>
+                    <Tooltip title={<><div className="dash-tooltip">{"Movement speed"}</div></>}><div className="presItem-time" style={{ display: showMore ? "block" : "none" }}>{this.transition}</div></Tooltip>
+                    <Tooltip title={<><div className="dash-tooltip">{"Duration"}</div></>}><div className="presItem-time" style={{ display: showMore ? "block" : "none" }}>{this.duration}</div></Tooltip>
+                    <div className={"presItem-slideButtons"}>
+                        <Tooltip title={<><div className="dash-tooltip">{"Update view"}</div></>}>
+                            <div className="slideButton"
+                                onClick={() => this.updateView(targetDoc, activeItem)}
+                                style={{ fontWeight: 700, display: activeItem.presPinView ? "flex" : "none" }}>V</div>
+                        </Tooltip>
+                        {this.indexInPres === 0 ? (null) : <Tooltip title={<><div className="dash-tooltip">{activeItem.groupWithUp ? "Ungroup" : "Group with up"}</div></>}>
+                            <div className="slideButton"
+                                onClick={() => activeItem.groupWithUp = !activeItem.groupWithUp}
+                                style={{
+                                    zIndex: 1000 - this.indexInPres,
+                                    fontWeight: 700,
+                                    backgroundColor: activeItem.groupWithUp ? presColorBool ? presBoxColor : Colors.MEDIUM_BLUE : undefined,
+                                    height: activeItem.groupWithUp ? 53 : 18,
+                                    transform: activeItem.groupWithUp ? "translate(0, -17px)" : undefined
+                                }}>
+                                <div style={{ transform: activeItem.groupWithUp ? "rotate(180deg) translate(0, -17.5px)" : "rotate(0deg)" }}>
+                                    <FontAwesomeIcon icon={"arrow-up"} onPointerDown={e => e.stopPropagation()} />
+                                </div>
+                            </div>
+                        </Tooltip>}
+                        <Tooltip title={<><div className="dash-tooltip">{this.rootDoc.presExpandInlineButton ? "Minimize" : "Expand"}</div></>}><div className={"slideButton"} onClick={e => { e.stopPropagation(); this.presExpandDocumentClick(); }}>
+                            <FontAwesomeIcon icon={this.rootDoc.presExpandInlineButton ? "eye-slash" : "eye"} onPointerDown={e => e.stopPropagation()} />
+                        </div></Tooltip>
+                        <Tooltip title={<><div className="dash-tooltip">{"Remove from presentation"}</div></>}><div
+                            className={"slideButton"}
+                            onClick={this.removeItem}>
+                            <FontAwesomeIcon icon={"trash"} onPointerDown={e => e.stopPropagation()} />
+                        </div></Tooltip>
+                    </div>
+                    <div className="presItem-docName" style={{ maxWidth: showMore ? (toolbarWidth - 195) : toolbarWidth - 105 }}>{activeItem.presPinView ? (<><i>View of </i> {targetDoc.title}</>) : targetDoc.title}</div>
+                    {this.renderEmbeddedInline}
+                </div>}
+            </div >);
+    }
+
+    render() {
+        return !(this.rootDoc instanceof Doc) || this.targetDoc instanceof Promise ? (null) : this.mainItem;
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/nodes/trails/PresEnums.ts b/src/client/views/nodes/trails/PresEnums.ts
new file mode 100644
index 000000000..93ab323fb
--- /dev/null
+++ b/src/client/views/nodes/trails/PresEnums.ts
@@ -0,0 +1,28 @@
+export enum PresMovement {
+    Zoom = "zoom",
+    Pan = "pan",
+    Jump = "jump",
+    None = "none",
+}
+
+export enum PresEffect {
+    Zoom = "Zoom",
+    Lightspeed = "Lightspeed",
+    Fade = "Fade in",
+    Flip = "Flip",
+    Rotate = "Rotate",
+    Bounce = "Bounce",
+    Roll = "Roll",
+    None = "None",
+    Left = "left",
+    Right = "right",
+    Center = "center",
+    Top = "top",
+    Bottom = "bottom"
+}
+
+export enum PresStatus {
+    Autoplay = "auto",
+    Manual = "manual",
+    Edit = "edit"
+}
\ No newline at end of file
diff --git a/src/client/views/nodes/trails/index.ts b/src/client/views/nodes/trails/index.ts
new file mode 100644
index 000000000..8f3f7b03a
--- /dev/null
+++ b/src/client/views/nodes/trails/index.ts
@@ -0,0 +1,3 @@
+export * from "./PresBox";
+export * from "./PresElementBox";
+export * from "./PresEnums";
\ No newline at end of file
diff --git a/src/client/views/presentationview/PresElementBox.scss b/src/client/views/presentationview/PresElementBox.scss
deleted file mode 100644
index 1ad4b820e..000000000
--- a/src/client/views/presentationview/PresElementBox.scss
+++ /dev/null
@@ -1,235 +0,0 @@
-$light-blue: #AEDDF8;
-$dark-blue: #5B9FDD;
-$light-background: #ececec;
-$slide-background: #d5dce2;
-$slide-active: #5B9FDD;
-
-.presItem-container {
-    cursor: grab;
-    display: grid;
-    grid-template-columns: 20px auto;
-    font-family: Roboto;
-    letter-spacing: normal;
-    position: relative;
-    pointer-events: all;
-    width: 100%;
-    height: 100%;
-    font-weight: 400;
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    align-items: center;
-
-    .presItem-number {
-        margin-top: 3.5px;
-        font-size: 12px;
-        font-weight: 700;
-        text-align: center;
-        justify-self: center;
-        align-self: flex-start;
-        position: relative;
-        display: inline-block;
-        overflow: hidden;
-    }
-
-}
-
-.presItem-slide {
-    position: relative;
-    background-color: #d5dce2;
-    border-radius: 5px;
-    height: calc(100% - 7px);
-    width: calc(100% - 15px);
-    display: grid;
-    grid-template-rows: 16px 10px auto;
-    grid-template-columns: max-content max-content max-content max-content auto;
-
-    .presItem-name {
-        min-width: 20px;
-        z-index: 300;
-        top: 2px;
-        align-self: center;
-        font-size: 11px;
-        font-family: Roboto;
-        font-weight: 500;
-        position: relative;
-        padding-left: 10px;
-        padding-right: 10px;
-        letter-spacing: normal;
-        width: max-content;
-        text-overflow: ellipsis;
-        overflow: hidden;
-        white-space: pre;
-    }
-
-    .presItem-docName {
-        min-width: 20px;
-        z-index: 300;
-        align-self: center;
-        font-size: 9px;
-        font-family: Roboto;
-        font-weight: 300;
-        position: relative;
-        padding-left: 10px;
-        padding-right: 10px;
-        letter-spacing: normal;
-        width: max-content;
-        text-overflow: ellipsis;
-        overflow: hidden;
-        white-space: pre;
-        grid-row: 2;
-        grid-column: 1/6;
-    }
-
-    .presItem-time {
-        align-self: center;
-        position: relative;
-        padding-right: 10px;
-        top: 1px;
-        font-size: 10;
-        font-weight: 300;
-        font-family: Roboto;
-        z-index: 300;
-        letter-spacing: normal;
-    }
-
-    .presItem-embedded {
-        overflow: hidden;
-        grid-row: 3;
-        grid-column: 1/8;
-        position: relative;
-        display: flex;
-        width: auto;
-        justify-content: center;
-        margin: auto;
-        margin-bottom: 2px;
-        border-bottom-left-radius: 5px;
-        border-bottom-right-radius: 5px;
-    }
-
-    .presItem-embeddedMask {
-        width: 100%;
-        height: 100%;
-        position: absolute;
-        border-radius: 3px;
-        top: 0;
-        left: 0;
-        z-index: 1;
-        overflow: hidden;
-    }
-
-
-    .presItem-slideButtons {
-        display: flex;
-        grid-column: 7;
-        grid-row: 1/3;
-        width: max-content;
-        justify-self: right;
-        justify-content: flex-end;
-
-        .slideButton {
-            cursor: pointer;
-            position: relative;
-            border-radius: 100px;
-            z-index: 300;
-            width: 18px;
-            height: 18px;
-            display: flex;
-            font-size: 12px;
-            justify-self: center;
-            align-self: center;
-            background-color: rgba(0, 0, 0, 0.5);
-            color: white;
-            justify-content: center;
-            align-items: center;
-            transition: 0.2s;
-            margin-right: 3px;
-        }
-
-        .slideButton:hover {
-            background-color: rgba(0, 0, 0, 1);
-            transform: scale(1.2);
-        }
-    }
-}
-
-// .presItem-slide:hover {
-//     .presItem-slideButtons {
-//         display: flex;
-//         grid-column: 7;
-//         grid-row: 1/3;
-//         width: max-content;
-//         justify-self: right;
-//         justify-content: flex-end;
-
-//         .slideButton {
-//             cursor: pointer;
-//             position: relative;
-//             border-radius: 100px;
-//             z-index: 300;
-//             width: 18px;
-//             height: 18px;
-//             display: flex;
-//             font-size: 12px;
-//             justify-self: center;
-//             align-self: center;
-//             background-color: rgba(0, 0, 0, 0.5);
-//             color: white;
-//             justify-content: center;
-//             align-items: center;
-//             transition: 0.2s;
-//             margin-right: 3px;
-//         }
-
-//         .slideButton:hover {
-//             background-color: rgba(0, 0, 0, 1);
-//             transform: scale(1.2);
-//         }
-//     }
-// }
-
-.presItem-slide.active {
-    box-shadow: 0 0 0px 1.5px $dark-blue;
-}
-
-.presItem-multiDrag {
-    font-family: Roboto;
-    font-weight: 600;
-    color: white;
-    text-align: center;
-    justify-content: center;
-    align-content: center;
-    width: 100px;
-    height: 30px;
-    position: absolute;
-    background-color: $dark-blue;
-    z-index: 4000;
-    border-radius: 10px;
-    box-shadow: black 0.4vw 0.4vw 0.8vw;
-    line-height: 30px;
-}
-
-.presItem-miniSlide {
-    font-weight: 700;
-    font-size: 12;
-    grid-column: 1/8;
-    align-self: center;
-    justify-self: center;
-    background-color: #d5dce2;
-    width: 26px;
-    text-align: center;
-    height: 26px;
-    line-height: 28px;
-    border-radius: 100%;
-}
-
-.presItem-miniSlide.active {
-    box-shadow: 0 0 0px 1.5px $dark-blue;
-}
-
-// .presItem-slide:hover {
-//     background: $slide-hover;
-// }
\ No newline at end of file
diff --git a/src/client/views/presentationview/PresElementBox.tsx b/src/client/views/presentationview/PresElementBox.tsx
deleted file mode 100644
index f15d51764..000000000
--- a/src/client/views/presentationview/PresElementBox.tsx
+++ /dev/null
@@ -1,386 +0,0 @@
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { Tooltip } from "@material-ui/core";
-import { action, computed, IReactionDisposer, observable, reaction } from "mobx";
-import { observer } from "mobx-react";
-import { DataSym, Doc, Opt } from "../../../fields/Doc";
-import { documentSchema } from '../../../fields/documentSchemas';
-import { Id } from "../../../fields/FieldSymbols";
-import { createSchema, makeInterface } from '../../../fields/Schema';
-import { Cast, NumCast, StrCast } from "../../../fields/Types";
-import { emptyFunction, returnFalse, returnTrue, setupMoveUpEvents, emptyPath, returnEmptyDoclist } from "../../../Utils";
-import { DocumentType } from "../../documents/DocumentTypes";
-import { CurrentUserUtils } from "../../util/CurrentUserUtils";
-import { DocumentManager } from "../../util/DocumentManager";
-import { DragManager } from "../../util/DragManager";
-import { Transform } from "../../util/Transform";
-import { undoBatch } from "../../util/UndoManager";
-import { ViewBoxBaseComponent } from '../DocComponent';
-import { EditableView } from "../EditableView";
-import { DocumentView, DocumentViewProps } from "../nodes/DocumentView";
-import { FieldView, FieldViewProps } from '../nodes/FieldView';
-import { PresBox, PresColor, PresMovement } from "../nodes/PresBox";
-import { StyleProp } from "../StyleProvider";
-import "./PresElementBox.scss";
-import React = require("react");
-import { DocUtils } from "../../documents/Documents";
-
-export const presSchema = createSchema({
-    presentationTargetDoc: Doc,
-    presBox: Doc,
-    presZoomButton: "boolean",
-    presNavButton: "boolean",
-    presHideTillShownButton: "boolean",
-    presFadeButton: "boolean",
-    presHideAfterButton: "boolean",
-    presGroupButton: "boolean",
-    presExpandInlineButton: "boolean"
-});
-
-type PresDocument = makeInterface<[typeof presSchema, typeof documentSchema]>;
-const PresDocument = makeInterface(presSchema, documentSchema);
-/**
- * This class models the view a document added to presentation will have in the presentation.
- * It involves some functionality for its buttons and options.
- */
-@observer
-export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps, PresDocument>(PresDocument) {
-    public static LayoutString(fieldKey: string) { return FieldView.LayoutString(PresElementBox, fieldKey); }
-    _heightDisposer: IReactionDisposer | undefined;
-
-    @observable _dragging = false;
-    // these fields are conditionally computed fields on the layout document that take this document as a parameter
-    @computed get indexInPres() { return Number(this.lookupField("indexInPres")); }  // the index field is where this document is in the presBox display list (since this value is different for each presentation element, the value can't be stored on the layout template which is used by all display elements)
-    @computed get collapsedHeight() { return Number(this.lookupField("presCollapsedHeight")); } // the collapsed height changes depending on the state of the presBox.  We could store this on the presentation element template if it's used by only one presentation - but if it's shared by multiple, then this value must be looked up
-    @computed get presStatus() { return StrCast(this.lookupField("presStatus")); }
-    @computed get itemIndex() { return NumCast(this.lookupField("_itemIndex")); }
-    @computed get presBox() { return Cast(this.lookupField("presBox"), Doc, null); }
-    @computed get targetDoc() { return Cast(this.rootDoc.presentationTargetDoc, Doc, null) || this.rootDoc; }
-
-    componentDidMount() {
-        this.layoutDoc.hideLinkButton = true;
-        this._heightDisposer = reaction(() => [this.rootDoc.presExpandInlineButton, this.collapsedHeight],
-            params => this.layoutDoc._height = NumCast(params[1]) + (Number(params[0]) ? 100 : 0), { fireImmediately: true });
-    }
-    componentWillUnmount() {
-        this._heightDisposer?.();
-    }
-
-    /**
-     * Returns a local transformed coordinate array for given coordinates.
-     */
-    ScreenToLocalListTransform = (xCord: number, yCord: number) => [xCord, yCord];
-
-    @action
-    presExpandDocumentClick = () => {
-        this.rootDoc.presExpandInlineButton = !this.rootDoc.presExpandInlineButton;
-    }
-
-    embedHeight = (): number => 97;
-    // embedWidth = () => this.props.PanelWidth();
-    // embedHeight = () => Math.min(this.props.PanelWidth() - 20, this.props.PanelHeight() - this.collapsedHeight);
-    embedWidth = (): number => this.props.PanelWidth() - 35;
-    styleProvider = (doc: (Doc | undefined), props: Opt<DocumentViewProps>, property: string): any => {
-        if (property === StyleProp.Opacity) return 1;
-        return this.props.styleProvider?.(doc, props, property);
-    }
-    /**
-     * The function that is responsible for rendering a preview or not for this
-     * presentation element.
-     */
-    @computed get renderEmbeddedInline() {
-        return !this.rootDoc.presExpandInlineButton || !this.targetDoc ? (null) :
-            <div className="presItem-embedded" style={{ height: this.embedHeight(), width: this.embedWidth() }}>
-                <DocumentView
-                    Document={this.targetDoc}
-                    DataDoc={this.targetDoc[DataSym] !== this.targetDoc && this.targetDoc[DataSym]}
-                    styleProvider={this.styleProvider}
-                    layerProvider={this.props.layerProvider}
-                    docViewPath={returnEmptyDoclist}
-                    rootSelected={returnTrue}
-                    addDocument={returnFalse}
-                    removeDocument={returnFalse}
-                    isContentActive={this.props.isContentActive}
-                    addDocTab={returnFalse}
-                    pinToPres={returnFalse}
-                    PanelWidth={this.embedWidth}
-                    PanelHeight={this.embedHeight}
-                    ScreenToLocalTransform={Transform.Identity}
-                    moveDocument={this.props.moveDocument!}
-                    renderDepth={this.props.renderDepth + 1}
-                    focus={DocUtils.DefaultFocus}
-                    whenChildContentsActiveChanged={returnFalse}
-                    bringToFront={returnFalse}
-                    docFilters={this.props.docFilters}
-                    docRangeFilters={this.props.docRangeFilters}
-                    searchFilterDocs={this.props.searchFilterDocs}
-                    ContainingCollectionView={undefined}
-                    ContainingCollectionDoc={undefined}
-                    hideLinkButton={true}
-                />
-                <div className="presItem-embeddedMask" />
-            </div>;
-    }
-
-    @computed get duration() {
-        let durationInS: number;
-        if (this.rootDoc.type === DocumentType.AUDIO || this.rootDoc.type === DocumentType.VID) { durationInS = NumCast(this.rootDoc.presEndTime) - NumCast(this.rootDoc.presStartTime); durationInS = Math.round(durationInS * 10) / 10; }
-        else if (this.rootDoc.presDuration) durationInS = NumCast(this.rootDoc.presDuration) / 1000;
-        else durationInS = 2;
-        return "D: " + durationInS + "s";
-    }
-
-    @computed get transition() {
-        let transitionInS: number;
-        if (this.rootDoc.presTransition) transitionInS = NumCast(this.rootDoc.presTransition) / 1000;
-        else transitionInS = 0.5;
-        return this.rootDoc.presMovement === PresMovement.Jump || this.rootDoc.presMovement === PresMovement.None ? (null) : "M: " + transitionInS + "s";
-    }
-
-    private _itemRef: React.RefObject<HTMLDivElement> = React.createRef();
-    private _dragRef: React.RefObject<HTMLDivElement> = React.createRef();
-    private _titleRef: React.RefObject<EditableView> = React.createRef();
-
-
-    @action
-    headerDown = (e: React.PointerEvent<HTMLDivElement>) => {
-        const element = e.target as any;
-        e.stopPropagation();
-        e.preventDefault();
-        if (element && !(e.ctrlKey || e.metaKey)) {
-            if (PresBox.Instance._selectedArray.has(this.rootDoc)) {
-                PresBox.Instance._selectedArray.size === 1 && PresBox.Instance.regularSelect(this.rootDoc, this._itemRef.current!, this._dragRef.current!, false);
-                setupMoveUpEvents(this, e, this.startDrag, emptyFunction, emptyFunction);
-            } else {
-                setupMoveUpEvents(this, e, ((e: PointerEvent) => {
-                    PresBox.Instance.regularSelect(this.rootDoc, this._itemRef.current!, this._dragRef.current!, false);
-                    return this.startDrag(e);
-                }), emptyFunction, emptyFunction);
-            }
-        }
-    }
-
-    headerUp = (e: React.PointerEvent<HTMLDivElement>) => {
-        e.stopPropagation();
-        e.preventDefault();
-    }
-
-    startDrag = (e: PointerEvent) => {
-        const miniView: boolean = this.toolbarWidth <= 100;
-        const activeItem = this.rootDoc;
-        const dragArray = PresBox.Instance._dragArray;
-        const dragData = new DragManager.DocumentDragData(PresBox.Instance.sortArray());
-        const dragItem: HTMLElement[] = [];
-        if (dragArray.length === 1) {
-            const doc = dragArray[0];
-            doc.className = miniView ? "presItem-miniSlide" : "presItem-slide";
-            dragItem.push(doc);
-        } else if (dragArray.length >= 1) {
-            const doc = document.createElement('div');
-            doc.className = "presItem-multiDrag";
-            doc.innerText = "Move " + PresBox.Instance._selectedArray.size + " slides";
-            doc.style.position = 'absolute';
-            doc.style.top = (e.clientY) + 'px';
-            doc.style.left = (e.clientX - 50) + 'px';
-            dragItem.push(doc);
-        }
-
-        // const dropEvent = () => runInAction(() => this._dragging = false);
-        if (activeItem) {
-            DragManager.StartDocumentDrag(dragItem.map(ele => ele), dragData, e.clientX, e.clientY, undefined);
-            // runInAction(() => this._dragging = true);
-            return true;
-        }
-        return false;
-    }
-
-    onPointerOver = (e: any) => {
-        document.removeEventListener("pointermove", this.onPointerMove);
-        document.addEventListener("pointermove", this.onPointerMove);
-    }
-
-    onPointerMove = (e: PointerEvent) => {
-        const slide = this._itemRef.current!;
-        let dragIsPresItem: boolean = DragManager.docsBeingDragged.length > 0 ? true : false;
-        for (const doc of DragManager.docsBeingDragged) {
-            if (!doc.presentationTargetDoc) dragIsPresItem = false;
-        }
-        if (slide && dragIsPresItem) {
-            const rect = slide.getBoundingClientRect();
-            const y = e.clientY - rect.top;  //y position within the element.
-            const height = slide.clientHeight;
-            const halfLine = height / 2;
-            if (y <= halfLine) {
-                slide.style.borderTop = "solid 2px #5B9FDD";
-                slide.style.borderBottom = "0px";
-            } else if (y > halfLine) {
-                slide.style.borderTop = "0px";
-                slide.style.borderBottom = "solid 2px #5B9FDD";
-            }
-        }
-        document.removeEventListener("pointermove", this.onPointerMove);
-    }
-
-    onPointerLeave = (e: any) => {
-        this._itemRef.current!.style.borderTop = "0px";
-        this._itemRef.current!.style.borderBottom = "0px";
-        document.removeEventListener("pointermove", this.onPointerMove);
-    }
-
-    @action
-    toggleProperties = () => {
-        if (CurrentUserUtils.propertiesWidth < 5) {
-            action(() => (CurrentUserUtils.propertiesWidth = 250));
-        }
-    }
-
-    @undoBatch
-    removeItem = action((e: React.MouseEvent) => {
-        this.props.removeDocument?.(this.rootDoc);
-        if (PresBox.Instance._selectedArray.has(this.rootDoc)) {
-            PresBox.Instance._selectedArray.delete(this.rootDoc);
-        }
-        e.stopPropagation();
-    });
-
-    @undoBatch
-    @action
-    onSetValue = (value: string) => {
-        this.rootDoc.title = !value.trim().length ? "-untitled-" : value;
-        return true;
-    }
-
-    /**
-     * Method called for updating the view of the currently selected document
-     * 
-     * @param targetDoc 
-     * @param activeItem 
-     */
-    @undoBatch
-    @action
-    updateView = (targetDoc: Doc, activeItem: Doc) => {
-        if (targetDoc.type === DocumentType.PDF || targetDoc.type === DocumentType.WEB || targetDoc.type === DocumentType.RTF) {
-            const scroll = targetDoc._scrollTop;
-            activeItem.presPinViewScroll = scroll;
-        } else if (targetDoc.type === DocumentType.VID) {
-            activeItem.presPinTimecode = targetDoc._currentTimecode;
-        } else if (targetDoc.type === DocumentType.COMPARISON) {
-            const clipWidth = targetDoc._clipWidth;
-            activeItem.presPinClipWidth = clipWidth;
-        } else {
-            const x = targetDoc._panX;
-            const y = targetDoc._panY;
-            const scale = targetDoc._viewScale;
-            activeItem.presPinViewX = x;
-            activeItem.presPinViewY = y;
-            activeItem.presPinViewScale = scale;
-        }
-    }
-
-    @computed
-    get toolbarWidth(): number {
-        const presBoxDocView = DocumentManager.Instance.getDocumentView(this.presBox);
-        let width: number = NumCast(this.presBox._width);
-        if (presBoxDocView) width = presBoxDocView.props.PanelWidth();
-        if (width === 0) width = 300;
-        return width;
-    }
-
-    @computed get mainItem() {
-        const isSelected: boolean = PresBox.Instance._selectedArray.has(this.rootDoc);
-        const toolbarWidth: number = this.toolbarWidth;
-        const showMore: boolean = this.toolbarWidth >= 300;
-        const miniView: boolean = this.toolbarWidth <= 110;
-        const presBox: Doc = this.presBox; //presBox
-        const presBoxColor: string = StrCast(presBox._backgroundColor);
-        const presColorBool: boolean = presBoxColor ? (presBoxColor !== "white" && presBoxColor !== "transparent") : false;
-        const targetDoc: Doc = this.targetDoc;
-        const activeItem: Doc = this.rootDoc;
-        return (
-            <div className={`presItem-container`}
-                key={this.props.Document[Id] + this.indexInPres}
-                ref={this._itemRef}
-                style={{
-                    backgroundColor: presColorBool ? isSelected ? "rgba(250,250,250,0.3)" : "transparent" : isSelected ? "#AEDDF8" : "transparent",
-                    opacity: this._dragging ? 0.3 : 1
-                }}
-                onClick={e => {
-                    e.stopPropagation();
-                    e.preventDefault();
-                    PresBox.Instance.modifierSelect(this.rootDoc, this._itemRef.current!, this._dragRef.current!, !e.shiftKey && !e.ctrlKey && !e.metaKey, e.ctrlKey || e.metaKey, e.shiftKey);
-                }}
-                onDoubleClick={action(e => {
-                    this.toggleProperties();
-                    PresBox.Instance.regularSelect(this.rootDoc, this._itemRef.current!, this._dragRef.current!, true);
-                })}
-                onPointerOver={this.onPointerOver}
-                onPointerLeave={this.onPointerLeave}
-                onPointerDown={this.headerDown}
-                onPointerUp={this.headerUp}
-            >
-                {miniView ?
-                    // when width is LESS than 110 px 
-                    <div className={`presItem-miniSlide ${isSelected ? "active" : ""}`} ref={miniView ? this._dragRef : null}>
-                        {`${this.indexInPres + 1}.`}
-                    </div>
-                    :
-                    // when width is MORE than 110 px 
-                    <div className="presItem-number">
-                        {`${this.indexInPres + 1}.`}
-                    </div>}
-                {miniView ? (null) : <div ref={miniView ? null : this._dragRef} className={`presItem-slide ${isSelected ? "active" : ""}`}
-                    style={{
-                        backgroundColor: this.props.styleProvider?.(this.layoutDoc, this.props, StyleProp.BackgroundColor),
-                        boxShadow: presBoxColor && presBoxColor !== "white" && presBoxColor !== "transparent" ? isSelected ? "0 0 0px 1.5px" + presBoxColor : undefined : undefined
-                    }}>
-                    <div className="presItem-name" style={{ maxWidth: showMore ? (toolbarWidth - 195) : toolbarWidth - 105, cursor: isSelected ? 'text' : 'grab' }}>
-                        <EditableView
-                            ref={this._titleRef}
-                            editing={!isSelected ? false : undefined}
-                            contents={activeItem.title}
-                            overflow={'ellipsis'}
-                            GetValue={() => StrCast(activeItem.title)}
-                            SetValue={this.onSetValue}
-                        />
-                    </div>
-                    <Tooltip title={<><div className="dash-tooltip">{"Movement speed"}</div></>}><div className="presItem-time" style={{ display: showMore ? "block" : "none" }}>{this.transition}</div></Tooltip>
-                    <Tooltip title={<><div className="dash-tooltip">{"Duration"}</div></>}><div className="presItem-time" style={{ display: showMore ? "block" : "none" }}>{this.duration}</div></Tooltip>
-                    <div className={"presItem-slideButtons"}>
-                        <Tooltip title={<><div className="dash-tooltip">{"Update view"}</div></>}>
-                            <div className="slideButton"
-                                onClick={() => this.updateView(targetDoc, activeItem)}
-                                style={{ fontWeight: 700, display: activeItem.presPinView ? "flex" : "none" }}>V</div>
-                        </Tooltip>
-                        {this.indexInPres === 0 ? (null) : <Tooltip title={<><div className="dash-tooltip">{activeItem.groupWithUp ? "Ungroup" : "Group with up"}</div></>}>
-                            <div className="slideButton"
-                                onClick={() => activeItem.groupWithUp = !activeItem.groupWithUp}
-                                style={{
-                                    zIndex: 1000 - this.indexInPres,
-                                    fontWeight: 700,
-                                    backgroundColor: activeItem.groupWithUp ? presColorBool ? presBoxColor : PresColor.DarkBlue : undefined,
-                                    height: activeItem.groupWithUp ? 53 : 18,
-                                    transform: activeItem.groupWithUp ? "translate(0, -17px)" : undefined
-                                }}>
-                                <div style={{ transform: activeItem.groupWithUp ? "rotate(180deg) translate(0, -17.5px)" : "rotate(0deg)" }}>
-                                    <FontAwesomeIcon icon={"arrow-up"} onPointerDown={e => e.stopPropagation()} />
-                                </div>
-                            </div>
-                        </Tooltip>}
-                        <Tooltip title={<><div className="dash-tooltip">{this.rootDoc.presExpandInlineButton ? "Minimize" : "Expand"}</div></>}><div className={"slideButton"} onClick={e => { e.stopPropagation(); this.presExpandDocumentClick(); }}>
-                            <FontAwesomeIcon icon={this.rootDoc.presExpandInlineButton ? "eye-slash" : "eye"} onPointerDown={e => e.stopPropagation()} />
-                        </div></Tooltip>
-                        <Tooltip title={<><div className="dash-tooltip">{"Remove from presentation"}</div></>}><div
-                            className={"slideButton"}
-                            onClick={this.removeItem}>
-                            <FontAwesomeIcon icon={"trash"} onPointerDown={e => e.stopPropagation()} />
-                        </div></Tooltip>
-                    </div>
-                    <div className="presItem-docName" style={{ maxWidth: showMore ? (toolbarWidth - 195) : toolbarWidth - 105 }}>{activeItem.presPinView ? (<><i>View of </i> {targetDoc.title}</>) : targetDoc.title}</div>
-                    {this.renderEmbeddedInline}
-                </div>}
-            </div >);
-    }
-
-    render() {
-        return !(this.rootDoc instanceof Doc) || this.targetDoc instanceof Promise ? (null) : this.mainItem;
-    }
-}
\ No newline at end of file
diff --git a/src/client/views/topbar/TopBar.scss b/src/client/views/topbar/TopBar.scss
index 324b96dbd..e2d27d5a6 100644
--- a/src/client/views/topbar/TopBar.scss
+++ b/src/client/views/topbar/TopBar.scss
@@ -30,7 +30,7 @@
                 display: flex;
 
                 .topbar-dashboards {
-                    display: none;
+                    display: inline-flex;
                 }
 
                 .topbar-dashSelect {
@@ -46,12 +46,6 @@
                     }
                 }
             }
-
-            .topbar-lozenge-dashboard:hover {
-                .topbar-dashboards {
-                    display: inline-flex;
-                }
-            }
         }
 
         .topBar-icon {
@@ -85,7 +79,7 @@
             .topbar-lozenge {
                 height: 23;
                 font-size: 12;
-                color: black;
+                color: white;
                 font-family: 'Roboto';
                 font-weight: 400;
                 padding: 4px;
@@ -93,7 +87,7 @@
                 margin-right: 7px;
                 display: flex;
                 align-items: center;
-                border: black 1px solid;
+                border: white 1px solid;
 
                 .topbar-logoff {
                     border-radius: 3px;
diff --git a/src/client/views/topbar/TopBar.tsx b/src/client/views/topbar/TopBar.tsx
index 79239d4ea..65da717f8 100644
--- a/src/client/views/topbar/TopBar.tsx
+++ b/src/client/views/topbar/TopBar.tsx
@@ -1,58 +1,67 @@
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { observer } from "mobx-react";
 import * as React from 'react';
 import { Doc, DocListCast } from '../../../fields/Doc';
 import { Id } from '../../../fields/FieldSymbols';
 import { StrCast } from '../../../fields/Types';
 import { Utils } from '../../../Utils';
 import { CurrentUserUtils } from "../../util/CurrentUserUtils";
-import { ColorScheme, SettingsManager } from "../../util/SettingsManager";
+import { SettingsManager } from "../../util/SettingsManager";
 import { undoBatch } from "../../util/UndoManager";
+import { Borders, Colors } from "../global/globalEnums";
 import "./TopBar.scss";
-import { Colors, Borders } from "../global/globalEnums";
 
-export const TopBar = () => {
-
-    const myDashboards = DocListCast(CurrentUserUtils.MyDashboards.data);
-    return (
-        <div style={{ pointerEvents: "all" }} className="topbar-container">
-            <div className="topbar-bar" style={{ background: Doc.UserDoc().colorScheme === ColorScheme.Dark ? Colors.DARK_GRAY : Colors.LIGHT_GRAY, borderBottom: Borders.STANDARD }}>
-                <div className="topbar-center" >
-                    <div className="topbar-lozenge-dashboard">
-                        <select className="topbar-dashSelect" onChange={e => CurrentUserUtils.openDashboard(Doc.UserDoc(), myDashboards[Number(e.target.value)])}
-                            value={myDashboards.indexOf(CurrentUserUtils.ActiveDashboard)}
-                            style={{ color: Doc.UserDoc().colorScheme === ColorScheme.Dark ? "white" : "black" }}>
-                            {myDashboards.map((dash, i) => <option key={dash[Id]} value={i}> {StrCast(dash.title)} </option>)}
-                        </select>
-                        <div className="topbar-dashboards">
-                            <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.createNewDashboard(Doc.UserDoc()))}
-                                style={{ color: Doc.UserDoc().colorScheme === ColorScheme.Dark ? "white" : "black" }}>
-                                <FontAwesomeIcon icon="plus"></FontAwesomeIcon>
-                            </div>
-                            <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.snapshotDashboard(Doc.UserDoc()))}
-                                style={{ color: Doc.UserDoc().colorScheme === ColorScheme.Dark ? "white" : "black" }}>
-                                <FontAwesomeIcon icon="camera"></FontAwesomeIcon>
+/**
+ * REACT TYPE: FUNCTIONAL
+ * ABOUT: This is the topbar in Dash, which included the current Dashboard as well as access to information on the user
+ * and settings and help buttons. Future scope for this bar is to include the collaborators that are on the same Dashboard. 
+ */
+@observer
+export class TopBar extends React.Component {
+    render() {
+        const myDashboards = DocListCast(CurrentUserUtils.MyDashboards.data);
+        return (
+            //TODO:glr Add support for light / dark mode
+            <div style={{ pointerEvents: "all" }} className="topbar-container">
+                <div className="topbar-bar" style={{ background: Colors.DARK_GRAY, borderBottom: Borders.STANDARD }}>
+                    <div className="topbar-center" >
+                        <div className="topbar-lozenge-dashboard">
+                            <select className="topbar-dashSelect" onChange={e => CurrentUserUtils.openDashboard(Doc.UserDoc(), myDashboards[Number(e.target.value)])}
+                                value={myDashboards.indexOf(CurrentUserUtils.ActiveDashboard)}
+                                style={{ color: Colors.WHITE }}>
+                                {myDashboards.map((dash, i) => <option key={dash[Id]} value={i}> {StrCast(dash.title)} </option>)}
+                            </select>
+                            <div className="topbar-dashboards">
+                                <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.createNewDashboard(Doc.UserDoc()))}
+                                    style={{ color: Colors.WHITE }}>
+                                    <FontAwesomeIcon icon="plus"></FontAwesomeIcon>
+                                </div>
+                                <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.snapshotDashboard(Doc.UserDoc()))}
+                                    style={{ color: Colors.WHITE }}>
+                                    <FontAwesomeIcon icon="camera"></FontAwesomeIcon>
+                                </div>
                             </div>
                         </div>
                     </div>
-                </div>
-                <div className="topbar-right" >
-                    <div className="topbar-icon"
-                        style={{ color: Doc.UserDoc().colorScheme === ColorScheme.Dark ? "white" : "black" }}>
-                        <FontAwesomeIcon icon="question-circle"></FontAwesomeIcon>
-                    </div>
-                    <div className="topbar-icon" onClick={() => SettingsManager.Instance.open()}
-                        style={{ color: Doc.UserDoc().colorScheme === ColorScheme.Dark ? "white" : "black" }}>
-                        <FontAwesomeIcon icon="cog"></FontAwesomeIcon>
-                    </div>
-                    <div className="topbar-lozenge-user">
-                        {`${Doc.CurrentUserEmail}`}
-                        <div className="topbar-logoff" onClick={() => window.location.assign(Utils.prepend("/logout"))}>
-                            Logoff
+                    <div className="topbar-right" >
+                        <div className="topbar-icon"
+                            style={{ color: Colors.WHITE }}>
+                            <FontAwesomeIcon icon="question-circle"></FontAwesomeIcon>
+                        </div>
+                        <div className="topbar-icon" onClick={() => SettingsManager.Instance.open()}
+                            style={{ color: Colors.WHITE }}>
+                            <FontAwesomeIcon icon="cog"></FontAwesomeIcon>
+                        </div>
+                        <div className="topbar-lozenge-user">
+                            {`${Doc.CurrentUserEmail}`}
+                            <div className="topbar-logoff" onClick={() => window.location.assign(Utils.prepend("/logout"))}>
+                                Logoff
+                        </div>
                         </div>
                     </div>
-                </div>
 
+                </div >
             </div >
-        </div >
-    );
+        );
+    }
 }
\ No newline at end of file
diff --git a/tslint.json b/tslint.json
index 0056f4266..83255a798 100644
--- a/tslint.json
+++ b/tslint.json
@@ -1,6 +1,9 @@
 {
     "linterOptions": {
-        "exclude": ["./src/client/northstar/**", "**/*.js"]
+        "exclude": [
+            "./src/client/northstar/**",
+            "**/*.js"
+        ]
     },
     "rules": {
         "no-return-await": true,
@@ -23,41 +26,7 @@
         ],
         "no-tautology-expression": true,
         "unnecessary-constructor": true
-        // "trailing-comma": [
-        //     true,
-        //     {
-        //         "multiline": "always",
-        //         "singleline": "never"
-        //     }
-        // ],
-        // "ordered-imports": true
-        // "quotemark": [
-        //     true,
-        //     "double",
-        //     "jsx-double",
-        //     "avoid-template",
-        //     "avoid-escape"
-        // ],
-        // "object-literal-shorthand": true,
-        // "object-literal-sort-keys": true,
-        // "align": [
-        //     true,
-        //     "parameters",
-        //     "arguments",
-        //     "statements",
-        //     "members",
-        //     "elements"
-        // ],
-        // "no-void-expression": [
-        //     true,
-        //     "ignore-arrow-function-shorthand"
-        // ],
-        // "no-non-null-assertion": true,
-        // "no-var-keyword": true,
-        // "no-var-requires": true,
     },
     "defaultSeverity": "warning",
-    "jsRules": {
-
-    }
+    "jsRules": {}
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From 9bb19bd56a36ed7655fd057a1d0c2cc55543f4bb Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Fri, 30 Jul 2021 14:25:20 -0400
Subject: more updates

---
 .gitignore                               |  3 ++-
 src/client/views/topbar/TopBarButton.tsx | 10 ++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 src/client/views/topbar/TopBarButton.tsx

(limited to 'src')

diff --git a/.gitignore b/.gitignore
index 43b63a362..7a3c82ee6 100644
--- a/.gitignore
+++ b/.gitignore
@@ -17,4 +17,5 @@ src/server/session_manager/logs/**/*.log
 *.pfx
 *.properties
 debug.log
-.vscodeignore
\ No newline at end of file
+.vscodeignore
+Dockerfile
diff --git a/src/client/views/topbar/TopBarButton.tsx b/src/client/views/topbar/TopBarButton.tsx
new file mode 100644
index 000000000..0d3d2a8d1
--- /dev/null
+++ b/src/client/views/topbar/TopBarButton.tsx
@@ -0,0 +1,10 @@
+import React from "react";
+
+export interface IButtonProps {
+    icon?: JSX.Element;
+    text?: String;
+}
+
+export class TopBarButton implements IButtonProps {
+
+}
-- 
cgit v1.2.3-70-g09d2


From b44c8e15662b26a1f848fd241a4e13ef4312c877 Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Sat, 31 Jul 2021 00:08:14 -0400
Subject: more updates

---
 src/client/views/DocumentButtonBar.tsx          |  7 ++++---
 src/client/views/nodes/DocumentLinksButton.scss |  9 ++++-----
 src/client/views/nodes/DocumentLinksButton.tsx  | 19 ++++++++++++++-----
 3 files changed, 22 insertions(+), 13 deletions(-)

(limited to 'src')

diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx
index b11aa99b0..1e5380971 100644
--- a/src/client/views/DocumentButtonBar.tsx
+++ b/src/client/views/DocumentButtonBar.tsx
@@ -3,7 +3,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { Tooltip } from '@material-ui/core';
 import { action, computed, observable, runInAction } from "mobx";
 import { observer } from "mobx-react";
-import { Doc } from "../../fields/Doc";
+import { Doc, DocCastAsync } from "../../fields/Doc";
 import { RichTextField } from '../../fields/RichTextField';
 import { Cast, NumCast, StrCast } from "../../fields/Types";
 import { emptyFunction, setupMoveUpEvents, simulateMouseClick } from "../../Utils";
@@ -348,16 +348,17 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
         if (!this.view0) return (null);
 
         const isText = this.view0.props.Document[this.view0.LayoutFieldKey] instanceof RichTextField;
+        const doc = this.view0?.props.Document;
         const considerPull = isText && this.considerGoogleDocsPull;
         const considerPush = isText && this.considerGoogleDocsPush;
         return <div className="documentButtonBar">
             <div className="documentButtonBar-button">
                 <DocumentLinksButton View={this.view0} AlwaysOn={true} InMenu={true} StartLink={true} />
             </div>
-            {DocumentLinksButton.StartLink || !Doc.UserDoc()["documentLinksButton-fullMenu"] ? <div className="documentButtonBar-button">
+            {(DocumentLinksButton.StartLink || Doc.UserDoc()["documentLinksButton-fullMenu"]) && DocumentLinksButton.StartLink != doc ? <div className="documentButtonBar-button">
                 <DocumentLinksButton View={this.view0} AlwaysOn={true} InMenu={true} StartLink={false} />
             </div> : (null)}
-            {!Doc.UserDoc()["documentLinksButton-fullMenu"] ? (null) : <div className="documentButtonBar-button">
+            {/*!Doc.UserDoc()["documentLinksButton-fullMenu"] ? (null) : <div className="documentButtonBar-button">
                 {this.templateButton}
             </div>
             /*<div className="documentButtonBar-button">
diff --git a/src/client/views/nodes/DocumentLinksButton.scss b/src/client/views/nodes/DocumentLinksButton.scss
index daffaf9e7..1fc71b5f8 100644
--- a/src/client/views/nodes/DocumentLinksButton.scss
+++ b/src/client/views/nodes/DocumentLinksButton.scss
@@ -44,16 +44,15 @@
 }
 
 .documentLinksButton-endLink {
-    border: red solid 2px;
-
+    border: $medium-blue 2px dashed;
+    color: $medium-blue;
     &:hover {
-        background: deepskyblue;
+        background: $light-gray;
         transform: scale(1.05);
         cursor: pointer;
     }
 }
 
 .documentLinksButton-startLink {
-    border: red solid 2px;
-    background-color: rgba(255, 192, 203, 0.5);
+    background-color: $medium-blue;
 }
\ No newline at end of file
diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx
index a6d07374a..e3cbade38 100644
--- a/src/client/views/nodes/DocumentLinksButton.tsx
+++ b/src/client/views/nodes/DocumentLinksButton.tsx
@@ -20,6 +20,7 @@ import './DocumentLinksButton.scss';
 import { DocServer } from "../../DocServer";
 import { LightboxView } from "../LightboxView";
 import { cat } from "shelljs";
+import { Colors } from "../global/globalEnums";
 
 const higflyout = require("@hig/flyout");
 export const { anchorPoints } = higflyout;
@@ -252,8 +253,8 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
             <div className={"documentLinksButton"}
                 onPointerDown={this.onLinkButtonDown} onClick={this.onLinkClick}
                 style={{
-                    backgroundColor: this.props.InMenu ? "" : "#add8e6",
-                    color: this.props.InMenu ? "white" : "black",
+                    backgroundColor: this.props.InMenu ? "" : Colors.LIGHT_BLUE,
+                    color: this.props.InMenu ? Colors.WHITE : "black",
                     width: btnDim,
                     height: btnDim,
                 }} >
@@ -267,17 +268,25 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
                 <div className={"documentLinksButton-endLink"}
                     style={{
                         width: btnDim, height: btnDim,
-                        backgroundColor: DocumentLinksButton.StartLink ? "" : "grey",
+                        backgroundColor: DocumentLinksButton.StartLink ? "" : Colors.LIGHT_GRAY,
                         opacity: DocumentLinksButton.StartLink ? "" : "50%",
                         border: DocumentLinksButton.StartLink ? "" : "none",
                         cursor: DocumentLinksButton.StartLink ? "pointer" : "default"
                     }}
                     onPointerDown={DocumentLinksButton.StartLink && this.completeLink}
-                    onClick={e => DocumentLinksButton.StartLink && DocumentLinksButton.finishLinkClick(e.clientX, e.clientY, DocumentLinksButton.StartLink, this.props.View.props.Document, true, this.props.View)} />
+                    onClick={e => DocumentLinksButton.StartLink && DocumentLinksButton.finishLinkClick(e.clientX, e.clientY, DocumentLinksButton.StartLink, this.props.View.props.Document, true, this.props.View)}>
+                    {this.props.StartLink ?
+                        <FontAwesomeIcon className="documentdecorations-icon" icon="link" size="sm" />
+                        : link}
+                </div>
                 : (null)
             }
             {DocumentLinksButton.StartLink === this.props.View.props.Document && this.props.InMenu && this.props.StartLink ?
-                <div className={"documentLinksButton-startLink"} onPointerDown={this.clearLinks} onClick={this.clearLinks} style={{ width: btnDim, height: btnDim }} />
+                <div className={"documentLinksButton-startLink"} onPointerDown={this.clearLinks} onClick={this.clearLinks} style={{ width: btnDim, height: btnDim }}>
+                    {this.props.StartLink ?
+                        <FontAwesomeIcon className="documentdecorations-icon" icon="link" size="sm" />
+                        : link}
+                </div>
                 : (null)
             }
         </div >;
-- 
cgit v1.2.3-70-g09d2


From 8bc755595dbe21cafb768efc3650b0b14d33f7df Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Sat, 31 Jul 2021 00:26:50 -0400
Subject: minor changes

---
 src/client/views/collections/CollectionLinearView.scss | 9 +++++----
 src/client/views/collections/CollectionLinearView.tsx  | 7 +++----
 2 files changed, 8 insertions(+), 8 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionLinearView.scss b/src/client/views/collections/CollectionLinearView.scss
index dd1e1fbe8..86610ac20 100644
--- a/src/client/views/collections/CollectionLinearView.scss
+++ b/src/client/views/collections/CollectionLinearView.scss
@@ -21,12 +21,12 @@
 
         .bottomPopup-background {
             background: $light-blue;
-            padding-right: 14px;
+            display: flex;
             height: 35;
             transform: translate3d(6px, 0px, 0px);
-            padding-top: 6.5px;
-            padding-bottom: 7px;
-            padding-left: 5px;
+            align-content: center;
+            justify-content: center;
+            align-items: center;
         }
 
         .bottomPopup-text {
@@ -54,6 +54,7 @@
         .bottomPopup-exit {
             display: inline;
             white-space: nowrap;
+            margin-right: 10px;
             padding-left: 8px;
             padding-right: 8px;
             vertical-align: middle;
diff --git a/src/client/views/collections/CollectionLinearView.tsx b/src/client/views/collections/CollectionLinearView.tsx
index 8d81471d0..52c836556 100644
--- a/src/client/views/collections/CollectionLinearView.tsx
+++ b/src/client/views/collections/CollectionLinearView.tsx
@@ -171,17 +171,16 @@ export class CollectionLinearView extends CollectionSubView(LinearDocument) {
                 }}
                     onPointerDown={e => e.stopPropagation()} >
                     <span className="bottomPopup-text" >
-                        Creating link from: {DocumentLinksButton.AnnotationId ? "Annotation in " : " "} {StrCast(DocumentLinksButton.StartLink.title).length < 51 ? DocumentLinksButton.StartLink.title : StrCast(DocumentLinksButton.StartLink.title).slice(0, 50) + '...'}
+                        Creating link from: <b>{DocumentLinksButton.AnnotationId ? "Annotation in " : " "} {StrCast(DocumentLinksButton.StartLink.title).length < 51 ? DocumentLinksButton.StartLink.title : StrCast(DocumentLinksButton.StartLink.title).slice(0, 50) + '...'}</b>
                     </span>
 
-                    <Tooltip title={<><div className="dash-tooltip">{LinkDescriptionPopup.showDescriptions ? "Turn off description pop-up" :
-                        "Turn on description pop-up"} </div></>} placement="top">
+                    <Tooltip title={<><div className="dash-tooltip">{"Toggle description pop-up"} </div></>} placement="top">
                         <span className="bottomPopup-descriptions" onClick={this.changeDescriptionSetting}>
                             Labels: {LinkDescriptionPopup.showDescriptions ? LinkDescriptionPopup.showDescriptions : "ON"}
                         </span>
                     </Tooltip>
 
-                    <Tooltip title={<><div className="dash-tooltip">Exit link clicking mode </div></>} placement="top">
+                    <Tooltip title={<><div className="dash-tooltip">Exit linking mode</div></>} placement="top">
                         <span className="bottomPopup-exit" onClick={this.exitLongLinks}>
                             Stop
                         </span>
-- 
cgit v1.2.3-70-g09d2


From e1707fb76a991d04797a8d97ca34c55db71899cd Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Sat, 31 Jul 2021 05:38:08 -0400
Subject: tab scrollable

---
 src/client/goldenLayout.js               | 3063 +++++++++++++++---------------
 src/client/views/MainView.scss           |    4 +-
 src/client/views/topbar/TopBar.scss      |   52 +-
 src/client/views/topbar/TopBar.tsx       |   22 +-
 src/client/views/topbar/TopBarButton.tsx |   10 -
 5 files changed, 1572 insertions(+), 1579 deletions(-)
 delete mode 100644 src/client/views/topbar/TopBarButton.tsx

(limited to 'src')

diff --git a/src/client/goldenLayout.js b/src/client/goldenLayout.js
index 9cfea7f3f..b118a5f44 100644
--- a/src/client/goldenLayout.js
+++ b/src/client/goldenLayout.js
@@ -82,16 +82,16 @@
         return target;
     };
 
-	/**
-	 * This is based on Paul Irish's shim, but looks quite odd in comparison. Why?
-	 * Because
-	 * a) it shouldn't affect the global requestAnimationFrame function
-	 * b) it shouldn't pass on the time that has passed
-	 *
-	 * @param   {Function} fn
-	 *
-	 * @returns {void}
-	 */
+    /**
+     * This is based on Paul Irish's shim, but looks quite odd in comparison. Why?
+     * Because
+     * a) it shouldn't affect the global requestAnimationFrame function
+     * b) it shouldn't pass on the time that has passed
+     *
+     * @param   {Function} fn
+     *
+     * @returns {void}
+     */
     lm.utils.animFrame = function (fn) {
         return (window.requestAnimationFrame ||
             window.webkitRequestAnimationFrame ||
@@ -178,16 +178,16 @@
             .replace('.', '');
     };
 
-	/**
-	 * A basic XSS filter. It is ultimately up to the
-	 * implementing developer to make sure their particular
-	 * applications and usecases are save from cross site scripting attacks
-	 *
-	 * @param   {String} input
-	 * @param    {Boolean} keepTags
-	 *
-	 * @returns {String} filtered input
-	 */
+    /**
+     * A basic XSS filter. It is ultimately up to the
+     * implementing developer to make sure their particular
+     * applications and usecases are save from cross site scripting attacks
+     *
+     * @param   {String} input
+     * @param    {Boolean} keepTags
+     *
+     * @returns {String} filtered input
+     */
     lm.utils.filterXss = function (input, keepTags) {
 
         var output = input
@@ -206,41 +206,41 @@
         }
     };
 
-	/**
-	 * Removes html tags from a string
-	 *
-	 * @param   {String} input
-	 *
-	 * @returns {String} input without tags
-	 */
+    /**
+     * Removes html tags from a string
+     *
+     * @param   {String} input
+     *
+     * @returns {String} input without tags
+     */
     lm.utils.stripTags = function (input) {
         return $.trim(input.replace(/(<([^>]+)>)/ig, ''));
     };
-	/**
-	 * A generic and very fast EventEmitter
-	 * implementation. On top of emitting the
-	 * actual event it emits an
-	 *
-	 * lm.utils.EventEmitter.ALL_EVENT
-	 *
-	 * event for every event triggered. This allows
-	 * to hook into it and proxy events forwards
-	 *
-	 * @constructor
-	 */
+    /**
+     * A generic and very fast EventEmitter
+     * implementation. On top of emitting the
+     * actual event it emits an
+     *
+     * lm.utils.EventEmitter.ALL_EVENT
+     *
+     * event for every event triggered. This allows
+     * to hook into it and proxy events forwards
+     *
+     * @constructor
+     */
     lm.utils.EventEmitter = function () {
         this._mSubscriptions = {};
         this._mSubscriptions[lm.utils.EventEmitter.ALL_EVENT] = [];
 
-		/**
-		 * Listen for events
-		 *
-		 * @param   {String} sEvent    The name of the event to listen to
-		 * @param   {Function} fCallback The callback to execute when the event occurs
-		 * @param   {[Object]} oContext The value of the this pointer within the callback function
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Listen for events
+         *
+         * @param   {String} sEvent    The name of the event to listen to
+         * @param   {Function} fCallback The callback to execute when the event occurs
+         * @param   {[Object]} oContext The value of the this pointer within the callback function
+         *
+         * @returns {void}
+         */
         this.on = function (sEvent, fCallback, oContext) {
             if (!lm.utils.isFunction(fCallback)) {
                 throw new Error('Tried to listen to event ' + sEvent + ' with non-function callback ' + fCallback);
@@ -253,14 +253,14 @@
             this._mSubscriptions[sEvent].push({ fn: fCallback, ctx: oContext });
         };
 
-		/**
-		 * Emit an event and notify listeners
-		 *
-		 * @param   {String} sEvent The name of the event
-		 * @param    {Mixed}  various additional arguments that will be passed to the listener
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Emit an event and notify listeners
+         *
+         * @param   {String} sEvent The name of the event
+         * @param    {Mixed}  various additional arguments that will be passed to the listener
+         *
+         * @returns {void}
+         */
         this.emit = function (sEvent) {
             var i, ctx, args;
 
@@ -286,15 +286,15 @@
             }
         };
 
-		/**
-		 * Removes a listener for an event, or all listeners if no callback and context is provided.
-		 *
-		 * @param   {String} sEvent    The name of the event
-		 * @param   {Function} fCallback The previously registered callback method (optional)
-		 * @param   {Object} oContext  The previously registered context (optional)
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Removes a listener for an event, or all listeners if no callback and context is provided.
+         *
+         * @param   {String} sEvent    The name of the event
+         * @param   {Function} fCallback The previously registered callback method (optional)
+         * @param   {Object} oContext  The previously registered context (optional)
+         *
+         * @returns {void}
+         */
         this.unbind = function (sEvent, fCallback, oContext) {
             if (!this._mSubscriptions[sEvent]) {
                 throw new Error('No subscribtions to unsubscribe for event ' + sEvent);
@@ -318,28 +318,28 @@
             }
         };
 
-		/**
-		 * Alias for unbind
-		 */
+        /**
+         * Alias for unbind
+         */
         this.off = this.unbind;
 
-		/**
-		 * Alias for emit
-		 */
+        /**
+         * Alias for emit
+         */
         this.trigger = this.emit;
     };
 
-	/**
-	 * The name of the event that's triggered for every other event
-	 *
-	 * usage
-	 *
-	 * myEmitter.on( lm.utils.EventEmitter.ALL_EVENT, function( eventName, argsArray ){
-	 * 	//do stuff
-	 * });
-	 *
-	 * @type {String}
-	 */
+    /**
+     * The name of the event that's triggered for every other event
+     *
+     * usage
+     *
+     * myEmitter.on( lm.utils.EventEmitter.ALL_EVENT, function( eventName, argsArray ){
+     * 	//do stuff
+     * });
+     *
+     * @type {String}
+     */
     lm.utils.EventEmitter.ALL_EVENT = '__all';
     lm.utils.DragListener = function (eElement, nButtonCode) {
         lm.utils.EventEmitter.call(this);
@@ -349,14 +349,14 @@
         this._eBody = $(document.body);
         this._nButtonCode = nButtonCode || 0;
 
-		/**
-		 * The delay after which to start the drag in milliseconds
-		 */
+        /**
+         * The delay after which to start the drag in milliseconds
+         */
         this._nDelay = 200;
 
-		/**
-		 * The distance the mouse needs to be moved to qualify as a drag
-		 */
+        /**
+         * The distance the mouse needs to be moved to qualify as a drag
+         */
         this._nDistance = 10;//TODO - works better with delay only
 
         this._nX = 0;
@@ -459,16 +459,16 @@
             };
         }
     });
-	/**
-	 * The main class that will be exposed as GoldenLayout.
-	 *
-	 * @public
-	 * @constructor
-	 * @param {GoldenLayout config} config
-	 * @param {[DOM element container]} container Can be a jQuery selector string or a Dom element. Defaults to body
-	 *
-	 * @returns {VOID}
-	 */
+    /**
+     * The main class that will be exposed as GoldenLayout.
+     *
+     * @public
+     * @constructor
+     * @param {GoldenLayout config} config
+     * @param {[DOM element container]} container Can be a jQuery selector string or a Dom element. Defaults to body
+     *
+     * @returns {VOID}
+     */
     lm.LayoutManager = function (config, container) {
 
         if (!$ || typeof $.noConflict !== 'function') {
@@ -521,59 +521,59 @@
         };
     };
 
-	/**
-	 * Hook that allows to access private classes
-	 */
+    /**
+     * Hook that allows to access private classes
+     */
     lm.LayoutManager.__lm = lm;
 
-	/**
-	 * Takes a GoldenLayout configuration object and
-	 * replaces its keys and values recursively with
-	 * one letter codes
-	 *
-	 * @static
-	 * @public
-	 * @param   {Object} config A GoldenLayout config object
-	 *
-	 * @returns {Object} minified config
-	 */
+    /**
+     * Takes a GoldenLayout configuration object and
+     * replaces its keys and values recursively with
+     * one letter codes
+     *
+     * @static
+     * @public
+     * @param   {Object} config A GoldenLayout config object
+     *
+     * @returns {Object} minified config
+     */
     lm.LayoutManager.minifyConfig = function (config) {
         return (new lm.utils.ConfigMinifier()).minifyConfig(config);
     };
 
-	/**
-	 * Takes a configuration Object that was previously minified
-	 * using minifyConfig and returns its original version
-	 *
-	 * @static
-	 * @public
-	 * @param   {Object} minifiedConfig
-	 *
-	 * @returns {Object} the original configuration
-	 */
+    /**
+     * Takes a configuration Object that was previously minified
+     * using minifyConfig and returns its original version
+     *
+     * @static
+     * @public
+     * @param   {Object} minifiedConfig
+     *
+     * @returns {Object} the original configuration
+     */
     lm.LayoutManager.unminifyConfig = function (config) {
         return (new lm.utils.ConfigMinifier()).unminifyConfig(config);
     };
 
     lm.utils.copy(lm.LayoutManager.prototype, {
 
-		/**
-		 * Register a component with the layout manager. If a configuration node
-		 * of type component is reached it will look up componentName and create the
-		 * associated component
-		 *
-		 *  {
-		 *		type: "component",
-		 *		componentName: "EquityNewsFeed",
-		 *		componentState: { "feedTopic": "us-bluechips" }
-		 *  }
-		 *
-		 * @public
-		 * @param   {String} name
-		 * @param   {Function} constructor
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Register a component with the layout manager. If a configuration node
+         * of type component is reached it will look up componentName and create the
+         * associated component
+         *
+         *  {
+         *		type: "component",
+         *		componentName: "EquityNewsFeed",
+         *		componentState: { "feedTopic": "us-bluechips" }
+         *  }
+         *
+         * @public
+         * @param   {String} name
+         * @param   {Function} constructor
+         *
+         * @returns {void}
+         */
         registerComponent: function (name, constructor) {
             if (typeof constructor !== 'function') {
                 throw new Error('Please register a constructor function');
@@ -586,12 +586,12 @@
             this._components[name] = constructor;
         },
 
-		/**
-		 * Creates a layout configuration object based on the the current state
-		 *
-		 * @public
-		 * @returns {Object} GoldenLayout configuration
-		 */
+        /**
+         * Creates a layout configuration object based on the the current state
+         *
+         * @public
+         * @returns {Object} GoldenLayout configuration
+         */
         toConfig: function (root) {
             var config, next, i;
 
@@ -603,18 +603,18 @@
                 throw new Error('Root must be a ContentItem');
             }
 
-			/*
-			 * settings & labels
-			 */
+            /*
+             * settings & labels
+             */
             config = {
                 settings: lm.utils.copy({}, this.config.settings),
                 dimensions: lm.utils.copy({}, this.config.dimensions),
                 labels: lm.utils.copy({}, this.config.labels)
             };
 
-			/*
-			 * Content
-			 */
+            /*
+             * Content
+             */
             config.content = [];
             next = function (configNode, item) {
                 var key, i;
@@ -641,30 +641,30 @@
                 next(config, this.root);
             }
 
-			/*
-			 * Retrieve config for subwindows
-			 */
+            /*
+             * Retrieve config for subwindows
+             */
             this._$reconcilePopoutWindows();
             config.openPopouts = [];
             for (i = 0; i < this.openPopouts.length; i++) {
                 config.openPopouts.push(this.openPopouts[i].toConfig());
             }
 
-			/*
-			 * Add maximised item
-			 */
+            /*
+             * Add maximised item
+             */
             config.maximisedItemId = this._maximisedItem ? '__glMaximised' : null;
             return config;
         },
 
-		/**
-		 * Returns a previously registered component
-		 *
-		 * @public
-		 * @param   {String} name The name used
-		 *
-		 * @returns {Function}
-		 */
+        /**
+         * Returns a previously registered component
+         *
+         * @public
+         * @param   {String} name The name used
+         *
+         * @returns {Function}
+         */
         getComponent: function (name) {
             if (this._components[name] === undefined) {
                 throw new lm.errors.ConfigurationError('Unknown component "' + name + '"');
@@ -673,44 +673,44 @@
             return this._components[name];
         },
 
-		/**
-		 * Creates the actual layout. Must be called after all initial components
-		 * are registered. Recurses through the configuration and sets up
-		 * the item tree.
-		 *
-		 * If called before the document is ready it adds itself as a listener
-		 * to the document.ready event
-		 *
-		 * @public
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Creates the actual layout. Must be called after all initial components
+         * are registered. Recurses through the configuration and sets up
+         * the item tree.
+         *
+         * If called before the document is ready it adds itself as a listener
+         * to the document.ready event
+         *
+         * @public
+         *
+         * @returns {void}
+         */
         init: function () {
 
-			/**
-			 * Create the popout windows straight away. If popouts are blocked
-			 * an error is thrown on the same 'thread' rather than a timeout and can
-			 * be caught. This also prevents any further initilisation from taking place.
-			 */
+            /**
+             * Create the popout windows straight away. If popouts are blocked
+             * an error is thrown on the same 'thread' rather than a timeout and can
+             * be caught. This also prevents any further initilisation from taking place.
+             */
             if (this._subWindowsCreated === false) {
                 this._createSubWindows();
                 this._subWindowsCreated = true;
             }
 
 
-			/**
-			 * If the document isn't ready yet, wait for it.
-			 */
+            /**
+             * If the document isn't ready yet, wait for it.
+             */
             if (document.readyState === 'loading' || document.body === null) {
                 $(document).ready(lm.utils.fnBind(this.init, this));
                 return;
             }
 
-			/**
-			 * If this is a subwindow, wait a few milliseconds for the original
-			 * page's js calls to be executed, then replace the bodies content
-			 * with GoldenLayout
-			 */
+            /**
+             * If this is a subwindow, wait a few milliseconds for the original
+             * page's js calls to be executed, then replace the bodies content
+             * with GoldenLayout
+             */
             if (this.isSubWindow === true && this._creationTimeoutPassed === false) {
                 setTimeout(lm.utils.fnBind(this.init, this), 7);
                 this._creationTimeoutPassed = true;
@@ -732,15 +732,15 @@
             this.emit('initialised');
         },
 
-		/**
-		 * Updates the layout managers size
-		 *
-		 * @public
-		 * @param   {[int]} width  height in pixels
-		 * @param   {[int]} height width in pixels
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Updates the layout managers size
+         *
+         * @public
+         * @param   {[int]} width  height in pixels
+         * @param   {[int]} height width in pixels
+         *
+         * @returns {void}
+         */
         updateSize: function (width, height) {
             if (arguments.length === 2) {
                 this.width = width;
@@ -763,13 +763,13 @@
             }
         },
 
-		/**
-		 * Destroys the LayoutManager instance itself as well as every ContentItem
-		 * within it. After this is called nothing should be left of the LayoutManager.
-		 *
-		 * @public
-		 * @returns {void}
-		 */
+        /**
+         * Destroys the LayoutManager instance itself as well as every ContentItem
+         * within it. After this is called nothing should be left of the LayoutManager.
+         *
+         * @public
+         * @returns {void}
+         */
         destroy: function () {
             if (this.isInitialised === false) {
                 return;
@@ -793,16 +793,16 @@
             this._dragSources = [];
         },
 
-		/**
-		 * Recursively creates new item tree structures based on a provided
-		 * ItemConfiguration object
-		 *
-		 * @public
-		 * @param   {Object} config ItemConfig
-		 * @param   {[ContentItem]} parent The item the newly created item should be a child of
-		 *
-		 * @returns {lm.items.ContentItem}
-		 */
+        /**
+         * Recursively creates new item tree structures based on a provided
+         * ItemConfiguration object
+         *
+         * @public
+         * @param   {Object} config ItemConfig
+         * @param   {[ContentItem]} parent The item the newly created item should be a child of
+         *
+         * @returns {lm.items.ContentItem}
+         */
         createContentItem: function (config, parent) {
             var typeErrorMsg, contentItem;
 
@@ -823,9 +823,9 @@
             }
 
 
-			/**
-			 * We add an additional stack around every component that's not within a stack anyways.
-			 */
+            /**
+             * We add an additional stack around every component that's not within a stack anyways.
+             */
             if (
                 // If this is a component
                 config.type === 'component' &&
@@ -851,17 +851,17 @@
             return contentItem;
         },
 
-		/**
-		 * Creates a popout window with the specified content and dimensions
-		 *
-		 * @param   {Object|lm.itemsAbstractContentItem} configOrContentItem
-		 * @param   {[Object]} dimensions A map with width, height, left and top
-		 * @param    {[String]} parentId the id of the element this item will be appended to
-		 *                             when popIn is called
-		 * @param    {[Number]} indexInParent The position of this item within its parent element
+        /**
+         * Creates a popout window with the specified content and dimensions
+         *
+         * @param   {Object|lm.itemsAbstractContentItem} configOrContentItem
+         * @param   {[Object]} dimensions A map with width, height, left and top
+         * @param    {[String]} parentId the id of the element this item will be appended to
+         *                             when popIn is called
+         * @param    {[Number]} indexInParent The position of this item within its parent element
 	
-		 * @returns {lm.controls.BrowserPopout}
-		 */
+         * @returns {lm.controls.BrowserPopout}
+         */
         createPopout: function (configOrContentItem, dimensions, parentId, indexInParent) {
             var config = configOrContentItem,
                 isItem = configOrContentItem instanceof lm.items.AbstractContentItem,
@@ -879,14 +879,14 @@
                 config = this.toConfig(configOrContentItem).content;
                 parentId = lm.utils.getUniqueId();
 
-				/**
-				 * If the item is the only component within a stack or for some
-				 * other reason the only child of its parent the parent will be destroyed
-				 * when the child is removed.
-				 *
-				 * In order to support this we move up the tree until we find something
-				 * that will remain after the item is being popped out
-				 */
+                /**
+                 * If the item is the only component within a stack or for some
+                 * other reason the only child of its parent the parent will be destroyed
+                 * when the child is removed.
+                 *
+                 * In order to support this we move up the tree until we find something
+                 * that will remain after the item is being popped out
+                 */
                 parent = configOrContentItem.parent;
                 child = configOrContentItem;
                 while (parent.contentItems.length === 1 && !parent.isRoot) {
@@ -946,16 +946,16 @@
             return browserPopout;
         },
 
-		/**
-		 * Attaches DragListener to any given DOM element
-		 * and turns it into a way of creating new ContentItems
-		 * by 'dragging' the DOM element into the layout
-		 *
-		 * @param   {jQuery DOM element} element
-		 * @param   {Object|Function} itemConfig for the new item to be created, or a function which will provide it
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Attaches DragListener to any given DOM element
+         * and turns it into a way of creating new ContentItems
+         * by 'dragging' the DOM element into the layout
+         *
+         * @param   {jQuery DOM element} element
+         * @param   {Object|Function} itemConfig for the new item to be created, or a function which will provide it
+         *
+         * @returns {void}
+         */
         createDragSource: function (element, itemConfig) {
             this.config.settings.constrainDragToContainer = false;
             var dragSource = new lm.controls.DragSource($(element), itemConfig, this);
@@ -964,17 +964,17 @@
             return dragSource;
         },
 
-		/**
-		 * Programmatically selects an item. This deselects
-		 * the currently selected item, selects the specified item
-		 * and emits a selectionChanged event
-		 *
-		 * @param   {lm.item.AbstractContentItem} item#
-		 * @param   {[Boolean]} _$silent Wheather to notify the item of its selection
-		 * @event    selectionChanged
-		 *
-		 * @returns {VOID}
-		 */
+        /**
+         * Programmatically selects an item. This deselects
+         * the currently selected item, selects the specified item
+         * and emits a selectionChanged event
+         *
+         * @param   {lm.item.AbstractContentItem} item#
+         * @param   {[Boolean]} _$silent Wheather to notify the item of its selection
+         * @event    selectionChanged
+         *
+         * @returns {VOID}
+         */
         selectItem: function (item, _$silent) {
 
             if (this.config.settings.selectionEnabled !== true) {
@@ -998,9 +998,9 @@
             this.emit('selectionChanged', item);
         },
 
-		/*************************
-		 * PACKAGE PRIVATE
-		 *************************/
+        /*************************
+         * PACKAGE PRIVATE
+         *************************/
         _$maximiseItem: function (contentItem) {
             if (this._maximisedItem !== null) {
                 this._$minimiseItem(this._maximisedItem);
@@ -1028,20 +1028,20 @@
             this.emit('stateChanged');
         },
 
-		/**
-		 * This method is used to get around sandboxed iframe restrictions.
-		 * If 'allow-top-navigation' is not specified in the iframe's 'sandbox' attribute
-		 * (as is the case with codepens) the parent window is forbidden from calling certain
-		 * methods on the child, such as window.close() or setting document.location.href.
-		 *
-		 * This prevented GoldenLayout popouts from popping in in codepens. The fix is to call
-		 * _$closeWindow on the child window's gl instance which (after a timeout to disconnect
-		 * the invoking method from the close call) closes itself.
-		 *
-		 * @packagePrivate
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * This method is used to get around sandboxed iframe restrictions.
+         * If 'allow-top-navigation' is not specified in the iframe's 'sandbox' attribute
+         * (as is the case with codepens) the parent window is forbidden from calling certain
+         * methods on the child, such as window.close() or setting document.location.href.
+         *
+         * This prevented GoldenLayout popouts from popping in in codepens. The fix is to call
+         * _$closeWindow on the child window's gl instance which (after a timeout to disconnect
+         * the invoking method from the close call) closes itself.
+         *
+         * @packagePrivate
+         *
+         * @returns {void}
+         */
         _$closeWindow: function () {
             window.setTimeout(function () {
                 window.close();
@@ -1088,13 +1088,13 @@
             var i, area, allContentItems = this._getAllContentItems();
             this._itemAreas = [];
 
-			/**
-			 * If the last item is dragged out, highlight the entire container size to
-			 * allow to re-drop it. allContentItems[ 0 ] === this.root at this point
-			 *
-			 * Don't include root into the possible drop areas though otherwise since it
-			 * will used for every gap in the layout, e.g. splitters
-			 */
+            /**
+             * If the last item is dragged out, highlight the entire container size to
+             * allow to re-drop it. allContentItems[ 0 ] === this.root at this point
+             *
+             * Don't include root into the possible drop areas though otherwise since it
+             * will used for every gap in the layout, e.g. splitters
+             */
             if (allContentItems.length === 1) {
                 this._itemAreas.push(this.root._$getArea());
                 return;
@@ -1124,18 +1124,18 @@
             }
         },
 
-		/**
-		 * Takes a contentItem or a configuration and optionally a parent
-		 * item and returns an initialised instance of the contentItem.
-		 * If the contentItem is a function, it is first called
-		 *
-		 * @packagePrivate
-		 *
-		 * @param   {lm.items.AbtractContentItem|Object|Function} contentItemOrConfig
-		 * @param   {lm.items.AbtractContentItem} parent Only necessary when passing in config
-		 *
-		 * @returns {lm.items.AbtractContentItem}
-		 */
+        /**
+         * Takes a contentItem or a configuration and optionally a parent
+         * item and returns an initialised instance of the contentItem.
+         * If the contentItem is a function, it is first called
+         *
+         * @packagePrivate
+         *
+         * @param   {lm.items.AbtractContentItem|Object|Function} contentItemOrConfig
+         * @param   {lm.items.AbtractContentItem} parent Only necessary when passing in config
+         *
+         * @returns {lm.items.AbtractContentItem}
+         */
         _$normalizeContentItem: function (contentItemOrConfig, parent) {
             if (!contentItemOrConfig) {
                 throw new Error('No content item defined');
@@ -1158,15 +1158,15 @@
             }
         },
 
-		/**
-		 * Iterates through the array of open popout windows and removes the ones
-		 * that are effectively closed. This is necessary due to the lack of reliably
-		 * listening for window.close / unload events in a cross browser compatible fashion.
-		 *
-		 * @packagePrivate
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Iterates through the array of open popout windows and removes the ones
+         * that are effectively closed. This is necessary due to the lack of reliably
+         * listening for window.close / unload events in a cross browser compatible fashion.
+         *
+         * @packagePrivate
+         *
+         * @returns {void}
+         */
         _$reconcilePopoutWindows: function () {
             var openPopouts = [], i;
 
@@ -1185,17 +1185,17 @@
 
         },
 
-		/***************************
-		 * PRIVATE
-		 ***************************/
-		/**
-		 * Returns a flattened array of all content items,
-		 * regardles of level or type
-		 *
-		 * @private
-		 *
-		 * @returns {void}
-		 */
+        /***************************
+         * PRIVATE
+         ***************************/
+        /**
+         * Returns a flattened array of all content items,
+         * regardles of level or type
+         *
+         * @private
+         *
+         * @returns {void}
+         */
         _getAllContentItems: function () {
             var allContentItems = [];
 
@@ -1214,13 +1214,13 @@
             return allContentItems;
         },
 
-		/**
-		 * Binds to DOM/BOM events on init
-		 *
-		 * @private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Binds to DOM/BOM events on init
+         *
+         * @private
+         *
+         * @returns {void}
+         */
         _bindEvents: function () {
             if (this._isFullPage) {
                 $(window).resize(this._resizeFunction);
@@ -1228,27 +1228,27 @@
             $(window).on('unload beforeunload', this._unloadFunction);
         },
 
-		/**
-		 * Debounces resize events
-		 *
-		 * @private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Debounces resize events
+         *
+         * @private
+         *
+         * @returns {void}
+         */
         _onResize: function () {
             clearTimeout(this._resizeTimeoutId);
             this._resizeTimeoutId = setTimeout(lm.utils.fnBind(this.updateSize, this), 100);
         },
 
-		/**
-		 * Extends the default config with the user specific settings and applies
-		 * derivations. Please note that there's a seperate method (AbstractContentItem._extendItemNode)
-		 * that deals with the extension of item configs
-		 *
-		 * @param   {Object} config
-		 * @static
-		 * @returns {Object} config
-		 */
+        /**
+         * Extends the default config with the user specific settings and applies
+         * derivations. Please note that there's a seperate method (AbstractContentItem._extendItemNode)
+         * that deals with the extension of item configs
+         *
+         * @param   {Object} config
+         * @static
+         * @returns {Object} config
+         */
         _createConfig: function (config) {
             var windowConfigKey = lm.utils.getQueryStringParam('gl-window');
 
@@ -1283,14 +1283,14 @@
             return config;
         },
 
-		/**
-		 * This is executed when GoldenLayout detects that it is run
-		 * within a previously opened popout window.
-		 *
-		 * @private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * This is executed when GoldenLayout detects that it is run
+         * within a previously opened popout window.
+         *
+         * @private
+         *
+         * @returns {void}
+         */
         _adjustToWindowMode: function () {
             var popInButton = $('<div class="lm_popin" title="' + this.config.labels.popin + '">' +
                 '<div class="lm_icon"></div>' +
@@ -1310,26 +1310,26 @@
                 .css('visibility', 'visible')
                 .append(popInButton);
 
-			/*
-			 * This seems a bit pointless, but actually causes a reflow/re-evaluation getting around
-			 * slickgrid's "Cannot find stylesheet." bug in chrome
-			 */
+            /*
+             * This seems a bit pointless, but actually causes a reflow/re-evaluation getting around
+             * slickgrid's "Cannot find stylesheet." bug in chrome
+             */
             var x = document.body.offsetHeight; // jshint ignore:line
 
-			/*
-			 * Expose this instance on the window object
-			 * to allow the opening window to interact with
-			 * it
-			 */
+            /*
+             * Expose this instance on the window object
+             * to allow the opening window to interact with
+             * it
+             */
             window.__glInstance = this;
         },
 
-		/**
-		 * Creates Subwindows (if there are any). Throws an error
-		 * if popouts are blocked.
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Creates Subwindows (if there are any). Throws an error
+         * if popouts are blocked.
+         *
+         * @returns {void}
+         */
         _createSubWindows: function () {
             var i, popout;
 
@@ -1345,13 +1345,13 @@
             }
         },
 
-		/**
-		 * Determines what element the layout will be created in
-		 *
-		 * @private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Determines what element the layout will be created in
+         *
+         * @private
+         *
+         * @returns {void}
+         */
         _setContainer: function () {
             var container = $(this.container || 'body');
 
@@ -1377,13 +1377,13 @@
             this.container = container;
         },
 
-		/**
-		 * Kicks of the initial, recursive creation chain
-		 *
-		 * @param   {Object} config GoldenLayout Config
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Kicks of the initial, recursive creation chain
+         *
+         * @param   {Object} config GoldenLayout Config
+         *
+         * @returns {void}
+         */
         _create: function (config) {
             var errorMsg;
 
@@ -1410,12 +1410,12 @@
             }
         },
 
-		/**
-		 * Called when the window is closed or the user navigates away
-		 * from the page
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Called when the window is closed or the user navigates away
+         * from the page
+         *
+         * @returns {void}
+         */
         _onUnload: function () {
             if (this.config.settings.closePopoutsOnUnload === true) {
                 for (var i = 0; i < this.openPopouts.length; i++) {
@@ -1424,11 +1424,11 @@
             }
         },
 
-		/**
-		 * Adjusts the number of columns to be lower to fit the screen and still maintain minItemWidth.
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Adjusts the number of columns to be lower to fit the screen and still maintain minItemWidth.
+         *
+         * @returns {void}
+         */
         _adjustColumnsResponsive: function () {
 
             // If there is no min width set, or not content items, do nothing.
@@ -1470,21 +1470,21 @@
             this._updatingColumnsResponsive = false;
         },
 
-		/**
-		 * Determines if responsive layout should be used.
-		 *
-		 * @returns {bool} - True if responsive layout should be used; otherwise false.
-		 */
+        /**
+         * Determines if responsive layout should be used.
+         *
+         * @returns {bool} - True if responsive layout should be used; otherwise false.
+         */
         _useResponsiveLayout: function () {
             return this.config.settings && (this.config.settings.responsiveMode == 'always' || (this.config.settings.responsiveMode == 'onload' && this._firstLoad));
         },
 
-		/**
-		 * Adds all children of a node to another container recursively.
-		 * @param {object} container - Container to add child content items to.
-		 * @param {object} node - Node to search for content items.
-		 * @returns {void}
-		 */
+        /**
+         * Adds all children of a node to another container recursively.
+         * @param {object} container - Container to add child content items to.
+         * @param {object} node - Node to search for content items.
+         * @returns {void}
+         */
         _addChildContentItemsToContainer: function (container, node) {
             if (node.type === 'stack') {
                 node.contentItems.forEach(function (item) {
@@ -1499,10 +1499,10 @@
             }
         },
 
-		/**
-		 * Finds all the stack containers.
-		 * @returns {array} - The found stack containers.
-		 */
+        /**
+         * Finds all the stack containers.
+         * @returns {array} - The found stack containers.
+         */
         _findAllStackContainers: function () {
             var stackContainers = [];
             this._findAllStackContainersRecursive(stackContainers, this.root);
@@ -1510,14 +1510,14 @@
             return stackContainers;
         },
 
-		/**
-		 * Finds all the stack containers.
-		 *
-		 * @param {array} - Set of containers to populate.
-		 * @param {object} - Current node to process.
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Finds all the stack containers.
+         *
+         * @param {array} - Set of containers to populate.
+         * @param {object} - Current node to process.
+         *
+         * @returns {void}
+         */
         _findAllStackContainersRecursive: function (stackContainers, node) {
             node.contentItems.forEach(lm.utils.fnBind(function (item) {
                 if (item.type == 'stack') {
@@ -1530,9 +1530,9 @@
         }
     });
 
-	/**
-	 * Expose the Layoutmanager as the single entrypoint using UMD
-	 */
+    /**
+     * Expose the Layoutmanager as the single entrypoint using UMD
+     */
     (function () {
         /* global define */
         if (typeof define === 'function' && define.amd) {
@@ -1567,7 +1567,7 @@
             showCloseIcon: true,
             responsiveMode: 'onload', // Can be onload, always, or none.
             tabOverlapAllowance: 0, // maximum pixel overlap per tab
-            reorderOnTabMenuClick: true,
+            reorderOnTabMenuClick: false, //do not reorder! - horizontal scroll
             tabControlOffset: 10
         },
         dimensions: {
@@ -1575,7 +1575,7 @@
             borderGrabWidth: 5,
             minItemHeight: 10,
             minItemWidth: 10,
-            headerHeight: 20,
+            headerHeight: 22,
             dragProxyWidth: 300,
             dragProxyHeight: 200
         },
@@ -1611,36 +1611,36 @@
 
     lm.utils.copy(lm.container.ItemContainer.prototype, {
 
-		/**
-		 * Get the inner DOM element the container's content
-		 * is intended to live in
-		 *
-		 * @returns {DOM element}
-		 */
+        /**
+         * Get the inner DOM element the container's content
+         * is intended to live in
+         *
+         * @returns {DOM element}
+         */
         getElement: function () {
             return this._contentElement;
         },
 
-		/**
-		 * Hide the container. Notifies the containers content first
-		 * and then hides the DOM node. If the container is already hidden
-		 * this should have no effect
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Hide the container. Notifies the containers content first
+         * and then hides the DOM node. If the container is already hidden
+         * this should have no effect
+         *
+         * @returns {void}
+         */
         hide: function () {
             this.emit('hide');
             this.isHidden = true;
             this._element.hide();
         },
 
-		/**
-		 * Shows a previously hidden container. Notifies the
-		 * containers content first and then shows the DOM element.
-		 * If the container is already visible this has no effect.
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Shows a previously hidden container. Notifies the
+         * containers content first and then shows the DOM element.
+         * If the container is already visible this has no effect.
+         *
+         * @returns {void}
+         */
         show: function () {
             this.emit('show');
             this.isHidden = false;
@@ -1651,19 +1651,19 @@
             }
         },
 
-		/**
-		 * Set the size from within the container. Traverses up
-		 * the item tree until it finds a row or column element
-		 * and resizes its items accordingly.
-		 *
-		 * If this container isn't a descendant of a row or column
-		 * it returns false
-		 * @todo  Rework!!!
-		 * @param {Number} width  The new width in pixel
-		 * @param {Number} height The new height in pixel
-		 *
-		 * @returns {Boolean} resizeSuccesful
-		 */
+        /**
+         * Set the size from within the container. Traverses up
+         * the item tree until it finds a row or column element
+         * and resizes its items accordingly.
+         *
+         * If this container isn't a descendant of a row or column
+         * it returns false
+         * @todo  Rework!!!
+         * @param {Number} width  The new width in pixel
+         * @param {Number} height The new height in pixel
+         *
+         * @returns {Boolean} resizeSuccesful
+         */
         setSize: function (width, height) {
             var rowOrColumn = this.parent,
                 rowOrColumnChild = this,
@@ -1679,9 +1679,9 @@
                 rowOrColumn = rowOrColumn.parent;
 
 
-				/**
-				 * No row or column has been found
-				 */
+                /**
+                 * No row or column has been found
+                 */
                 if (rowOrColumn.isRoot) {
                     return false;
                 }
@@ -1707,13 +1707,13 @@
             return true;
         },
 
-		/**
-		 * Closes the container if it is closable. Can be called by
-		 * both the component within at as well as the contentItem containing
-		 * it. Emits a close event before the container itself is closed.
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Closes the container if it is closable. Can be called by
+         * both the component within at as well as the contentItem containing
+         * it. Emits a close event before the container itself is closed.
+         *
+         * @returns {void}
+         */
         close: function () {
             if (this._config.isClosable) {
                 this.emit('close');
@@ -1721,55 +1721,55 @@
             }
         },
 
-		/**
-		 * Returns the current state object
-		 *
-		 * @returns {Object} state
-		 */
+        /**
+         * Returns the current state object
+         *
+         * @returns {Object} state
+         */
         getState: function () {
             return this._config.componentState;
         },
 
-		/**
-		 * Merges the provided state into the current one
-		 *
-		 * @param   {Object} state
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Merges the provided state into the current one
+         *
+         * @param   {Object} state
+         *
+         * @returns {void}
+         */
         extendState: function (state) {
             this.setState($.extend(true, this.getState(), state));
         },
 
-		/**
-		 * Notifies the layout manager of a stateupdate
-		 *
-		 * @param {serialisable} state
-		 */
+        /**
+         * Notifies the layout manager of a stateupdate
+         *
+         * @param {serialisable} state
+         */
         setState: function (state) {
             this._config.componentState = state;
             this.parent.emitBubblingEvent('stateChanged');
         },
 
-		/**
-		 * Set's the components title
-		 *
-		 * @param {String} title
-		 */
+        /**
+         * Set's the components title
+         *
+         * @param {String} title
+         */
         setTitle: function (title) {
             this.parent.setTitle(title);
         },
 
-		/**
-		 * Set's the containers size. Called by the container's component.
-		 * To set the size programmatically from within the container please
-		 * use the public setSize method
-		 *
-		 * @param {[Int]} width  in px
-		 * @param {[Int]} height in px
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Set's the containers size. Called by the container's component.
+         * To set the size programmatically from within the container please
+         * use the public setSize method
+         *
+         * @param {[Int]} width  in px
+         * @param {[Int]} height in px
+         *
+         * @returns {void}
+         */
         _$setSize: function (width, height) {
             if (width !== this.width || height !== this.height) {
                 this.width = width;
@@ -1784,22 +1784,22 @@
         }
     });
 
-	/**
-	 * Pops a content item out into a new browser window.
-	 * This is achieved by
-	 *
-	 *    - Creating a new configuration with the content item as root element
-	 *    - Serializing and minifying the configuration
-	 *    - Opening the current window's URL with the configuration as a GET parameter
-	 *    - GoldenLayout when opened in the new window will look for the GET parameter
-	 *      and use it instead of the provided configuration
-	 *
-	 * @param {Object} config GoldenLayout item config
-	 * @param {Object} dimensions A map with width, height, top and left
-	 * @param {String} parentId The id of the element the item will be appended to on popIn
-	 * @param {Number} indexInParent The position of this element within its parent
-	 * @param {lm.LayoutManager} layoutManager
-	 */
+    /**
+     * Pops a content item out into a new browser window.
+     * This is achieved by
+     *
+     *    - Creating a new configuration with the content item as root element
+     *    - Serializing and minifying the configuration
+     *    - Opening the current window's URL with the configuration as a GET parameter
+     *    - GoldenLayout when opened in the new window will look for the GET parameter
+     *      and use it instead of the provided configuration
+     *
+     * @param {Object} config GoldenLayout item config
+     * @param {Object} dimensions A map with width, height, top and left
+     * @param {String} parentId The id of the element the item will be appended to on popIn
+     * @param {Number} indexInParent The position of this element within its parent
+     * @param {lm.LayoutManager} layoutManager
+     */
     lm.controls.BrowserPopout = function (config, dimensions, parentId, indexInParent, layoutManager) {
         lm.utils.EventEmitter.call(this);
         this.isInitialised = false;
@@ -1853,10 +1853,10 @@
             }
         },
 
-		/**
-		 * Returns the popped out item to its original position. If the original
-		 * parent isn't available anymore it falls back to the layout's topmost element
-		 */
+        /**
+         * Returns the popped out item to its original position. If the original
+         * parent isn't available anymore it falls back to the layout's topmost element
+         */
         popIn: function () {
             var childConfig,
                 parentItem,
@@ -1864,22 +1864,22 @@
 
             if (this._parentId) {
 
-				/*
-				 * The $.extend call seems a bit pointless, but it's crucial to
-				 * copy the config returned by this.getGlInstance().toConfig()
-				 * onto a new object. Internet Explorer keeps the references
-				 * to objects on the child window, resulting in the following error
-				 * once the child window is closed:
-				 *
-				 * The callee (server [not server application]) is not available and disappeared
-				 */
+                /*
+                 * The $.extend call seems a bit pointless, but it's crucial to
+                 * copy the config returned by this.getGlInstance().toConfig()
+                 * onto a new object. Internet Explorer keeps the references
+                 * to objects on the child window, resulting in the following error
+                 * once the child window is closed:
+                 *
+                 * The callee (server [not server application]) is not available and disappeared
+                 */
                 childConfig = $.extend(true, {}, this.getGlInstance().toConfig()).content[0];
                 parentItem = this._layoutManager.root.getItemsById(this._parentId)[0];
 
-				/*
-				 * Fallback if parentItem is not available. Either add it to the topmost
-				 * item or make it the topmost item if the layout is empty
-				 */
+                /*
+                 * Fallback if parentItem is not available. Either add it to the topmost
+                 * item or make it the topmost item if the layout is empty
+                 */
                 if (!parentItem) {
                     if (this._layoutManager.root.contentItems.length > 0) {
                         parentItem = this._layoutManager.root.contentItems[0];
@@ -1894,28 +1894,28 @@
             this.close();
         },
 
-		/**
-		 * Creates the URL and window parameter
-		 * and opens a new window
-		 *
-		 * @private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Creates the URL and window parameter
+         * and opens a new window
+         *
+         * @private
+         *
+         * @returns {void}
+         */
         _createWindow: function () {
             var checkReadyInterval,
                 url = this._createUrl(),
 
-				/**
-				 * Bogus title to prevent re-usage of existing window with the
-				 * same title. The actual title will be set by the new window's
-				 * GoldenLayout instance if it detects that it is in subWindowMode
-				 */
+                /**
+                 * Bogus title to prevent re-usage of existing window with the
+                 * same title. The actual title will be set by the new window's
+                 * GoldenLayout instance if it detects that it is in subWindowMode
+                 */
                 title = Math.floor(Math.random() * 1000000).toString(36),
 
-				/**
-				 * The options as used in the window.open string
-				 */
+                /**
+                 * The options as used in the window.open string
+                 */
                 options = this._serializeWindowOptions({
                     width: this._dimensions.width,
                     height: this._dimensions.height,
@@ -1946,12 +1946,12 @@
                 .on('load', lm.utils.fnBind(this._positionWindow, this))
                 .on('unload beforeunload', lm.utils.fnBind(this._onClose, this));
 
-			/**
-			 * Polling the childwindow to find out if GoldenLayout has been initialised
-			 * doesn't seem optimal, but the alternatives - adding a callback to the parent
-			 * window or raising an event on the window object - both would introduce knowledge
-			 * about the parent to the child window which we'd rather avoid
-			 */
+            /**
+             * Polling the childwindow to find out if GoldenLayout has been initialised
+             * doesn't seem optimal, but the alternatives - adding a callback to the parent
+             * window or raising an event on the window object - both would introduce knowledge
+             * about the parent to the child window which we'd rather avoid
+             */
             checkReadyInterval = setInterval(lm.utils.fnBind(function () {
                 if (this._popoutWindow.__glInstance && this._popoutWindow.__glInstance.isInitialised) {
                     this._onInitialised();
@@ -1960,13 +1960,13 @@
             }, this), 10);
         },
 
-		/**
-		 * Serialises a map of key:values to a window options string
-		 *
-		 * @param   {Object} windowOptions
-		 *
-		 * @returns {String} serialised window options
-		 */
+        /**
+         * Serialises a map of key:values to a window options string
+         *
+         * @param   {Object} windowOptions
+         *
+         * @returns {String} serialised window options
+         */
         _serializeWindowOptions: function (windowOptions) {
             var windowOptionsString = [], key;
 
@@ -1977,12 +1977,12 @@
             return windowOptionsString.join(',');
         },
 
-		/**
-		 * Creates the URL for the new window, including the
-		 * config GET parameter
-		 *
-		 * @returns {String} URL
-		 */
+        /**
+         * Creates the URL for the new window, including the
+         * config GET parameter
+         *
+         * @returns {String} URL
+         */
         _createUrl: function () {
             var config = { content: this._config },
                 storageKey = 'gl-window-config-' + lm.utils.getUniqueId(),
@@ -2008,57 +2008,57 @@
             }
         },
 
-		/**
-		 * Move the newly created window roughly to
-		 * where the component used to be.
-		 *
-		 * @private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Move the newly created window roughly to
+         * where the component used to be.
+         *
+         * @private
+         *
+         * @returns {void}
+         */
         _positionWindow: function () {
             this._popoutWindow.moveTo(this._dimensions.left, this._dimensions.top);
             this._popoutWindow.focus();
         },
 
-		/**
-		 * Callback when the new window is opened and the GoldenLayout instance
-		 * within it is initialised
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Callback when the new window is opened and the GoldenLayout instance
+         * within it is initialised
+         *
+         * @returns {void}
+         */
         _onInitialised: function () {
             this.isInitialised = true;
             this.getGlInstance().on('popIn', this.popIn, this);
             this.emit('initialised');
         },
 
-		/**
-		 * Invoked 50ms after the window unload event
-		 *
-		 * @private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Invoked 50ms after the window unload event
+         *
+         * @private
+         *
+         * @returns {void}
+         */
         _onClose: function () {
             setTimeout(lm.utils.fnBind(this.emit, this, ['closed']), 50);
         }
     });
-	/**
-	 * This class creates a temporary container
-	 * for the component whilst it is being dragged
-	 * and handles drag events
-	 *
-	 * @constructor
-	 * @private
-	 *
-	 * @param {Number} x              The initial x position
-	 * @param {Number} y              The initial y position
-	 * @param {lm.utils.DragListener} dragListener
-	 * @param {lm.LayoutManager} layoutManager
-	 * @param {lm.item.AbstractContentItem} contentItem
-	 * @param {lm.item.AbstractContentItem} originalParent
-	 */
+    /**
+     * This class creates a temporary container
+     * for the component whilst it is being dragged
+     * and handles drag events
+     *
+     * @constructor
+     * @private
+     *
+     * @param {Number} x              The initial x position
+     * @param {Number} y              The initial y position
+     * @param {lm.utils.DragListener} dragListener
+     * @param {lm.LayoutManager} layoutManager
+     * @param {lm.item.AbstractContentItem} contentItem
+     * @param {lm.item.AbstractContentItem} originalParent
+     */
     lm.controls.DragProxy = function (x, y, dragListener, layoutManager, contentItem, originalParent) {
 
         lm.utils.EventEmitter.call(this);
@@ -2120,19 +2120,19 @@
 
     lm.utils.copy(lm.controls.DragProxy.prototype, {
 
-		/**
-		 * Callback on every mouseMove event during a drag. Determines if the drag is
-		 * still within the valid drag area and calls the layoutManager to highlight the
-		 * current drop area
-		 *
-		 * @param   {Number} offsetX The difference from the original x position in px
-		 * @param   {Number} offsetY The difference from the original y position in px
-		 * @param   {jQuery DOM event} event
-		 *
-		 * @private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Callback on every mouseMove event during a drag. Determines if the drag is
+         * still within the valid drag area and calls the layoutManager to highlight the
+         * current drop area
+         *
+         * @param   {Number} offsetX The difference from the original x position in px
+         * @param   {Number} offsetY The difference from the original y position in px
+         * @param   {jQuery DOM event} event
+         *
+         * @private
+         *
+         * @returns {void}
+         */
         _onDrag: function (offsetX, offsetY, event) {
 
             event = event.originalEvent && event.originalEvent.touches ? event.originalEvent.touches[0] : event;
@@ -2148,16 +2148,16 @@
             this._setDropPosition(x, y);
         },
 
-		/**
-		 * Sets the target position, highlighting the appropriate area
-		 *
-		 * @param   {Number} x The x position in px
-		 * @param   {Number} y The y position in px
-		 *
-		 * @private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Sets the target position, highlighting the appropriate area
+         *
+         * @param   {Number} x The x position in px
+         * @param   {Number} y The y position in px
+         *
+         * @private
+         *
+         * @returns {void}
+         */
         _setDropPosition: function (x, y) {
             this.element.css({ left: x, top: y });
             this._area = this._layoutManager._$getArea(x, y);
@@ -2168,43 +2168,43 @@
             }
         },
 
-		/**
-		 * Callback when the drag has finished. Determines the drop area
-		 * and adds the child to it
-		 *
-		 * @private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Callback when the drag has finished. Determines the drop area
+         * and adds the child to it
+         *
+         * @private
+         *
+         * @returns {void}
+         */
         _onDrop: function () {
             this._layoutManager.dropTargetIndicator.hide();
 
-			/*
-			 * Valid drop area found
-			 */
+            /*
+             * Valid drop area found
+             */
             if (this._area !== null) {
                 this._area.contentItem._$onDrop(this._contentItem, this._area);
 
-				/**
-				 * No valid drop area available at present, but one has been found before.
-				 * Use it
-				 */
+                /**
+                 * No valid drop area available at present, but one has been found before.
+                 * Use it
+                 */
             } else if (this._lastValidArea !== null) {
                 this._lastValidArea.contentItem._$onDrop(this._contentItem, this._lastValidArea);
 
-				/**
-				 * No valid drop area found during the duration of the drag. Return
-				 * content item to its original position if a original parent is provided.
-				 * (Which is not the case if the drag had been initiated by createDragSource)
-				 */
+                /**
+                 * No valid drop area found during the duration of the drag. Return
+                 * content item to its original position if a original parent is provided.
+                 * (Which is not the case if the drag had been initiated by createDragSource)
+                 */
             } else if (this._originalParent) {
                 this._originalParent.addChild(this._contentItem);
 
-				/**
-				 * The drag didn't ultimately end up with adding the content item to
-				 * any container. In order to ensure clean up happens, destroy the
-				 * content item.
-				 */
+                /**
+                 * The drag didn't ultimately end up with adding the content item to
+                 * any container. In order to ensure clean up happens, destroy the
+                 * content item.
+                 */
             } else {
                 this._contentItem._$destroy();
             }
@@ -2215,18 +2215,18 @@
             this._layoutManager.emit('itemDropped', this._contentItem);
         },
 
-		/**
-		 * Removes the item from its original position within the tree
-		 *
-		 * @private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Removes the item from its original position within the tree
+         *
+         * @private
+         *
+         * @returns {void}
+         */
         _updateTree: function () {
 
-			/**
-			 * parent is null if the drag had been initiated by a external drag source
-			 */
+            /**
+             * parent is null if the drag had been initiated by a external drag source
+             */
             if (this._contentItem.parent) {
                 this._contentItem.parent.removeChild(this._contentItem, true);
             }
@@ -2234,13 +2234,13 @@
             this._contentItem._$setParent(this);
         },
 
-		/**
-		 * Updates the Drag Proxie's dimensions
-		 *
-		 * @private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Updates the Drag Proxie's dimensions
+         *
+         * @private
+         *
+         * @returns {void}
+         */
         _setDimensions: function () {
             var dimensions = this._layoutManager.config.dimensions,
                 width = dimensions.dragProxyWidth,
@@ -2259,16 +2259,16 @@
         }
     });
 
-	/**
-	 * Allows for any DOM item to create a component on drag
-	 * start tobe dragged into the Layout
-	 *
-	 * @param {jQuery element} element
-	 * @param {Object} itemConfig the configuration for the contentItem that will be created
-	 * @param {LayoutManager} layoutManager
-	 *
-	 * @constructor
-	 */
+    /**
+     * Allows for any DOM item to create a component on drag
+     * start tobe dragged into the Layout
+     *
+     * @param {jQuery element} element
+     * @param {Object} itemConfig the configuration for the contentItem that will be created
+     * @param {LayoutManager} layoutManager
+     *
+     * @constructor
+     */
     lm.controls.DragSource = function (element, itemConfig, layoutManager) {
         this._element = element;
         this._itemConfig = itemConfig;
@@ -2280,11 +2280,11 @@
 
     lm.utils.copy(lm.controls.DragSource.prototype, {
 
-		/**
-		 * Called initially and after every drag
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Called initially and after every drag
+         *
+         * @returns {void}
+         */
         _createDragListener: function () {
             if (this._dragListener !== null) {
                 this._dragListener.destroy();
@@ -2306,14 +2306,14 @@
             }
         },
 
-		/**
-		 * Callback for the DragListener's dragStart event
-		 *
-		 * @param   {int} x the x position of the mouse on dragStart
-		 * @param   {int} y the x position of the mouse on dragStart
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Callback for the DragListener's dragStart event
+         *
+         * @param   {int} x the x position of the mouse on dragStart
+         * @param   {int} y the x position of the mouse on dragStart
+         *
+         * @returns {void}
+         */
         _onDragStart: function (x, y) {
             var itemConfig = this._itemConfig;
             if (lm.utils.isFunction(itemConfig)) {
@@ -2355,12 +2355,12 @@
             this.element.hide();
         }
     });
-	/**
-	 * This class represents a header above a Stack ContentItem.
-	 *
-	 * @param {lm.LayoutManager} layoutManager
-	 * @param {lm.item.AbstractContentItem} parent
-	 */
+    /**
+     * This class represents a header above a Stack ContentItem.
+     *
+     * @param {lm.LayoutManager} layoutManager
+     * @param {lm.item.AbstractContentItem} parent
+     */
     lm.controls.Header = function (layoutManager, parent) {
         lm.utils.EventEmitter.call(this);
 
@@ -2390,24 +2390,24 @@
         this._createControls();
     };
 
+    // '<ul class="lm_tabdropdown_list"></ul>',
     lm.controls.Header._template = [
         '<div class="lm_header">',
         '<ul class="lm_tabs"></ul>',
         '<ul class="lm_controls"></ul>',
-        '<ul class="lm_tabdropdown_list"></ul>',
         '</div>'
     ].join('');
 
     lm.utils.copy(lm.controls.Header.prototype, {
 
-		/**
-		 * Creates a new tab and associates it with a contentItem
-		 *
-		 * @param    {lm.item.AbstractContentItem} contentItem
-		 * @param    {Integer} index The position of the tab
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Creates a new tab and associates it with a contentItem
+         *
+         * @param    {lm.item.AbstractContentItem} contentItem
+         * @param    {Integer} index The position of the tab
+         *
+         * @returns {void}
+         */
         createTab: function (contentItem, index) {
             var tab, i;
 
@@ -2441,13 +2441,13 @@
             this._updateTabSizes();
         },
 
-		/**
-		 * Finds a tab based on the contentItem its associated with and removes it.
-		 *
-		 * @param    {lm.item.AbstractContentItem} contentItem
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Finds a tab based on the contentItem its associated with and removes it.
+         *
+         * @param    {lm.item.AbstractContentItem} contentItem
+         *
+         * @returns {void}
+         */
         removeTab: function (contentItem) {
             for (var i = 0; i < this.tabs.length; i++) {
                 if (this.tabs[i].contentItem === contentItem) {
@@ -2460,11 +2460,11 @@
             throw new Error('contentItem is not controlled by this header');
         },
 
-		/**
-		 * The programmatical equivalent of clicking a Tab.
-		 *
-		 * @param {lm.item.AbstractContentItem} contentItem
-		 */
+        /**
+         * The programmatical equivalent of clicking a Tab.
+         *
+         * @param {lm.item.AbstractContentItem} contentItem
+         */
         setActiveContentItem: function (contentItem) {
             var i, j, isActive, activeTab;
 
@@ -2478,10 +2478,10 @@
             }
 
             if (this.layoutManager.config.settings.reorderOnTabMenuClick) {
-				/**
-				 * If the tab selected was in the dropdown, move everything down one to make way for this one to be the first.
-				 * This will make sure the most used tabs stay visible.
-				 */
+                /**
+                 * If the tab selected was in the dropdown, move everything down one to make way for this one to be the first.
+                 * This will make sure the most used tabs stay visible.
+                 */
                 if (this._lastVisibleTabIndex !== -1 && this.parent.config.activeItemIndex > this._lastVisibleTabIndex) {
                     activeTab = this.tabs[this.parent.config.activeItemIndex];
                     for (j = this.parent.config.activeItemIndex; j > 0; j--) {
@@ -2496,13 +2496,13 @@
             this.parent.emitBubblingEvent('stateChanged');
         },
 
-		/**
-		 * Programmatically operate with header position.
-		 *
-		 * @param {string} position one of ('top','left','right','bottom') to set or empty to get it.
-		 *
-		 * @returns {string} previous header position
-		 */
+        /**
+         * Programmatically operate with header position.
+         *
+         * @param {string} position one of ('top','left','right','bottom') to set or empty to get it.
+         *
+         * @returns {string} previous header position
+         */
         position: function (position) {
             var previous = this.parent._header.show;
             if (previous && !this.parent._side)
@@ -2514,14 +2514,14 @@
             return previous;
         },
 
-		/**
-		 * Programmatically set closability.
-		 *
-		 * @package private
-		 * @param {Boolean} isClosable Whether to enable/disable closability.
-		 *
-		 * @returns {Boolean} Whether the action was successful
-		 */
+        /**
+         * Programmatically set closability.
+         *
+         * @package private
+         * @param {Boolean} isClosable Whether to enable/disable closability.
+         *
+         * @returns {Boolean} Whether the action was successful
+         */
         _$setClosable: function (isClosable) {
             if (this.closeButton && this._isClosable()) {
                 this.closeButton.element[isClosable ? "show" : "hide"]();
@@ -2531,13 +2531,13 @@
             return false;
         },
 
-		/**
-		 * Destroys the entire header
-		 *
-		 * @package private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Destroys the entire header
+         *
+         * @package private
+         *
+         * @returns {void}
+         */
         _$destroy: function () {
             this.emit('destroy', this);
 
@@ -2548,20 +2548,20 @@
             this.element.remove();
         },
 
-		/**
-		 * get settings from header
-		 *
-		 * @returns {string} when exists
-		 */
+        /**
+         * get settings from header
+         *
+         * @returns {string} when exists
+         */
         _getHeaderSetting: function (name) {
             if (name in this.parent._header)
                 return this.parent._header[name];
         },
-		/**
-		 * Creates the popout, maximise and close buttons in the header's top right corner
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Creates the popout, maximise and close buttons in the header's top right corner
+         *
+         * @returns {void}
+         */
         _createControls: function () {
             var closeStack,
                 popout,
@@ -2573,26 +2573,26 @@
                 tabDropdownLabel,
                 showTabDropdown;
 
-			/**
-			 * Dropdown to show additional tabs.
-			 */
+            /**
+             * Dropdown to show additional tabs.
+             */
             showTabDropdown = lm.utils.fnBind(this._showAdditionalTabsDropdown, this);
             tabDropdownLabel = this.layoutManager.config.labels.tabDropdown;
-            this.tabDropdownButton = new lm.controls.HeaderButton(this, tabDropdownLabel, 'lm_tabdropdown', showTabDropdown);
-            this.tabDropdownButton.element.hide();
+            // this.tabDropdownButton = new lm.controls.HeaderButton(this, tabDropdownLabel, 'lm_tabdropdown', showTabDropdown);
+            // this.tabDropdownButton.element.hide();
 
-			/**
-			 * Popout control to launch component in new window.
-			 */
+            /**
+             * Popout control to launch component in new window.
+             */
             if (this._getHeaderSetting('popout')) {
                 popout = lm.utils.fnBind(this._onPopoutClick, this);
                 label = this._getHeaderSetting('popout');
                 new lm.controls.HeaderButton(this, label, 'lm_popout', popout);
             }
 
-			/**
-			 * Maximise control - set the component to the full size of the layout
-			 */
+            /**
+             * Maximise control - set the component to the full size of the layout
+             */
             if (this._getHeaderSetting('maximise')) {
                 maximise = lm.utils.fnBind(this.parent.toggleMaximise, this.parent);
                 maximiseLabel = this._getHeaderSetting('maximise');
@@ -2608,9 +2608,9 @@
                 });
             }
 
-			/**
-			 * Close button
-			 */
+            /**
+             * Close button
+             */
             if (this._isClosable()) {
                 closeStack = lm.utils.fnBind(this.parent.remove, this.parent);
                 label = this._getHeaderSetting('close');
@@ -2618,30 +2618,30 @@
             }
         },
 
-		/**
-		 * Shows drop down for additional tabs when there are too many to display.
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Shows drop down for additional tabs when there are too many to display.
+         *
+         * @returns {void}
+         */
         _showAdditionalTabsDropdown: function () {
             this.tabDropdownContainer.show();
         },
 
-		/**
-		 * Hides drop down for additional tabs when there are too many to display.
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Hides drop down for additional tabs when there are too many to display.
+         *
+         * @returns {void}
+         */
         _hideAdditionalTabsDropdown: function (e) {
             this.tabDropdownContainer.hide();
         },
 
-		/**
-		 * Checks whether the header is closable based on the parent config and
-		 * the global config.
-		 *
-		 * @returns {Boolean} Whether the header is closable.
-		 */
+        /**
+         * Checks whether the header is closable based on the parent config and
+         * the global config.
+         *
+         * @returns {Boolean} Whether the header is closable.
+         */
         _isClosable: function () {
             return this.parent.config.isClosable && this.layoutManager.config.settings.showCloseIcon;
         },
@@ -2655,32 +2655,29 @@
         },
 
 
-		/**
-		 * Invoked when the header's background is clicked (not it's tabs or controls)
-		 *
-		 * @param    {jQuery DOM event} event
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Invoked when the header's background is clicked (not it's tabs or controls)
+         *
+         * @param    {jQuery DOM event} event
+         *
+         * @returns {void}
+         */
         _onHeaderClick: function (event) {
             if (event.target === this.element[0]) {
                 this.parent.select();
             }
         },
 
-		/**
-		 * Pushes the tabs to the tab dropdown if the available space is not sufficient
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Pushes the tabs to the tab dropdown if the available space is not sufficient
+         *
+         * @returns {void}
+         */
         _updateTabSizes: function (showTabMenu) {
             if (this.tabs.length === 0) {
                 return;
             }
 
-            //Show the menu based on function argument
-            this.tabDropdownButton.element.toggle(showTabMenu === true);
-
             var size = function (val) {
                 return val ? 'width' : 'height';
             };
@@ -2835,14 +2832,14 @@
         }
     });
 
-	/**
-	 * Represents an individual tab within a Stack's header
-	 *
-	 * @param {lm.controls.Header} header
-	 * @param {lm.items.AbstractContentItem} contentItem
-	 *
-	 * @constructor
-	 */
+    /**
+     * Represents an individual tab within a Stack's header
+     *
+     * @param {lm.controls.Header} header
+     * @param {lm.items.AbstractContentItem} contentItem
+     *
+     * @constructor
+     */
     lm.controls.Tab = function (header, contentItem) {
         this.header = header;
         this.contentItem = contentItem;
@@ -2888,37 +2885,37 @@
         }
     };
 
-	/**
-	 * The tab's html template
-	 *
-	 * @type {String}
-	 */
+    /**
+     * The tab's html template
+     *
+     * @type {String}
+     */
     lm.controls.Tab._template = '<li class="lm_tab"><i class="lm_left"></i>' +
         '<div class="lm_title_wrap"><input class="lm_title"/></div><div class="lm_close_tab"></div>' +
         '<i class="lm_right"></i></li>';
 
     lm.utils.copy(lm.controls.Tab.prototype, {
 
-		/**
-		 * Sets the tab's title to the provided string and sets
-		 * its title attribute to a pure text representation (without
-		 * html tags) of the same string.
-		 *
-		 * @public
-		 * @param {String} title can contain html
-		 */
+        /**
+         * Sets the tab's title to the provided string and sets
+         * its title attribute to a pure text representation (without
+         * html tags) of the same string.
+         *
+         * @public
+         * @param {String} title can contain html
+         */
         setTitle: function (title) {
             this.element.attr('title', lm.utils.stripTags(title));
             this.titleElement.html(title);
         },
 
-		/**
-		 * Sets this tab's active state. To programmatically
-		 * switch tabs, use header.setActiveContentItem( item ) instead.
-		 *
-		 * @public
-		 * @param {Boolean} isActive
-		 */
+        /**
+         * Sets this tab's active state. To programmatically
+         * switch tabs, use header.setActiveContentItem( item ) instead.
+         *
+         * @public
+         * @param {Boolean} isActive
+         */
         setActive: function (isActive) {
             if (isActive === this.isActive) {
                 return;
@@ -2932,12 +2929,12 @@
             }
         },
 
-		/**
-		 * Destroys the tab
-		 *
-		 * @private
-		 * @returns {void}
-		 */
+        /**
+         * Destroys the tab
+         *
+         * @private
+         * @returns {void}
+         */
         _$destroy: function () {
             this._layoutManager.emit('tabDestroyed', this);
             this.element.off('mousedown touchstart', this._onTabClickFn);
@@ -2950,15 +2947,15 @@
             this.element.remove();
         },
 
-		/**
-		 * Callback for the DragListener
-		 *
-		 * @param   {Number} x The tabs absolute x position
-		 * @param   {Number} y The tabs absolute y position
-		 *
-		 * @private
-		 * @returns {void}
-		 */
+        /**
+         * Callback for the DragListener
+         *
+         * @param   {Number} x The tabs absolute x position
+         * @param   {Number} y The tabs absolute y position
+         *
+         * @private
+         * @returns {void}
+         */
         _onDragStart: function (x, y) {
             if (this.contentItem.parent.isMaximised === true) {
                 this.contentItem.parent.toggleMaximise();
@@ -2973,14 +2970,14 @@
             );
         },
 
-		/**
-		 * Callback when the tab is clicked
-		 *
-		 * @param {jQuery DOM event} event
-		 *
-		 * @private
-		 * @returns {void}
-		 */
+        /**
+         * Callback when the tab is clicked
+         *
+         * @param {jQuery DOM event} event
+         *
+         * @private
+         * @returns {void}
+         */
         _onTabClick: function (event) {
             // left mouse button or tap
             if (event.button === 0 || event.type === 'touchstart') {
@@ -2995,30 +2992,30 @@
             }
         },
 
-		/**
-		 * Callback when the tab's close button is
-		 * clicked
-		 *
-		 * @param   {jQuery DOM event} event
-		 *
-		 * @private
-		 * @returns {void}
-		 */
+        /**
+         * Callback when the tab's close button is
+         * clicked
+         *
+         * @param   {jQuery DOM event} event
+         *
+         * @private
+         * @returns {void}
+         */
         _onCloseClick: function (event) {
             event.stopPropagation();
             this.header.parent.removeChild(this.contentItem);
         },
 
 
-		/**
-		 * Callback to capture tab close button mousedown
-		 * to prevent tab from activating.
-		 *
-		 * @param (jQuery DOM event) event
-		 *
-		 * @private
-		 * @returns {void}
-		 */
+        /**
+         * Callback to capture tab close button mousedown
+         * to prevent tab from activating.
+         *
+         * @param (jQuery DOM event) event
+         *
+         * @private
+         * @returns {void}
+         */
         _onCloseMousedown: function (event) {
             event.stopPropagation();
         }
@@ -3040,9 +3037,9 @@
         },
 
         transitionElements: function (fromElement, toElement) {
-			/**
-			 * TODO - This is not quite as cool as expected. Review.
-			 */
+            /**
+             * TODO - This is not quite as cool as expected. Review.
+             */
             return;
             this._toElement = toElement;
             this._animationStartTime = lm.utils.now();
@@ -3096,27 +3093,27 @@
 
     lm.errors.ConfigurationError.prototype = new Error();
 
-	/**
-	 * This is the baseclass that all content items inherit from.
-	 * Most methods provide a subset of what the sub-classes do.
-	 *
-	 * It also provides a number of functions for tree traversal
-	 *
-	 * @param {lm.LayoutManager} layoutManager
-	 * @param {item node configuration} config
-	 * @param {lm.item} parent
-	 *
-	 * @event stateChanged
-	 * @event beforeItemDestroyed
-	 * @event itemDestroyed
-	 * @event itemCreated
-	 * @event componentCreated
-	 * @event rowCreated
-	 * @event columnCreated
-	 * @event stackCreated
-	 *
-	 * @constructor
-	 */
+    /**
+     * This is the baseclass that all content items inherit from.
+     * Most methods provide a subset of what the sub-classes do.
+     *
+     * It also provides a number of functions for tree traversal
+     *
+     * @param {lm.LayoutManager} layoutManager
+     * @param {item node configuration} config
+     * @param {lm.item} parent
+     *
+     * @event stateChanged
+     * @event beforeItemDestroyed
+     * @event itemDestroyed
+     * @event itemCreated
+     * @event componentCreated
+     * @event rowCreated
+     * @event columnCreated
+     * @event stackCreated
+     *
+     * @constructor
+     */
     lm.items.AbstractContentItem = function (layoutManager, config, parent) {
         lm.utils.EventEmitter.call(this);
 
@@ -3146,26 +3143,26 @@
 
     lm.utils.copy(lm.items.AbstractContentItem.prototype, {
 
-		/**
-		 * Set the size of the component and its children, called recursively
-		 *
-		 * @abstract
-		 * @returns void
-		 */
+        /**
+         * Set the size of the component and its children, called recursively
+         *
+         * @abstract
+         * @returns void
+         */
         setSize: function () {
             throw new Error('Abstract Method');
         },
 
-		/**
-		 * Calls a method recursively downwards on the tree
-		 *
-		 * @param   {String} functionName      the name of the function to be called
-		 * @param   {[Array]}functionArguments optional arguments that are passed to every function
-		 * @param   {[bool]} bottomUp          Call methods from bottom to top, defaults to false
-		 * @param   {[bool]} skipSelf          Don't invoke the method on the class that calls it, defaults to false
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Calls a method recursively downwards on the tree
+         *
+         * @param   {String} functionName      the name of the function to be called
+         * @param   {[Array]}functionArguments optional arguments that are passed to every function
+         * @param   {[bool]} bottomUp          Call methods from bottom to top, defaults to false
+         * @param   {[bool]} skipSelf          Don't invoke the method on the class that calls it, defaults to false
+         *
+         * @returns {void}
+         */
         callDownwards: function (functionName, functionArguments, bottomUp, skipSelf) {
             var i;
 
@@ -3180,53 +3177,53 @@
             }
         },
 
-		/**
-		 * Removes a child node (and its children) from the tree
-		 *
-		 * @param   {lm.items.ContentItem} contentItem
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Removes a child node (and its children) from the tree
+         *
+         * @param   {lm.items.ContentItem} contentItem
+         *
+         * @returns {void}
+         */
         removeChild: function (contentItem, keepChild) {
 
-			/*
-			 * Get the position of the item that's to be removed within all content items this node contains
-			 */
+            /*
+             * Get the position of the item that's to be removed within all content items this node contains
+             */
             var index = lm.utils.indexOf(contentItem, this.contentItems);
 
-			/*
-			 * Make sure the content item to be removed is actually a child of this item
-			 */
+            /*
+             * Make sure the content item to be removed is actually a child of this item
+             */
             if (index === -1) {
                 throw new Error('Can\'t remove child item. Unknown content item');
             }
 
-			/**
-			 * Call ._$destroy on the content item. This also calls ._$destroy on all its children
-			 */
+            /**
+             * Call ._$destroy on the content item. This also calls ._$destroy on all its children
+             */
             if (keepChild !== true) {
                 this.contentItems[index]._$destroy();
             }
 
-			/**
-			 * Remove the content item from this nodes array of children
-			 */
+            /**
+             * Remove the content item from this nodes array of children
+             */
             this.contentItems.splice(index, 1);
 
-			/**
-			 * Remove the item from the configuration
-			 */
+            /**
+             * Remove the item from the configuration
+             */
             this.config.content.splice(index, 1);
 
-			/**
-			 * If this node still contains other content items, adjust their size
-			 */
+            /**
+             * If this node still contains other content items, adjust their size
+             */
             if (this.contentItems.length > 0) {
                 this.callDownwards('setSize');
 
-				/**
-				 * If this was the last content item, remove this node as well
-				 */
+                /**
+                 * If this was the last content item, remove this node as well
+                 */
             } else if (!(this instanceof lm.items.Root) && this.config.isClosable === true) {
                 const stack = this;
                 const rowOrCol = stack.parent;
@@ -3244,14 +3241,14 @@
             }
         },
 
-		/**
-		 * Sets up the tree structure for the newly added child
-		 * The responsibility for the actual DOM manipulations lies
-		 * with the concrete item
-		 *
-		 * @param {lm.items.AbstractContentItem} contentItem
-		 * @param {[Int]} index If omitted item will be appended
-		 */
+        /**
+         * Sets up the tree structure for the newly added child
+         * The responsibility for the actual DOM manipulations lies
+         * with the concrete item
+         *
+         * @param {lm.items.AbstractContentItem} contentItem
+         * @param {[Int]} index If omitted item will be appended
+         */
         addChild: function (contentItem, index) {
             if (index === undefined) {
                 index = this.contentItems.length;
@@ -3271,15 +3268,15 @@
             }
         },
 
-		/**
-		 * Replaces oldChild with newChild. This used to use jQuery.replaceWith... which for
-		 * some reason removes all event listeners, so isn't really an option.
-		 *
-		 * @param   {lm.item.AbstractContentItem} oldChild
-		 * @param   {lm.item.AbstractContentItem} newChild
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Replaces oldChild with newChild. This used to use jQuery.replaceWith... which for
+         * some reason removes all event listeners, so isn't really an option.
+         *
+         * @param   {lm.item.AbstractContentItem} oldChild
+         * @param   {lm.item.AbstractContentItem} newChild
+         *
+         * @returns {void}
+         */
         replaceChild: function (oldChild, newChild, _$destroyOldChild) {
 
             newChild = this.layoutManager._$normalizeContentItem(newChild);
@@ -3293,23 +3290,23 @@
 
             parentNode.replaceChild(newChild.element[0], oldChild.element[0]);
 
-			/*
-			 * Optionally destroy the old content item
-			 */
+            /*
+             * Optionally destroy the old content item
+             */
             if (_$destroyOldChild === true) {
                 oldChild.parent = null;
                 oldChild._$destroy();
             }
 
-			/*
-			 * Wire the new contentItem into the tree
-			 */
+            /*
+             * Wire the new contentItem into the tree
+             */
             this.contentItems[index] = newChild;
             newChild.parent = this;
 
-			/*
-			 * Update tab reference
-			 */
+            /*
+             * Update tab reference
+             */
             if (this.isStack) {
                 this.header.tabs[index].contentItem = newChild;
             }
@@ -3322,33 +3319,33 @@
             this.callDownwards('setSize');
         },
 
-		/**
-		 * Convenience method.
-		 * Shorthand for this.parent.removeChild( this )
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Convenience method.
+         * Shorthand for this.parent.removeChild( this )
+         *
+         * @returns {void}
+         */
         remove: function () {
             this.parent.removeChild(this);
         },
 
-		/**
-		 * Removes the component from the layout and creates a new
-		 * browser window with the component and its children inside
-		 *
-		 * @returns {lm.controls.BrowserPopout}
-		 */
+        /**
+         * Removes the component from the layout and creates a new
+         * browser window with the component and its children inside
+         *
+         * @returns {lm.controls.BrowserPopout}
+         */
         popout: function () {
             var browserPopout = this.layoutManager.createPopout(this);
             this.emitBubblingEvent('stateChanged');
             return browserPopout;
         },
 
-		/**
-		 * Maximises the Item or minimises it if it is already maximised
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Maximises the Item or minimises it if it is already maximised
+         *
+         * @returns {void}
+         */
         toggleMaximise: function (e) {
             e && e.preventDefault();
             if (this.isMaximised === true) {
@@ -3361,11 +3358,11 @@
             this.emitBubblingEvent('stateChanged');
         },
 
-		/**
-		 * Selects the item if it is not already selected
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Selects the item if it is not already selected
+         *
+         * @returns {void}
+         */
         select: function () {
             if (this.layoutManager.selectedItem !== this) {
                 this.layoutManager.selectItem(this, true);
@@ -3373,11 +3370,11 @@
             }
         },
 
-		/**
-		 * De-selects the item if it is selected
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * De-selects the item if it is selected
+         *
+         * @returns {void}
+         */
         deselect: function () {
             if (this.layoutManager.selectedItem === this) {
                 this.layoutManager.selectedItem = null;
@@ -3385,28 +3382,28 @@
             }
         },
 
-		/**
-		 * Set this component's title
-		 *
-		 * @public
-		 * @param {String} title
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Set this component's title
+         *
+         * @public
+         * @param {String} title
+         *
+         * @returns {void}
+         */
         setTitle: function (title) {
             this.config.title = title;
             this.emit('titleChanged', title);
             this.emit('stateChanged');
         },
 
-		/**
-		 * Checks whether a provided id is present
-		 *
-		 * @public
-		 * @param   {String}  id
-		 *
-		 * @returns {Boolean} isPresent
-		 */
+        /**
+         * Checks whether a provided id is present
+         *
+         * @public
+         * @param   {String}  id
+         *
+         * @returns {Boolean} isPresent
+         */
         hasId: function (id) {
             if (!this.config.id) {
                 return false;
@@ -3417,15 +3414,15 @@
             }
         },
 
-		/**
-		 * Adds an id. Adds it as a string if the component doesn't
-		 * have an id yet or creates/uses an array
-		 *
-		 * @public
-		 * @param {String} id
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Adds an id. Adds it as a string if the component doesn't
+         * have an id yet or creates/uses an array
+         *
+         * @public
+         * @param {String} id
+         *
+         * @returns {void}
+         */
         addId: function (id) {
             if (this.hasId(id)) {
                 return;
@@ -3440,15 +3437,15 @@
             }
         },
 
-		/**
-		 * Removes an existing id. Throws an error
-		 * if the id is not present
-		 *
-		 * @public
-		 * @param   {String} id
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Removes an existing id. Throws an error
+         * if the id is not present
+         *
+         * @public
+         * @param   {String} id
+         *
+         * @returns {void}
+         */
         removeId: function (id) {
             if (!this.hasId(id)) {
                 throw new Error('Id not found');
@@ -3462,9 +3459,9 @@
             }
         },
 
-		/****************************************
-		 * SELECTOR
-		 ****************************************/
+        /****************************************
+         * SELECTOR
+         ****************************************/
         getItemsByFilter: function (filter) {
             var result = [],
                 next = function (contentItem) {
@@ -3508,9 +3505,9 @@
             return instances;
         },
 
-		/****************************************
-		 * PACKAGE PRIVATE
-		 ****************************************/
+        /****************************************
+         * PACKAGE PRIVATE
+         ****************************************/
         _$getItemsByProperty: function (key, value) {
             return this.getItemsByFilter(function (item) {
                 return item[key] === value;
@@ -3555,11 +3552,11 @@
             }
         },
 
-		/**
-		 * Destroys this item ands its children
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Destroys this item ands its children
+         *
+         * @returns {void}
+         */
         _$destroy: function () {
             this.emitBubblingEvent('beforeItemDestroyed');
             this.callDownwards('_$destroy', [], true, true);
@@ -3567,17 +3564,17 @@
             this.emitBubblingEvent('itemDestroyed');
         },
 
-		/**
-		 * Returns the area the component currently occupies in the format
-		 *
-		 * {
-		 *		x1: int
-		 *		xy: int
-		 *		y1: int
-		 *		y2: int
-		 *		contentItem: contentItem
-		 * }
-		 */
+        /**
+         * Returns the area the component currently occupies in the format
+         *
+         * {
+         *		x1: int
+         *		xy: int
+         *		y1: int
+         *		y2: int
+         *		contentItem: contentItem
+         * }
+         */
         _$getArea: function (element) {
             element = element || this.element;
 
@@ -3595,17 +3592,17 @@
             };
         },
 
-		/**
-		 * The tree of content items is created in two steps: First all content items are instantiated,
-		 * then init is called recursively from top to bottem. This is the basic init function,
-		 * it can be used, extended or overwritten by the content items
-		 *
-		 * Its behaviour depends on the content item
-		 *
-		 * @package private
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * The tree of content items is created in two steps: First all content items are instantiated,
+         * then init is called recursively from top to bottem. This is the basic init function,
+         * it can be used, extended or overwritten by the content items
+         *
+         * Its behaviour depends on the content item
+         *
+         * @package private
+         *
+         * @returns {void}
+         */
         _$init: function () {
             var i;
             this.setSize();
@@ -3619,26 +3616,26 @@
             this.emitBubblingEvent(this.type + 'Created');
         },
 
-		/**
-		 * Emit an event that bubbles up the item tree.
-		 *
-		 * @param   {String} name The name of the event
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Emit an event that bubbles up the item tree.
+         *
+         * @param   {String} name The name of the event
+         *
+         * @returns {void}
+         */
         emitBubblingEvent: function (name) {
             var event = new lm.utils.BubblingEvent(name, this);
             this.emit(name, event);
         },
 
-		/**
-		 * Private method, creates all content items for this node at initialisation time
-		 * PLEASE NOTE, please see addChild for adding contentItems add runtime
-		 * @private
-		 * @param   {configuration item node} config
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Private method, creates all content items for this node at initialisation time
+         * PLEASE NOTE, please see addChild for adding contentItems add runtime
+         * @private
+         * @param   {configuration item node} config
+         *
+         * @returns {void}
+         */
         _createContentItems: function (config) {
             var oContentItem, i;
 
@@ -3652,13 +3649,13 @@
             }
         },
 
-		/**
-		 * Extends an item configuration node with default settings
-		 * @private
-		 * @param   {configuration item node} config
-		 *
-		 * @returns {configuration item node} extended config
-		 */
+        /**
+         * Extends an item configuration node with default settings
+         * @private
+         * @param   {configuration item node} config
+         *
+         * @returns {configuration item node} extended config
+         */
         _extendItemNode: function (config) {
 
             for (var key in lm.config.itemDefaultConfig) {
@@ -3670,26 +3667,26 @@
             return config;
         },
 
-		/**
-		 * Called for every event on the item tree. Decides whether the event is a bubbling
-		 * event and propagates it to its parent
-		 *
-		 * @param    {String} name the name of the event
-		 * @param   {lm.utils.BubblingEvent} event
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Called for every event on the item tree. Decides whether the event is a bubbling
+         * event and propagates it to its parent
+         *
+         * @param    {String} name the name of the event
+         * @param   {lm.utils.BubblingEvent} event
+         *
+         * @returns {void}
+         */
         _propagateEvent: function (name, event) {
             if (event instanceof lm.utils.BubblingEvent &&
                 event.isPropagationStopped === false &&
                 this.isInitialised === true) {
 
-				/**
-				 * In some cases (e.g. if an element is created from a DragSource) it
-				 * doesn't have a parent and is not below root. If that's the case
-				 * propagate the bubbling event from the top level of the substree directly
-				 * to the layoutManager
-				 */
+                /**
+                 * In some cases (e.g. if an element is created from a DragSource) it
+                 * doesn't have a parent and is not below root. If that's the case
+                 * propagate the bubbling event from the top level of the substree directly
+                 * to the layoutManager
+                 */
                 if (this.isRoot === false && this.parent) {
                     this.parent.emit.apply(this.parent, Array.prototype.slice.call(arguments, 0));
                 } else {
@@ -3698,16 +3695,16 @@
             }
         },
 
-		/**
-		 * All raw events bubble up to the root element. Some events that
-		 * are propagated to - and emitted by - the layoutManager however are
-		 * only string-based, batched and sanitized to make them more usable
-		 *
-		 * @param {String} name the name of the event
-		 *
-		 * @private
-		 * @returns {void}
-		 */
+        /**
+         * All raw events bubble up to the root element. Some events that
+         * are propagated to - and emitted by - the layoutManager however are
+         * only string-based, batched and sanitized to make them more usable
+         *
+         * @param {String} name the name of the event
+         *
+         * @private
+         * @returns {void}
+         */
         _scheduleEventPropagationToLayoutManager: function (name, event) {
             if (lm.utils.indexOf(name, this._throttledEvents) === -1) {
                 this.layoutManager.emit(name, event.origin);
@@ -3720,25 +3717,25 @@
 
         },
 
-		/**
-		 * Callback for events scheduled by _scheduleEventPropagationToLayoutManager
-		 *
-		 * @param {String} name the name of the event
-		 *
-		 * @private
-		 * @returns {void}
-		 */
+        /**
+         * Callback for events scheduled by _scheduleEventPropagationToLayoutManager
+         *
+         * @param {String} name the name of the event
+         *
+         * @private
+         * @returns {void}
+         */
         _propagateEventToLayoutManager: function (name, event) {
             this._pendingEventPropagations[name] = false;
             this.layoutManager.emit(name, event);
         }
     });
 
-	/**
-	 * @param {[type]} layoutManager [description]
-	 * @param {[type]} config      [description]
-	 * @param {[type]} parent        [description]
-	 */
+    /**
+     * @param {[type]} layoutManager [description]
+     * @param {[type]} config      [description]
+     * @param {[type]} parent        [description]
+     */
     lm.items.Component = function (layoutManager, config, parent) {
         lm.items.AbstractContentItem.call(this, layoutManager, config, parent);
 
@@ -3798,11 +3795,11 @@
             lm.items.AbstractContentItem.prototype._$destroy.call(this);
         },
 
-		/**
-		 * Dragging onto a component directly is not an option
-		 *
-		 * @returns null
-		 */
+        /**
+         * Dragging onto a component directly is not an option
+         *
+         * @returns null
+         */
         _$getArea: function () {
             return null;
         }
@@ -3841,9 +3838,9 @@
             this.element.width(width);
             this.element.height(height);
 
-			/*
-			 * Root can be empty
-			 */
+            /*
+             * Root can be empty
+             */
             if (this.contentItems[0]) {
                 this.contentItems[0].element.width(width);
                 this.contentItems[0].element.height(height);
@@ -3917,18 +3914,18 @@
 
     lm.utils.copy(lm.items.RowOrColumn.prototype, {
 
-		/**
-		 * Add a new contentItem to the Row or Column
-		 *
-		 * @param {lm.item.AbstractContentItem} contentItem
-		 * @param {[int]} index The position of the new item within the Row or Column.
-		 *                      If no index is provided the item will be added to the end
-		 * @param {[bool]} _$suspendResize If true the items won't be resized. This will leave the item in
-		 *                                 an inconsistent state and is only intended to be used if multiple
-		 *                                 children need to be added in one go and resize is called afterwards
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Add a new contentItem to the Row or Column
+         *
+         * @param {lm.item.AbstractContentItem} contentItem
+         * @param {[int]} index The position of the new item within the Row or Column.
+         *                      If no index is provided the item will be added to the end
+         * @param {[bool]} _$suspendResize If true the items won't be resized. This will leave the item in
+         *                                 an inconsistent state and is only intended to be used if multiple
+         *                                 children need to be added in one go and resize is called afterwards
+         *
+         * @returns {void}
+         */
         addChild: function (contentItem, index, _$suspendResize) {
 
             var newItemSize, itemSize, i, splitterElement;
@@ -3986,14 +3983,14 @@
 
         },
 
-		/**
-		 * Removes a child of this element
-		 *
-		 * @param   {lm.items.AbstractContentItem} contentItem
-		 * @param   {boolean} keepChild   If true the child will be removed, but not destroyed
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Removes a child of this element
+         *
+         * @param   {lm.items.AbstractContentItem} contentItem
+         * @param   {boolean} keepChild   If true the child will be removed, but not destroyed
+         *
+         * @returns {void}
+         */
         removeChild: function (contentItem, keepChild) {
             var removedItemSize = contentItem.config[this._dimension],
                 index = lm.utils.indexOf(contentItem, this.contentItems),
@@ -4005,10 +4002,10 @@
                 throw new Error('Can\'t remove child. ContentItem is not child of this Row or Column');
             }
 
-			/**
-			 * Remove the splitter before the item or after if the item happens
-			 * to be the first in the row/column
-			 */
+            /**
+             * Remove the splitter before the item or after if the item happens
+             * to be the first in the row/column
+             */
             if (this._splitter[splitterIndex]) {
                 this._splitter[splitterIndex]._$destroy();
                 this._splitter.splice(splitterIndex, 1);
@@ -4019,9 +4016,9 @@
                 if (this.contentItems[i].config.fixed)
                     fixedItemSize += this.contentItems[i].config[this._dimension];
             }
-			/**
-			 * Allocate the space that the removed item occupied to the remaining items
-			 */
+            /**
+             * Allocate the space that the removed item occupied to the remaining items
+             */
             for (i = 0; i < this.contentItems.length; i++) {
                 if (this.contentItems[i].config.fixed)
                     ;
@@ -4044,14 +4041,14 @@
             }
         },
 
-		/**
-		 * Replaces a child of this Row or Column with another contentItem
-		 *
-		 * @param   {lm.items.AbstractContentItem} oldChild
-		 * @param   {lm.items.AbstractContentItem} newChild
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Replaces a child of this Row or Column with another contentItem
+         *
+         * @param   {lm.items.AbstractContentItem} oldChild
+         * @param   {lm.items.AbstractContentItem} newChild
+         *
+         * @returns {void}
+         */
         replaceChild: function (oldChild, newChild) {
             var size = oldChild.config[this._dimension];
             lm.items.AbstractContentItem.prototype.replaceChild.call(this, oldChild, newChild);
@@ -4060,11 +4057,11 @@
             this.emitBubblingEvent('stateChanged');
         },
 
-		/**
-		 * Called whenever the dimensions of this item or one of its parents change
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Called whenever the dimensions of this item or one of its parents change
+         *
+         * @returns {void}
+         */
         setSize: function () {
             if (this.contentItems.length > 0) {
                 this._calculateRelativeSizes();
@@ -4074,15 +4071,15 @@
             this.emit('resize');
         },
 
-		/**
-		 * Invoked recursively by the layout manager. AbstractContentItem.init appends
-		 * the contentItem's DOM elements to the container, RowOrColumn init adds splitters
-		 * in between them
-		 *
-		 * @package private
-		 * @override AbstractContentItem._$init
-		 * @returns {void}
-		 */
+        /**
+         * Invoked recursively by the layout manager. AbstractContentItem.init appends
+         * the contentItem's DOM elements to the container, RowOrColumn init adds splitters
+         * in between them
+         *
+         * @package private
+         * @override AbstractContentItem._$init
+         * @returns {void}
+         */
         _$init: function () {
             if (this.isInitialised === true) return;
 
@@ -4095,15 +4092,15 @@
             }
         },
 
-		/**
-		 * Turns the relative sizes calculated by _calculateRelativeSizes into
-		 * absolute pixel values and applies them to the children's DOM elements
-		 *
-		 * Assigns additional pixels to counteract Math.floor
-		 *
-		 * @private
-		 * @returns {void}
-		 */
+        /**
+         * Turns the relative sizes calculated by _calculateRelativeSizes into
+         * absolute pixel values and applies them to the children's DOM elements
+         *
+         * Assigns additional pixels to counteract Math.floor
+         *
+         * @private
+         * @returns {void}
+         */
         _setAbsoluteSizes: function () {
             var i,
                 sizeData = this._calculateAbsoluteSizes();
@@ -4123,10 +4120,10 @@
             }
         },
 
-		/**
-		 * Calculates the absolute sizes of all of the children of this Item.
-		 * @returns {object} - Set with absolute sizes and additional pixels.
-		 */
+        /**
+         * Calculates the absolute sizes of all of the children of this Item.
+         * @returns {object} - Set with absolute sizes and additional pixels.
+         */
         _calculateAbsoluteSizes: function () {
             var i,
                 totalSplitterSize = (this.contentItems.length - 1) * this._splitterSize,
@@ -4164,27 +4161,27 @@
             };
         },
 
-		/**
-		 * Calculates the relative sizes of all children of this Item. The logic
-		 * is as follows:
-		 *
-		 * - Add up the total size of all items that have a configured size
-		 *
-		 * - If the total == 100 (check for floating point errors)
-		 *        Excellent, job done
-		 *
-		 * - If the total is > 100,
-		 *        set the size of items without set dimensions to 1/3 and add this to the total
-		 *        set the size off all items so that the total is hundred relative to their original size
-		 *
-		 * - If the total is < 100
-		 *        If there are items without set dimensions, distribute the remainder to 100 evenly between them
-		 *        If there are no items without set dimensions, increase all items sizes relative to
-		 *        their original size so that they add up to 100
-		 *
-		 * @private
-		 * @returns {void}
-		 */
+        /**
+         * Calculates the relative sizes of all children of this Item. The logic
+         * is as follows:
+         *
+         * - Add up the total size of all items that have a configured size
+         *
+         * - If the total == 100 (check for floating point errors)
+         *        Excellent, job done
+         *
+         * - If the total is > 100,
+         *        set the size of items without set dimensions to 1/3 and add this to the total
+         *        set the size off all items so that the total is hundred relative to their original size
+         *
+         * - If the total is < 100
+         *        If there are items without set dimensions, distribute the remainder to 100 evenly between them
+         *        If there are no items without set dimensions, increase all items sizes relative to
+         *        their original size so that they add up to 100
+         *
+         * @private
+         * @returns {void}
+         */
         _calculateRelativeSizes: function () {
 
             var i,
@@ -4200,17 +4197,17 @@
                 }
             }
 
-			/**
-			 * Everything adds up to hundred, all good :-)
-			 */
+            /**
+             * Everything adds up to hundred, all good :-)
+             */
             if (Math.round(total) === 100) {
                 this._respectMinItemWidth();
                 return;
             }
 
-			/**
-			 * Allocate the remaining size to the items without a set dimension
-			 */
+            /**
+             * Allocate the remaining size to the items without a set dimension
+             */
             if (Math.round(total) < 100 && itemsWithoutSetDimension.length > 0) {
                 for (i = 0; i < itemsWithoutSetDimension.length; i++) {
                     itemsWithoutSetDimension[i].config[dimension] = (100 - total) / itemsWithoutSetDimension.length;
@@ -4219,12 +4216,12 @@
                 return;
             }
 
-			/**
-			 * If the total is > 100, but there are also items without a set dimension left, assing 50
-			 * as their dimension and add it to the total
-			 *
-			 * This will be reset in the next step
-			 */
+            /**
+             * If the total is > 100, but there are also items without a set dimension left, assing 50
+             * as their dimension and add it to the total
+             *
+             * This will be reset in the next step
+             */
             if (Math.round(total) > 100) {
                 for (i = 0; i < itemsWithoutSetDimension.length; i++) {
                     itemsWithoutSetDimension[i].config[dimension] = 50;
@@ -4232,9 +4229,9 @@
                 }
             }
 
-			/**
-			 * Set every items size relative to 100 relative to its size to total
-			 */
+            /**
+             * Set every items size relative to 100 relative to its size to total
+             */
             for (i = 0; i < this.contentItems.length; i++) {
                 this.contentItems[i].config[dimension] = (this.contentItems[i].config[dimension] / total) * 100;
             }
@@ -4242,10 +4239,10 @@
             this._respectMinItemWidth();
         },
 
-		/**
-		 * Adjusts the column widths to respect the dimensions minItemWidth if set.
-		 * @returns {}
-		 */
+        /**
+         * Adjusts the column widths to respect the dimensions minItemWidth if set.
+         * @returns {}
+         */
         _respectMinItemWidth: function () {
             var minItemWidth = this.layoutManager.config.dimensions ? (this.layoutManager.config.dimensions.minItemWidth || 0) : 0,
                 sizeData = null,
@@ -4266,9 +4263,9 @@
 
             sizeData = this._calculateAbsoluteSizes();
 
-			/**
-			 * Figure out how much we are under the min item size total and how much room we have to use.
-			 */
+            /**
+             * Figure out how much we are under the min item size total and how much room we have to use.
+             */
             for (var i = 0; i < this.contentItems.length; i++) {
 
                 contentItem = this.contentItems[i];
@@ -4288,16 +4285,16 @@
                 allEntries.push(entry);
             }
 
-			/**
-			 * If there is nothing under min, or there is not enough over to make up the difference, do nothing.
-			 */
+            /**
+             * If there is nothing under min, or there is not enough over to make up the difference, do nothing.
+             */
             if (totalUnderMin === 0 || totalUnderMin > totalOverMin) {
                 return;
             }
 
-			/**
-			 * Evenly reduce all columns that are over the min item width to make up the difference.
-			 */
+            /**
+             * Evenly reduce all columns that are over the min item width to make up the difference.
+             */
             reducePercent = totalUnderMin / totalOverMin;
             remainingWidth = totalUnderMin;
             for (i = 0; i < entriesOverMin.length; i++) {
@@ -4307,31 +4304,31 @@
                 entry.width -= reducedWidth;
             }
 
-			/**
-			 * Take anything remaining from the last item.
-			 */
+            /**
+             * Take anything remaining from the last item.
+             */
             if (remainingWidth !== 0) {
                 allEntries[allEntries.length - 1].width -= remainingWidth;
             }
 
-			/**
-			 * Set every items size relative to 100 relative to its size to total
-			 */
+            /**
+             * Set every items size relative to 100 relative to its size to total
+             */
             for (i = 0; i < this.contentItems.length; i++) {
                 this.contentItems[i].config.width = (allEntries[i].width / sizeData.totalWidth) * 100;
             }
         },
 
-		/**
-		 * Instantiates a new lm.controls.Splitter, binds events to it and adds
-		 * it to the array of splitters at the position specified as the index argument
-		 *
-		 * What it doesn't do though is append the splitter to the DOM
-		 *
-		 * @param   {Int} index The position of the splitter
-		 *
-		 * @returns {lm.controls.Splitter}
-		 */
+        /**
+         * Instantiates a new lm.controls.Splitter, binds events to it and adds
+         * it to the array of splitters at the position specified as the index argument
+         *
+         * What it doesn't do though is append the splitter to the DOM
+         *
+         * @param   {Int} index The position of the splitter
+         *
+         * @returns {lm.controls.Splitter}
+         */
         _createSplitter: function (index) {
             var splitter;
             splitter = new lm.controls.Splitter(this._isColumn, this._splitterSize, this._splitterGrabSize);
@@ -4342,16 +4339,16 @@
             return splitter;
         },
 
-		/**
-		 * Locates the instance of lm.controls.Splitter in the array of
-		 * registered splitters and returns a map containing the contentItem
-		 * before and after the splitters, both of which are affected if the
-		 * splitter is moved
-		 *
-		 * @param   {lm.controls.Splitter} splitter
-		 *
-		 * @returns {Object} A map of contentItems that the splitter affects
-		 */
+        /**
+         * Locates the instance of lm.controls.Splitter in the array of
+         * registered splitters and returns a map containing the contentItem
+         * before and after the splitters, both of which are affected if the
+         * splitter is moved
+         *
+         * @param   {lm.controls.Splitter} splitter
+         *
+         * @returns {Object} A map of contentItems that the splitter affects
+         */
         _getItemsForSplitter: function (splitter) {
             var index = lm.utils.indexOf(splitter, this._splitter);
 
@@ -4361,11 +4358,11 @@
             };
         },
 
-		/**
-		 * Gets the minimum dimensions for the given item configuration array
-		 * @param item
-		 * @private
-		 */
+        /**
+         * Gets the minimum dimensions for the given item configuration array
+         * @param item
+         * @private
+         */
         _getMinimumDimensions: function (arr) {
             var minWidth = 0, minHeight = 0;
 
@@ -4377,14 +4374,14 @@
             return { horizontal: minWidth, vertical: minHeight };
         },
 
-		/**
-		 * Invoked when a splitter's dragListener fires dragStart. Calculates the splitters
-		 * movement area once (so that it doesn't need calculating on every mousemove event)
-		 *
-		 * @param   {lm.controls.Splitter} splitter
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Invoked when a splitter's dragListener fires dragStart. Calculates the splitters
+         * movement area once (so that it doesn't need calculating on every mousemove event)
+         *
+         * @param   {lm.controls.Splitter} splitter
+         *
+         * @returns {void}
+         */
         _onSplitterDragStart: function (splitter) {
             var items = this._getItemsForSplitter(splitter),
                 minSize = this.layoutManager.config.dimensions[this._isColumn ? 'minItemHeight' : 'minItemWidth'];
@@ -4400,16 +4397,16 @@
             this._splitterMaxPosition = items.after.element[this._dimension]() - (afterMinSize || minSize);
         },
 
-		/**
-		 * Invoked when a splitter's DragListener fires drag. Updates the splitters DOM position,
-		 * but not the sizes of the elements the splitter controls in order to minimize resize events
-		 *
-		 * @param   {lm.controls.Splitter} splitter
-		 * @param   {Int} offsetX  Relative pixel values to the splitters original position. Can be negative
-		 * @param   {Int} offsetY  Relative pixel values to the splitters original position. Can be negative
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Invoked when a splitter's DragListener fires drag. Updates the splitters DOM position,
+         * but not the sizes of the elements the splitter controls in order to minimize resize events
+         *
+         * @param   {lm.controls.Splitter} splitter
+         * @param   {Int} offsetX  Relative pixel values to the splitters original position. Can be negative
+         * @param   {Int} offsetY  Relative pixel values to the splitters original position. Can be negative
+         *
+         * @returns {void}
+         */
         _onSplitterDrag: function (splitter, offsetX, offsetY) {
             var offset = this._isColumn ? offsetY : offsetX;
 
@@ -4419,15 +4416,15 @@
             }
         },
 
-		/**
-		 * Invoked when a splitter's DragListener fires dragStop. Resets the splitters DOM position,
-		 * and applies the new sizes to the elements before and after the splitter and their children
-		 * on the next animation frame
-		 *
-		 * @param   {lm.controls.Splitter} splitter
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Invoked when a splitter's DragListener fires dragStop. Resets the splitters DOM position,
+         * and applies the new sizes to the elements before and after the splitter and their children
+         * on the next animation frame
+         *
+         * @param   {lm.controls.Splitter} splitter
+         *
+         * @returns {void}
+         */
         _onSplitterDragStop: function (splitter) {
 
             var items = this._getItemsForSplitter(splitter),
@@ -4575,13 +4572,13 @@
             this.emitBubblingEvent('stateChanged');
         },
 
-		/**
-		 * Validates that the stack is still closable or not. If a stack is able
-		 * to close, but has a non closable component added to it, the stack is no
-		 * longer closable until all components are closable.
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Validates that the stack is still closable or not. If a stack is able
+         * to close, but has a non closable component added to it, the stack is no
+         * longer closable until all components are closable.
+         *
+         * @returns {void}
+         */
         _$validateClosability: function () {
             var contentItem,
                 isClosable,
@@ -4607,51 +4604,51 @@
         },
 
 
-		/**
-		 * Ok, this one is going to be the tricky one: The user has dropped {contentItem} onto this stack.
-		 *
-		 * It was dropped on either the stacks header or the top, right, bottom or left bit of the content area
-		 * (which one of those is stored in this._dropSegment). Now, if the user has dropped on the header the case
-		 * is relatively clear: We add the item to the existing stack... job done (might be good to have
-		 * tab reordering at some point, but lets not sweat it right now)
-		 *
-		 * If the item was dropped on the content part things are a bit more complicated. If it was dropped on either the
-		 * top or bottom region we need to create a new column and place the items accordingly.
-		 * Unless, of course if the stack is already within a column... in which case we want
-		 * to add the newly created item to the existing column...
-		 * either prepend or append it, depending on wether its top or bottom.
-		 *
-		 * Same thing for rows and left / right drop segments... so in total there are 9 things that can potentially happen
-		 * (left, top, right, bottom) * is child of the right parent (row, column) + header drop
-		 *
-		 * @param    {lm.item} contentItem
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Ok, this one is going to be the tricky one: The user has dropped {contentItem} onto this stack.
+         *
+         * It was dropped on either the stacks header or the top, right, bottom or left bit of the content area
+         * (which one of those is stored in this._dropSegment). Now, if the user has dropped on the header the case
+         * is relatively clear: We add the item to the existing stack... job done (might be good to have
+         * tab reordering at some point, but lets not sweat it right now)
+         *
+         * If the item was dropped on the content part things are a bit more complicated. If it was dropped on either the
+         * top or bottom region we need to create a new column and place the items accordingly.
+         * Unless, of course if the stack is already within a column... in which case we want
+         * to add the newly created item to the existing column...
+         * either prepend or append it, depending on wether its top or bottom.
+         *
+         * Same thing for rows and left / right drop segments... so in total there are 9 things that can potentially happen
+         * (left, top, right, bottom) * is child of the right parent (row, column) + header drop
+         *
+         * @param    {lm.item} contentItem
+         *
+         * @returns {void}
+         */
         _$onDrop: function (contentItem) {
 
-			/*
-			 * The item was dropped on the header area. Just add it as a child of this stack and
-			 * get the hell out of this logic
-			 */
+            /*
+             * The item was dropped on the header area. Just add it as a child of this stack and
+             * get the hell out of this logic
+             */
             if (this._dropSegment === 'header') {
                 this._resetHeaderDropZone();
                 this.addChild(contentItem, this._dropIndex);
                 return;
             }
 
-			/*
-			 * The stack is empty. Let's just add the element.
-			 */
+            /*
+             * The stack is empty. Let's just add the element.
+             */
             if (this._dropSegment === 'body') {
                 this.addChild(contentItem);
                 return;
             }
 
-			/*
-			 * The item was dropped on the top-, left-, bottom- or right- part of the content. Let's
-			 * aggregate some conditions to make the if statements later on more readable
-			 */
+            /*
+             * The item was dropped on the top-, left-, bottom- or right- part of the content. Let's
+             * aggregate some conditions to make the if statements later on more readable
+             */
             var isVertical = this._dropSegment === 'top' || this._dropSegment === 'bottom',
                 isHorizontal = this._dropSegment === 'left' || this._dropSegment === 'right',
                 insertBefore = this._dropSegment === 'top' || this._dropSegment === 'left',
@@ -4662,9 +4659,9 @@
                 stack,
                 rowOrColumn;
 
-			/*
-			 * The content item can be either a component or a stack. If it is a component, wrap it into a stack
-			 */
+            /*
+             * The content item can be either a component or a stack. If it is a component, wrap it into a stack
+             */
             if (contentItem.isComponent) {
                 stack = this.layoutManager.createContentItem({
                     type: 'stack',
@@ -4675,20 +4672,20 @@
                 contentItem = stack;
             }
 
-			/*
-			 * If the item is dropped on top or bottom of a column or left and right of a row, it's already
-			 * layd out in the correct way. Just add it as a child
-			 */
+            /*
+             * If the item is dropped on top or bottom of a column or left and right of a row, it's already
+             * layd out in the correct way. Just add it as a child
+             */
             if (hasCorrectParent) {
                 index = lm.utils.indexOf(this, this.parent.contentItems);
                 this.parent.addChild(contentItem, insertBefore ? index : index + 1, true);
                 this.config[dimension] *= 0.5;
                 contentItem.config[dimension] = this.config[dimension];
                 this.parent.callDownwards('setSize');
-				/*
-				 * This handles items that are dropped on top or bottom of a row or left / right of a column. We need
-				 * to create the appropriate contentItem for them to live in
-				 */
+                /*
+                 * This handles items that are dropped on top or bottom of a row or left / right of a column. We need
+                 * to create the appropriate contentItem for them to live in
+                 */
             } else {
                 type = isVertical ? 'column' : 'row';
                 rowOrColumn = this.layoutManager.createContentItem({ type: type }, this);
@@ -4703,15 +4700,15 @@
             }
         },
 
-		/**
-		 * If the user hovers above the header part of the stack, indicate drop positions for tabs.
-		 * otherwise indicate which segment of the body the dragged item would be dropped on
-		 *
-		 * @param    {Int} x Absolute Screen X
-		 * @param    {Int} y Absolute Screen Y
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * If the user hovers above the header part of the stack, indicate drop positions for tabs.
+         * otherwise indicate which segment of the body the dragged item would be dropped on
+         *
+         * @param    {Int} x Absolute Screen X
+         * @param    {Int} y Absolute Screen Y
+         *
+         * @returns {void}
+         */
         _$highlightDropZone: function (x, y) {
             var segment, area;
 
@@ -4761,17 +4758,17 @@
                 }
             };
 
-			/**
-			 * If this Stack is a parent to rows, columns or other stacks only its
-			 * header is a valid dropzone.
-			 */
+            /**
+             * If this Stack is a parent to rows, columns or other stacks only its
+             * header is a valid dropzone.
+             */
             if (this._activeContentItem && this._activeContentItem.isComponent === false) {
                 return headerArea;
             }
 
-			/**
-			 * Highlight the entire body if the stack is empty
-			 */
+            /**
+             * Highlight the entire body if the stack is empty
+             */
             if (this.contentItems.length === 0) {
 
                 this._contentAreaDimensions.body = {
@@ -4971,13 +4968,13 @@
     lm.utils.BubblingEvent.prototype.stopPropagation = function () {
         this.isPropagationStopped = true;
     };
-	/**
-	 * Minifies and unminifies configs by replacing frequent keys
-	 * and values with one letter substitutes. Config options must
-	 * retain array position/index, add new options at the end.
-	 *
-	 * @constructor
-	 */
+    /**
+     * Minifies and unminifies configs by replacing frequent keys
+     * and values with one letter substitutes. Config options must
+     * retain array position/index, add new options at the end.
+     *
+     * @constructor
+     */
     lm.utils.ConfigMinifier = function () {
         this._keys = [
             'settings',
@@ -5037,154 +5034,154 @@
 
     lm.utils.copy(lm.utils.ConfigMinifier.prototype, {
 
-		/**
-		 * Takes a GoldenLayout configuration object and
-		 * replaces its keys and values recursively with
-		 * one letter counterparts
-		 *
-		 * @param   {Object} config A GoldenLayout config object
-		 *
-		 * @returns {Object} minified config
-		 */
+        /**
+         * Takes a GoldenLayout configuration object and
+         * replaces its keys and values recursively with
+         * one letter counterparts
+         *
+         * @param   {Object} config A GoldenLayout config object
+         *
+         * @returns {Object} minified config
+         */
         minifyConfig: function (config) {
             var min = {};
             this._nextLevel(config, min, '_min');
             return min;
         },
 
-		/**
-		 * Takes a configuration Object that was previously minified
-		 * using minifyConfig and returns its original version
-		 *
-		 * @param   {Object} minifiedConfig
-		 *
-		 * @returns {Object} the original configuration
-		 */
+        /**
+         * Takes a configuration Object that was previously minified
+         * using minifyConfig and returns its original version
+         *
+         * @param   {Object} minifiedConfig
+         *
+         * @returns {Object} the original configuration
+         */
         unminifyConfig: function (minifiedConfig) {
             var orig = {};
             this._nextLevel(minifiedConfig, orig, '_max');
             return orig;
         },
 
-		/**
-		 * Recursive function, called for every level of the config structure
-		 *
-		 * @param   {Array|Object} orig
-		 * @param   {Array|Object} min
-		 * @param    {String} translationFn
-		 *
-		 * @returns {void}
-		 */
+        /**
+         * Recursive function, called for every level of the config structure
+         *
+         * @param   {Array|Object} orig
+         * @param   {Array|Object} min
+         * @param    {String} translationFn
+         *
+         * @returns {void}
+         */
         _nextLevel: function (from, to, translationFn) {
             var key, minKey;
 
             for (key in from) {
 
-				/**
-				 * For in returns array indices as keys, so let's cast them to numbers
-				 */
+                /**
+                 * For in returns array indices as keys, so let's cast them to numbers
+                 */
                 if (from instanceof Array) key = parseInt(key, 10);
 
-				/**
-				 * In case something has extended Object prototypes
-				 */
+                /**
+                 * In case something has extended Object prototypes
+                 */
                 if (!from.hasOwnProperty(key)) continue;
 
-				/**
-				 * Translate the key to a one letter substitute
-				 */
+                /**
+                 * Translate the key to a one letter substitute
+                 */
                 minKey = this[translationFn](key, this._keys);
 
-				/**
-				 * For Arrays and Objects, create a new Array/Object
-				 * on the minified object and recurse into it
-				 */
+                /**
+                 * For Arrays and Objects, create a new Array/Object
+                 * on the minified object and recurse into it
+                 */
                 if (typeof from[key] === 'object') {
                     to[minKey] = from[key] instanceof Array ? [] : {};
                     this._nextLevel(from[key], to[minKey], translationFn);
 
-					/**
-					 * For primitive values (Strings, Numbers, Boolean etc.)
-					 * minify the value
-					 */
+                    /**
+                     * For primitive values (Strings, Numbers, Boolean etc.)
+                     * minify the value
+                     */
                 } else {
                     to[minKey] = this[translationFn](from[key], this._values);
                 }
             }
         },
 
-		/**
-		 * Minifies value based on a dictionary
-		 *
-		 * @param   {String|Boolean} value
-		 * @param   {Array<String|Boolean>} dictionary
-		 *
-		 * @returns {String} The minified version
-		 */
+        /**
+         * Minifies value based on a dictionary
+         *
+         * @param   {String|Boolean} value
+         * @param   {Array<String|Boolean>} dictionary
+         *
+         * @returns {String} The minified version
+         */
         _min: function (value, dictionary) {
-			/**
-			 * If a value actually is a single character, prefix it
-			 * with ___ to avoid mistaking it for a minification code
-			 */
+            /**
+             * If a value actually is a single character, prefix it
+             * with ___ to avoid mistaking it for a minification code
+             */
             if (typeof value === 'string' && value.length === 1) {
                 return '___' + value;
             }
 
             var index = lm.utils.indexOf(value, dictionary);
 
-			/**
-			 * value not found in the dictionary, return it unmodified
-			 */
+            /**
+             * value not found in the dictionary, return it unmodified
+             */
             if (index === -1) {
                 return value;
 
-				/**
-				 * value found in dictionary, return its base36 counterpart
-				 */
+                /**
+                 * value found in dictionary, return its base36 counterpart
+                 */
             } else {
                 return index.toString(36);
             }
         },
 
         _max: function (value, dictionary) {
-			/**
-			 * value is a single character. Assume that it's a translation
-			 * and return the original value from the dictionary
-			 */
+            /**
+             * value is a single character. Assume that it's a translation
+             * and return the original value from the dictionary
+             */
             if (typeof value === 'string' && value.length === 1) {
                 return dictionary[parseInt(value, 36)];
             }
 
-			/**
-			 * value originally was a single character and was prefixed with ___
-			 * to avoid mistaking it for a translation. Remove the prefix
-			 * and return the original character
-			 */
+            /**
+             * value originally was a single character and was prefixed with ___
+             * to avoid mistaking it for a translation. Remove the prefix
+             * and return the original character
+             */
             if (typeof value === 'string' && value.substr(0, 3) === '___') {
                 return value[3];
             }
-			/**
-			 * value was not minified
-			 */
+            /**
+             * value was not minified
+             */
             return value;
         }
     });
 
-	/**
-	 * An EventEmitter singleton that propagates events
-	 * across multiple windows. This is a little bit trickier since
-	 * windows are allowed to open childWindows in their own right
-	 *
-	 * This means that we deal with a tree of windows. Hence the rules for event propagation are:
-	 *
-	 * - Propagate events from this layout to both parents and children
-	 * - Propagate events from parent to this and children
-	 * - Propagate events from children to the other children (but not the emitting one) and the parent
-	 *
-	 * @constructor
-	 *
-	 * @param {lm.LayoutManager} layoutManager
-	 */
+    /**
+     * An EventEmitter singleton that propagates events
+     * across multiple windows. This is a little bit trickier since
+     * windows are allowed to open childWindows in their own right
+     *
+     * This means that we deal with a tree of windows. Hence the rules for event propagation are:
+     *
+     * - Propagate events from this layout to both parents and children
+     * - Propagate events from parent to this and children
+     * - Propagate events from children to the other children (but not the emitting one) and the parent
+     *
+     * @constructor
+     *
+     * @param {lm.LayoutManager} layoutManager
+     */
     lm.utils.EventHub = function (layoutManager) {
         lm.utils.EventEmitter.call(this);
         this._layoutManager = layoutManager;
@@ -5195,15 +5192,15 @@
         $(window).on('gl_child_event', this._boundOnEventFromChild);
     };
 
-	/**
-	 * Called on every event emitted on this eventHub, regardles of origin.
-	 *
-	 * @private
-	 *
-	 * @param {Mixed}
-	 *
-	 * @returns {void}
-	 */
+    /**
+     * Called on every event emitted on this eventHub, regardles of origin.
+     *
+     * @private
+     *
+     * @param {Mixed}
+     *
+     * @returns {void}
+     */
     lm.utils.EventHub.prototype._onEventFromThis = function () {
         var args = Array.prototype.slice.call(arguments);
 
@@ -5217,40 +5214,40 @@
         this._childEventSource = null;
     };
 
-	/**
-	 * Called by the parent layout.
-	 *
-	 * @param   {Array} args Event name + arguments
-	 *
-	 * @returns {void}
-	 */
+    /**
+     * Called by the parent layout.
+     *
+     * @param   {Array} args Event name + arguments
+     *
+     * @returns {void}
+     */
     lm.utils.EventHub.prototype._$onEventFromParent = function (args) {
         this._dontPropagateToParent = args[0];
         this.emit.apply(this, args);
     };
 
-	/**
-	 * Callback for child events raised on the window
-	 *
-	 * @param   {DOMEvent} event
-	 * @private
-	 *
-	 * @returns {void}
-	 */
+    /**
+     * Callback for child events raised on the window
+     *
+     * @param   {DOMEvent} event
+     * @private
+     *
+     * @returns {void}
+     */
     lm.utils.EventHub.prototype._onEventFromChild = function (event) {
         this._childEventSource = event.originalEvent.__gl;
         this.emit.apply(this, event.originalEvent.__glArgs);
     };
 
-	/**
-	 * Propagates the event to the parent by emitting
-	 * it on the parent's DOM window
-	 *
-	 * @param   {Array} args Event name + arguments
-	 * @private
-	 *
-	 * @returns {void}
-	 */
+    /**
+     * Propagates the event to the parent by emitting
+     * it on the parent's DOM window
+     *
+     * @param   {Array} args Event name + arguments
+     * @private
+     *
+     * @returns {void}
+     */
     lm.utils.EventHub.prototype._propagateToParent = function (args) {
         var event,
             eventName = 'gl_child_event';
@@ -5274,14 +5271,14 @@
         }
     };
 
-	/**
-	 * Propagate events to children
-	 *
-	 * @param   {Array} args Event name + arguments
-	 * @private
-	 *
-	 * @returns {void}
-	 */
+    /**
+     * Propagate events to children
+     *
+     * @param   {Array} args Event name + arguments
+     * @private
+     *
+     * @returns {void}
+     */
     lm.utils.EventHub.prototype._propagateToChildren = function (args) {
         var childGl, i;
 
@@ -5295,25 +5292,25 @@
     };
 
 
-	/**
-	 * Destroys the EventHub
-	 *
-	 * @public
-	 * @returns {void}
-	 */
+    /**
+     * Destroys the EventHub
+     *
+     * @public
+     * @returns {void}
+     */
 
     lm.utils.EventHub.prototype.destroy = function () {
         $(window).off('gl_child_event', this._boundOnEventFromChild);
     };
-	/**
-	 * A specialised GoldenLayout component that binds GoldenLayout container
-	 * lifecycle events to react components
-	 *
-	 * @constructor
-	 *
-	 * @param {lm.container.ItemContainer} container
-	 * @param {Object} state state is not required for react components
-	 */
+    /**
+     * A specialised GoldenLayout component that binds GoldenLayout container
+     * lifecycle events to react components
+     *
+     * @constructor
+     *
+     * @param {lm.container.ItemContainer} container
+     * @param {Object} state state is not required for react components
+     */
     lm.utils.ReactComponentHandler = function (container, state) {
         this._reactComponent = null;
         this._originalComponentWillUpdate = null;
@@ -5326,15 +5323,15 @@
 
     lm.utils.copy(lm.utils.ReactComponentHandler.prototype, {
 
-		/**
-		 * Creates the react class and component and hydrates it with
-		 * the initial state - if one is present
-		 *
-		 * By default, react's getInitialState will be used
-		 *
-		 * @private
-		 * @returns {void}
-		 */
+        /**
+         * Creates the react class and component and hydrates it with
+         * the initial state - if one is present
+         *
+         * By default, react's getInitialState will be used
+         *
+         * @private
+         * @returns {void}
+         */
         _render: function () {
             this._reactComponent = ReactDOM.render(this._getReactComponent(), this._container.getElement()[0]);
             this._originalComponentWillUpdate = this._reactComponent.componentWillUpdate || function () {
@@ -5345,36 +5342,36 @@
             }
         },
 
-		/**
-		 * Removes the component from the DOM and thus invokes React's unmount lifecycle
-		 *
-		 * @private
-		 * @returns {void}
-		 */
+        /**
+         * Removes the component from the DOM and thus invokes React's unmount lifecycle
+         *
+         * @private
+         * @returns {void}
+         */
         _destroy: function () {
             ReactDOM.unmountComponentAtNode(this._container.getElement()[0]);
             this._container.off('open', this._render, this);
             this._container.off('destroy', this._destroy, this);
         },
 
-		/**
-		 * Hooks into React's state management and applies the componentstate
-		 * to GoldenLayout
-		 *
-		 * @private
-		 * @returns {void}
-		 */
+        /**
+         * Hooks into React's state management and applies the componentstate
+         * to GoldenLayout
+         *
+         * @private
+         * @returns {void}
+         */
         _onUpdate: function (nextProps, nextState) {
             this._container.setState(nextState);
             this._originalComponentWillUpdate.call(this._reactComponent, nextProps, nextState);
         },
 
-		/**
-		 * Retrieves the react class from GoldenLayout's registry
-		 *
-		 * @private
-		 * @returns {React.Class}
-		 */
+        /**
+         * Retrieves the react class from GoldenLayout's registry
+         *
+         * @private
+         * @returns {React.Class}
+         */
         _getReactClass: function () {
             var componentName = this._container._config.component;
             var reactClass;
@@ -5393,12 +5390,12 @@
             return reactClass;
         },
 
-		/**
-		 * Copies and extends the properties array and returns the React element
-		 *
-		 * @private
-		 * @returns {React.Element}
-		 */
+        /**
+         * Copies and extends the properties array and returns the React element
+         *
+         * @private
+         * @returns {React.Element}
+         */
         _getReactComponent: function () {
             var defaultProps = {
                 glEventHub: this._container.layoutManager.eventHub,
diff --git a/src/client/views/MainView.scss b/src/client/views/MainView.scss
index ba1c91720..d913f2069 100644
--- a/src/client/views/MainView.scss
+++ b/src/client/views/MainView.scss
@@ -117,7 +117,7 @@
 
 .mainView-propertiesDragger {
     //background-color: rgb(140, 139, 139);
-    background-color: $medium-gray;
+    background-color: $light-gray;
     height: 55px;
     width: 17px;
     position: absolute;
@@ -165,7 +165,7 @@
         left: 0;
         position: absolute;
         z-index: 2;
-        background-color: $medium-gray;
+        background-color: $light-gray;
         .editable-title {
             background-color: $light-gray;
         }
diff --git a/src/client/views/topbar/TopBar.scss b/src/client/views/topbar/TopBar.scss
index e2d27d5a6..ce6636080 100644
--- a/src/client/views/topbar/TopBar.scss
+++ b/src/client/views/topbar/TopBar.scss
@@ -75,6 +75,20 @@
             display: flex;
             justify-content: flex-end;
 
+            
+
+            
+
+        }
+
+        .topbar-left {
+            grid-column: 1;
+            color: black;
+            font-family: 'Roboto';
+            position: relative;
+            display: flex;
+            width: 450;
+
             .topbar-lozenge-user,
             .topbar-lozenge {
                 height: 23;
@@ -89,20 +103,6 @@
                 align-items: center;
                 border: white 1px solid;
 
-                .topbar-logoff {
-                    border-radius: 3px;
-                    background: olivedrab;
-                    color: white;
-                    display: none;
-                    margin-left: 5px;
-                    padding: 1px 2px 1px 2px;
-                    cursor: pointer;
-                }
-
-                .topbar-logoff {
-                    background: red;
-                }
-
                 .topbar-dashSelect {
                     border: none;
                     background-color: transparent;
@@ -117,21 +117,25 @@
                 }
             }
 
+            .topbar-logoff {
+                border-radius: 3px;
+                background: olivedrab;
+                color: white;
+                display: none;
+                margin-left: 5px;
+                padding: 1px 2px 1px 2px;
+                cursor: pointer;
+            }
+
+            .topbar-logoff {
+                background: red;
+            }
+
             .topbar-lozenge-user:hover {
                 .topbar-logoff {
                     display: inline-block;
                 }
             }
-
-        }
-
-        .topbar-left {
-            grid-column: 1;
-            color: black;
-            font-family: 'Roboto';
-            position: relative;
-            display: flex;
-            width: 450;
         }
 
         .topbar-barChild {
diff --git a/src/client/views/topbar/TopBar.tsx b/src/client/views/topbar/TopBar.tsx
index 65da717f8..02b597078 100644
--- a/src/client/views/topbar/TopBar.tsx
+++ b/src/client/views/topbar/TopBar.tsx
@@ -24,6 +24,14 @@ export class TopBar extends React.Component {
             //TODO:glr Add support for light / dark mode
             <div style={{ pointerEvents: "all" }} className="topbar-container">
                 <div className="topbar-bar" style={{ background: Colors.DARK_GRAY, borderBottom: Borders.STANDARD }}>
+                    <div className="topbar-left">
+                        <div className="topbar-lozenge-user">
+                            {`${Doc.CurrentUserEmail}`}
+                            <div className="topbar-logoff" onClick={() => window.location.assign(Utils.prepend("/logout"))}>
+                                Logoff
+                            </div>
+                        </div>
+                    </div>
                     <div className="topbar-center" >
                         <div className="topbar-lozenge-dashboard">
                             <select className="topbar-dashSelect" onChange={e => CurrentUserUtils.openDashboard(Doc.UserDoc(), myDashboards[Number(e.target.value)])}
@@ -34,11 +42,11 @@ export class TopBar extends React.Component {
                             <div className="topbar-dashboards">
                                 <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.createNewDashboard(Doc.UserDoc()))}
                                     style={{ color: Colors.WHITE }}>
-                                    <FontAwesomeIcon icon="plus"></FontAwesomeIcon>
+                                    <FontAwesomeIcon icon="plus"></FontAwesomeIcon>{"New"}
                                 </div>
                                 <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.snapshotDashboard(Doc.UserDoc()))}
                                     style={{ color: Colors.WHITE }}>
-                                    <FontAwesomeIcon icon="camera"></FontAwesomeIcon>
+                                    <FontAwesomeIcon icon="camera"></FontAwesomeIcon>{"Snapshot"}
                                 </div>
                             </div>
                         </div>
@@ -52,15 +60,9 @@ export class TopBar extends React.Component {
                             style={{ color: Colors.WHITE }}>
                             <FontAwesomeIcon icon="cog"></FontAwesomeIcon>
                         </div>
-                        <div className="topbar-lozenge-user">
-                            {`${Doc.CurrentUserEmail}`}
-                            <div className="topbar-logoff" onClick={() => window.location.assign(Utils.prepend("/logout"))}>
-                                Logoff
-                        </div>
-                        </div>
-                    </div>
 
-                </div >
+                    </div>
+                </div>
             </div >
         );
     }
diff --git a/src/client/views/topbar/TopBarButton.tsx b/src/client/views/topbar/TopBarButton.tsx
deleted file mode 100644
index 0d3d2a8d1..000000000
--- a/src/client/views/topbar/TopBarButton.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import React from "react";
-
-export interface IButtonProps {
-    icon?: JSX.Element;
-    text?: String;
-}
-
-export class TopBarButton implements IButtonProps {
-
-}
-- 
cgit v1.2.3-70-g09d2


From fcc75a92643f35955a1e0bbe829e96b0e76c8a4e Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Sat, 31 Jul 2021 08:09:45 -0400
Subject: updates ready for sprint (almost)

---
 src/client/goldenLayout.js                         | 37 +++++++--------
 src/client/views/DocumentButtonBar.scss            |  6 +--
 src/client/views/_nodeModuleOverrides.scss         |  3 +-
 .../views/collections/CollectionDockingView.scss   |  6 +--
 src/client/views/global/globalCssVariables.scss    |  2 +
 src/client/views/topbar/TopBar.scss                | 52 +++++++++++-----------
 src/client/views/topbar/TopBar.tsx                 | 34 +++++++-------
 7 files changed, 69 insertions(+), 71 deletions(-)

(limited to 'src')

diff --git a/src/client/goldenLayout.js b/src/client/goldenLayout.js
index b118a5f44..238f1ac0a 100644
--- a/src/client/goldenLayout.js
+++ b/src/client/goldenLayout.js
@@ -1571,11 +1571,11 @@
             tabControlOffset: 10
         },
         dimensions: {
-            borderWidth: 5,
+            borderWidth: 3,
             borderGrabWidth: 5,
             minItemHeight: 10,
-            minItemWidth: 10,
-            headerHeight: 22,
+            minItemWidth: 20,
+            headerHeight: 27,
             dragProxyWidth: 300,
             dragProxyHeight: 200
         },
@@ -2477,20 +2477,21 @@
                 }
             }
 
-            if (this.layoutManager.config.settings.reorderOnTabMenuClick) {
-                /**
-                 * If the tab selected was in the dropdown, move everything down one to make way for this one to be the first.
-                 * This will make sure the most used tabs stay visible.
-                 */
-                if (this._lastVisibleTabIndex !== -1 && this.parent.config.activeItemIndex > this._lastVisibleTabIndex) {
-                    activeTab = this.tabs[this.parent.config.activeItemIndex];
-                    for (j = this.parent.config.activeItemIndex; j > 0; j--) {
-                        this.tabs[j] = this.tabs[j - 1];
-                    }
-                    this.tabs[0] = activeTab;
-                    this.parent.config.activeItemIndex = 0;
-                }
-            }
+            // glr: removed for new tab manager
+            // if (this.layoutManager.config.settings.reorderOnTabMenuClick) {
+            //     /**
+            //      * If the tab selected was in the dropdown, move everything down one to make way for this one to be the first.
+            //      * This will make sure the most used tabs stay visible.
+            //      */
+            //     if (this._lastVisibleTabIndex !== -1 && this.parent.config.activeItemIndex > this._lastVisibleTabIndex) {
+            //         activeTab = this.tabs[this.parent.config.activeItemIndex];
+            //         for (j = this.parent.config.activeItemIndex; j > 0; j--) {
+            //             this.tabs[j] = this.tabs[j - 1];
+            //         }
+            //         this.tabs[0] = activeTab;
+            //         this.parent.config.activeItemIndex = 0;
+            //     }
+            // }
 
             this._updateTabSizes();
             this.parent.emitBubblingEvent('stateChanged');
@@ -4872,7 +4873,7 @@
                 this.layoutManager.dropTargetIndicator.highlightArea({
                     x1: headerOffset.left,
                     x2: headerOffset.left + 100,
-                    y1: headerOffset.top + this.header.element.height() - 20,
+                    y1: headerOffset.top + this.header.element.height() - 25,
                     y2: headerOffset.top + this.header.element.height()
                 });
 
diff --git a/src/client/views/DocumentButtonBar.scss b/src/client/views/DocumentButtonBar.scss
index 2a0b494f5..621c2bf1b 100644
--- a/src/client/views/DocumentButtonBar.scss
+++ b/src/client/views/DocumentButtonBar.scss
@@ -44,18 +44,16 @@ $linkGap : 3px;
 }
 
 .documentButtonBar {
-    margin-top: $linkGap;
-    grid-column: 1/4;
-    width: max-content;
-    height: auto;
     display: flex;
     flex-direction: row;
+    gap: 3px;
 }
 
 .documentButtonBar-button {
     pointer-events: auto;
     padding-right: 5px;
     width: 25px;
+    height: 25px;
 }
 
 .documentButtonBar-linker {
diff --git a/src/client/views/_nodeModuleOverrides.scss b/src/client/views/_nodeModuleOverrides.scss
index 140be2140..fd0ac9d5c 100644
--- a/src/client/views/_nodeModuleOverrides.scss
+++ b/src/client/views/_nodeModuleOverrides.scss
@@ -5,6 +5,7 @@
 div .lm_header {
     background: $dark-gray;
     overflow: hidden;
+    height: 27px !important;
 }
 
 /* Width */
@@ -62,7 +63,7 @@ div .lm_header {
     border-radius: 5px;
     display: flex;
     justify-content: space-evenly;
-    height: 18px;
+    height: 23px;
     width: 65px;
 }
 
diff --git a/src/client/views/collections/CollectionDockingView.scss b/src/client/views/collections/CollectionDockingView.scss
index b8180fe24..77e7b86ea 100644
--- a/src/client/views/collections/CollectionDockingView.scss
+++ b/src/client/views/collections/CollectionDockingView.scss
@@ -39,7 +39,7 @@
     padding: 0px;
     opacity: 0.7;
     box-shadow: none;
-    height: 19px;
+    height: 24px;
     // border-bottom: 1px black;
 
     .collectionDockingView-gear {
@@ -52,7 +52,7 @@
     opacity: 1;
     margin: 0;
     box-shadow: none;
-    height: 22px;
+    height: 27px;
     margin-right: 2px;
     // border-bottom: unset;
 
@@ -357,8 +357,6 @@
         background: transparent url("../../../../node_modules/flexlayout-react/images/restore.png") no-repeat center;
     }
 
-    .flexlayout__popup_menu {}
-
     .flexlayout__popup_menu_item {
         padding: 2px 10px 2px 10px;
         color: #ddd;
diff --git a/src/client/views/global/globalCssVariables.scss b/src/client/views/global/globalCssVariables.scss
index 72adc171b..a9f33c4da 100644
--- a/src/client/views/global/globalCssVariables.scss
+++ b/src/client/views/global/globalCssVariables.scss
@@ -11,6 +11,8 @@ $medium-blue: #4476F7;
 $pink: #E0217D;
 $yellow: #F5D747;
 
+$logout-red: #ca4444;
+
 $drop-shadow: "#32323215";
 
 //padding
diff --git a/src/client/views/topbar/TopBar.scss b/src/client/views/topbar/TopBar.scss
index ce6636080..adb968948 100644
--- a/src/client/views/topbar/TopBar.scss
+++ b/src/client/views/topbar/TopBar.scss
@@ -20,11 +20,34 @@
         align-items: center;
         background-color: $dark-gray;
 
+        .topBar-icon {
+            cursor: pointer;
+            font-size: 12px;
+            width: fit-content;
+            display: flex;
+            justify-content: center;
+            gap: 4px;
+            align-items: center;
+            justify-self: center;
+            align-self: center;
+            border-radius: 5px;
+            padding: 5px;
+            transition: linear 0.1s;
+            color: $black;
+            background-color: $light-gray;
+        }
+
+        .topBar-icon:hover {
+            background-color: $light-blue;
+        }
+
+        
         .topbar-center {
             grid-column: 2;
             display: inline-flex;
             justify-content: center;
             align-items: center;
+            gap: 5px;
 
             .topbar-lozenge-dashboard {
                 display: flex;
@@ -48,37 +71,13 @@
             }
         }
 
-        .topBar-icon {
-            color: black;
-            cursor: pointer;
-            font-size: 15px;
-            height: 30;
-            width: 30;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            margin-right: 5px;
-            justify-self: center;
-            align-self: center;
-            border-radius: 100%;
-            transition: linear 0.1s;
-            background-color: #92adb900;
-        }
-
-        .topBar-icon:hover {
-            background-color: rgba(0, 0, 0, 0.15);
-        }
 
         .topbar-right {
             grid-column: 3;
             position: relative;
             display: flex;
             justify-content: flex-end;
-
-            
-
-            
-
+            gap: 5px;
         }
 
         .topbar-left {
@@ -88,6 +87,7 @@
             position: relative;
             display: flex;
             width: 450;
+            gap: 5px;
 
             .topbar-lozenge-user,
             .topbar-lozenge {
@@ -98,10 +98,10 @@
                 font-weight: 400;
                 padding: 4px;
                 align-self: center;
+                margin-left: 7px;
                 margin-right: 7px;
                 display: flex;
                 align-items: center;
-                border: white 1px solid;
 
                 .topbar-dashSelect {
                     border: none;
diff --git a/src/client/views/topbar/TopBar.tsx b/src/client/views/topbar/TopBar.tsx
index 02b597078..6e4d4fe15 100644
--- a/src/client/views/topbar/TopBar.tsx
+++ b/src/client/views/topbar/TopBar.tsx
@@ -27,9 +27,9 @@ export class TopBar extends React.Component {
                     <div className="topbar-left">
                         <div className="topbar-lozenge-user">
                             {`${Doc.CurrentUserEmail}`}
-                            <div className="topbar-logoff" onClick={() => window.location.assign(Utils.prepend("/logout"))}>
-                                Logoff
-                            </div>
+                        </div>
+                        <div className="topbar-icon" onClick={() => window.location.assign(Utils.prepend("/logout"))}>
+                            {"Logoff"}<FontAwesomeIcon icon="sign-out"></FontAwesomeIcon>
                         </div>
                     </div>
                     <div className="topbar-center" >
@@ -39,26 +39,24 @@ export class TopBar extends React.Component {
                                 style={{ color: Colors.WHITE }}>
                                 {myDashboards.map((dash, i) => <option key={dash[Id]} value={i}> {StrCast(dash.title)} </option>)}
                             </select>
-                            <div className="topbar-dashboards">
-                                <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.createNewDashboard(Doc.UserDoc()))}
-                                    style={{ color: Colors.WHITE }}>
-                                    <FontAwesomeIcon icon="plus"></FontAwesomeIcon>{"New"}
-                                </div>
-                                <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.snapshotDashboard(Doc.UserDoc()))}
-                                    style={{ color: Colors.WHITE }}>
-                                    <FontAwesomeIcon icon="camera"></FontAwesomeIcon>{"Snapshot"}
-                                </div>
+                        </div>
+                        <div className="topbar-dashboards">
+                            <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.createNewDashboard(Doc.UserDoc()))}
+                            >
+                                {"New"}<FontAwesomeIcon icon="plus"></FontAwesomeIcon>
                             </div>
+                            {Doc.UserDoc().noviceMode ? (null) : <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.snapshotDashboard(Doc.UserDoc()))}
+                            >
+                                {"Snapshot"}<FontAwesomeIcon icon="camera"></FontAwesomeIcon>
+                            </div>}
                         </div>
                     </div>
                     <div className="topbar-right" >
-                        <div className="topbar-icon"
-                            style={{ color: Colors.WHITE }}>
-                            <FontAwesomeIcon icon="question-circle"></FontAwesomeIcon>
+                        <div className="topbar-icon">
+                            {"Help"}<FontAwesomeIcon icon="question-circle"></FontAwesomeIcon>
                         </div>
-                        <div className="topbar-icon" onClick={() => SettingsManager.Instance.open()}
-                            style={{ color: Colors.WHITE }}>
-                            <FontAwesomeIcon icon="cog"></FontAwesomeIcon>
+                        <div className="topbar-icon" onClick={() => SettingsManager.Instance.open()}>
+                            {"Settings"}<FontAwesomeIcon icon="cog"></FontAwesomeIcon>
                         </div>
 
                     </div>
-- 
cgit v1.2.3-70-g09d2


From 41ccf50f2b551edd6827c9fd6296b9ff87a65915 Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Sat, 31 Jul 2021 15:32:37 -0400
Subject: linking updates and tab updates

---
 deploy/index.html                               | 105 +++++++++++++++++++++++-
 src/client/views/DocumentButtonBar.scss         |  11 ++-
 src/client/views/DocumentDecorations.scss       |   4 +-
 src/client/views/collections/TabDocView.tsx     |   7 +-
 src/client/views/nodes/DocumentLinksButton.scss |  15 +++-
 src/client/views/nodes/DocumentLinksButton.tsx  |  83 ++++++++++---------
 src/client/views/nodes/DocumentView.scss        |   2 +-
 src/client/views/topbar/TopBar.scss             |  10 ++-
 src/client/views/topbar/TopBar.tsx              |   2 +-
 9 files changed, 182 insertions(+), 57 deletions(-)

(limited to 'src')

diff --git a/deploy/index.html b/deploy/index.html
index d96215391..c32aff638 100644
--- a/deploy/index.html
+++ b/deploy/index.html
@@ -11,8 +11,109 @@
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
         integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
     <script src="https://cdnjs.cloudflare.com/ajax/libs/typescript/3.3.1/typescript.min.js"></script>
-    <script src="loader.js"></script>
-    <link rel="stylesheet" href="./loader.css" />
+    <script>
+        function getCookie(cname) {
+            var name = cname + "=";
+            var ca = document.cookie.split(';');
+            for (var i = 0; i < ca.length; i++) {
+                var c = ca[i];
+                while (c.charAt(0) == ' ') {
+                    c = c.substring(1);
+                }
+                if (c.indexOf(name) == 0) {
+                    return Number(c.substring(name.length, c.length));
+                }
+            }
+            return 3000;
+        }
+    </script>
+    <style>
+        .dash-loader {
+            display: flex;
+            align-content: center;
+            justify-content: center;
+            background-color: #BDDDF5;
+            transition: 3s;
+            z-index: 10;
+            z-index: 10;
+            width: 100%;
+            height: 100%;
+        }
+
+        .dash-loader-container {
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            align-items: center;
+            align-content: center;
+        }
+
+        .dash-progress-bar {
+            width: 200px;
+            height: 5px;
+            align-self: center;
+            margin-top: 20px;
+            background-color: #ececec;
+            border-radius: 5px;
+            overflow: hidden;
+        }
+
+        .dash-progress {
+            width: 0%;
+            height: 20px;
+            background-color: #4476F7;
+            transition: 0.1s;
+        }
+
+        .dash-animation-container {
+            width: 10vw;
+            height: 10vw;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            border-radius: 100%;
+            background-color: #4476F7;
+            justify-self: center;
+        }
+
+        .dash-loader-text {
+            font-size: 15px;
+            font-family: "Roboto";
+            font-weight: 400;
+            text-align: center;
+            color: #4476F7;
+            user-select: none;
+            -webkit-user-select: none;
+        }
+
+        .dash-d-path {
+            stroke-dasharray: 1000;
+            stroke-dashoffset: 1000;
+            animation: dash-d-path 3s linear infinite;
+        }
+
+        @keyframes dash-d-path {
+            0% {
+                stroke-dashoffset: 1000;
+            }
+
+            20% {
+                stroke-dashoffset: 0;
+            }
+
+            70% {
+                stroke-dashoffset: 0;
+            }
+
+            90% {
+                stroke-dashoffset: 1000;
+            }
+
+            100% {
+                stroke-dashoffset: 1000;
+            }
+        }
+    </style>
 </head>
 
 <body style="display:flex" id="dash-body">
diff --git a/src/client/views/DocumentButtonBar.scss b/src/client/views/DocumentButtonBar.scss
index 621c2bf1b..157f3a4f2 100644
--- a/src/client/views/DocumentButtonBar.scss
+++ b/src/client/views/DocumentButtonBar.scss
@@ -50,10 +50,13 @@ $linkGap : 3px;
 }
 
 .documentButtonBar-button {
-    pointer-events: auto;
-    padding-right: 5px;
-    width: 25px;
-    height: 25px;
+    cursor: pointer;
+    display: flex;
+    width: 30px;
+    height: 30px;
+    align-content: center;
+    justify-content: center;
+    align-items: center;
 }
 
 .documentButtonBar-linker {
diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss
index 1715f35e7..952d8d150 100644
--- a/src/client/views/DocumentDecorations.scss
+++ b/src/client/views/DocumentDecorations.scss
@@ -263,7 +263,6 @@ $linkGap : 3px;
 }
 
 .link-button-container {
-    padding: $linkGap;
     border-radius: 10px;
     width: max-content;
     height: auto;
@@ -271,6 +270,9 @@ $linkGap : 3px;
     flex-direction: row;
     z-index: 998;
     position: absolute;
+    justify-content: center;
+    align-items: center;
+    gap: 5px;
     background: $medium-gray;
 }
 
diff --git a/src/client/views/collections/TabDocView.tsx b/src/client/views/collections/TabDocView.tsx
index d82810652..a24f1eb7a 100644
--- a/src/client/views/collections/TabDocView.tsx
+++ b/src/client/views/collections/TabDocView.tsx
@@ -169,7 +169,12 @@ export class TabDocView extends React.Component<TabDocViewProps> {
                 }));
 
             //attach the selection doc buttons menu to the drag handle
-            const stack = tab.contentItem.parent;
+            const stack: HTMLDivElement = tab.contentItem.parent;
+            const header: HTMLDivElement = tab;
+            console.log("Stack: " + stack.id, stack.className)
+            stack.onscroll = action((e: any) => {
+                console.log('scrolling...')
+            })
             const moreInfoDrag = document.createElement("div");
             moreInfoDrag.className = "lm_iconWrap";
             tab._disposers.buttonDisposer = reaction(() => this.view, view =>
diff --git a/src/client/views/nodes/DocumentLinksButton.scss b/src/client/views/nodes/DocumentLinksButton.scss
index 3809319d7..9bab72d55 100644
--- a/src/client/views/nodes/DocumentLinksButton.scss
+++ b/src/client/views/nodes/DocumentLinksButton.scss
@@ -1,6 +1,16 @@
 @import "../global/globalCssVariables.scss";
 
 
+.documentLinksButton-menu {
+    width: 100%;
+    height: 100%;
+    position: relative;
+    display: flex;
+    align-content: center;
+    justify-content: center;
+    align-items: center;
+}
+
 .documentLinksButton-cont {
     min-width: 20;
     min-height: 20;
@@ -10,8 +20,8 @@
 .documentLinksButton,
 .documentLinksButton-endLink,
 .documentLinksButton-startLink {
-    height: 20px;
-    width: 20px;
+    height: 25px;
+    width: 25px;
     position: absolute;
     border-radius: 50%;
     opacity: 0.9;
@@ -38,7 +48,6 @@
     font-weight: bold;
 
     &:hover {
-        background: $medium-gray;
         transform: scale(1.05);
         cursor: pointer;
     }
diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx
index ed0e2d1ad..cec06d2d4 100644
--- a/src/client/views/nodes/DocumentLinksButton.tsx
+++ b/src/client/views/nodes/DocumentLinksButton.tsx
@@ -252,49 +252,50 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
         const btnDim = this.props.InMenu ? "20px" : "30px";
         const link = <img style={{ width: "22px", height: "16px" }} src={`/assets/${"link.png"}`} />;
 
-        return <div className="documentLinksButton-cont" ref={this._linkButton}
-            style={{ left: this.props.Offset?.[0], top: this.props.Offset?.[1], right: this.props.Offset?.[2], bottom: this.props.Offset?.[3] }}
-        >
-            <div className={"documentLinksButton"}
-                onPointerDown={this.onLinkButtonDown} onClick={this.onLinkClick}
-                style={{
-                    backgroundColor: this.props.InMenu ? "" : Colors.LIGHT_BLUE,
-                    color: this.props.InMenu ? Colors.WHITE : "black",
-                    width: btnDim,
-                    height: btnDim,
-                }} >
-                {this.props.InMenu ?
-                    this.props.StartLink ?
-                        <FontAwesomeIcon className="documentdecorations-icon" icon="link" size="sm" />
-                        : link
-                    : Array.from(this.filteredLinks).length}
-            </div>
-            {this.props.InMenu && !this.props.StartLink && DocumentLinksButton.StartLink !== this.props.View.props.Document ? //if the origin node is not this node
-                <div className={"documentLinksButton-endLink"}
+        return (!this.props.InMenu ?
+            <div className="documentLinksButton-cont" ref={this._linkButton}
+                style={{ left: this.props.Offset?.[0], top: this.props.Offset?.[1], right: this.props.Offset?.[2], bottom: this.props.Offset?.[3] }}
+            >
+                <div className={"documentLinksButton"}
+                    onPointerDown={this.onLinkButtonDown} onClick={this.onLinkClick}
                     style={{
-                        width: btnDim, height: btnDim,
-                        backgroundColor: DocumentLinksButton.StartLink ? "" : Colors.LIGHT_GRAY,
-                        opacity: DocumentLinksButton.StartLink ? "" : "50%",
-                        border: DocumentLinksButton.StartLink ? "" : "none",
-                        cursor: DocumentLinksButton.StartLink ? "pointer" : "default"
-                    }}
-                    onPointerDown={DocumentLinksButton.StartLink && this.completeLink}
-                    onClick={e => DocumentLinksButton.StartLink && DocumentLinksButton.finishLinkClick(e.clientX, e.clientY, DocumentLinksButton.StartLink, this.props.View.props.Document, true, this.props.View)}>
-                    {this.props.StartLink ?
-                        <FontAwesomeIcon className="documentdecorations-icon" icon="link" size="sm" />
-                        : link}
-                </div>
-                : (null)
-            }
-            {DocumentLinksButton.StartLink === this.props.View.props.Document && this.props.InMenu && this.props.StartLink ? //if link has been started from current node, then set behavior of link button to deactivate linking when clicked again
-                <div className={"documentLinksButton-startLink"} onPointerDown={this.clearLinks} onClick={this.clearLinks} style={{ width: btnDim, height: btnDim }}>
-                    {this.props.StartLink ?
-                        <FontAwesomeIcon className="documentdecorations-icon" icon="link" size="sm" />
-                        : link}
+                        backgroundColor: Colors.LIGHT_BLUE,
+                        color: Colors.BLACK,
+                        width: btnDim,
+                        height: btnDim,
+                    }}>
+                    {Array.from(this.filteredLinks).length}
                 </div>
-                : (null)
-            }
-        </div >;
+            </div>
+            :
+            <div className="documentLinksButton-menu">
+                {this.props.InMenu && !this.props.StartLink && DocumentLinksButton.StartLink !== this.props.View.props.Document ? //if the origin node is not this node
+                    <div className={"documentLinksButton-endLink"}
+                        style={{
+                            width: btnDim, height: btnDim,
+                            backgroundColor: DocumentLinksButton.StartLink ? "" : Colors.LIGHT_GRAY,
+                            opacity: DocumentLinksButton.StartLink ? "" : "50%",
+                            border: DocumentLinksButton.StartLink ? "" : "none",
+                            cursor: DocumentLinksButton.StartLink ? "pointer" : "default"
+                        }}
+                        onPointerDown={DocumentLinksButton.StartLink && this.completeLink}
+                        onClick={e => DocumentLinksButton.StartLink && DocumentLinksButton.finishLinkClick(e.clientX, e.clientY, DocumentLinksButton.StartLink, this.props.View.props.Document, true, this.props.View)}>
+                        {this.props.StartLink ?
+                            <FontAwesomeIcon className="documentdecorations-icon" icon="link" size="sm" />
+                            : link}
+                    </div>
+                    : (null)
+                }
+                {
+                    this.props.InMenu ? //if link has been started from current node, then set behavior of link button to deactivate linking when clicked again
+                        <div className={'documentLinksButton' + (DocumentLinksButton.StartLink === this.props.View.props.Document && this.props.StartLink) ? '-startLink' : ''} onPointerDown={this.clearLinks} onClick={this.clearLinks} style={{ width: btnDim, height: btnDim }}>
+                            {this.props.StartLink ?
+                                <FontAwesomeIcon className="documentdecorations-icon" icon="link" size="sm" />
+                                : link}
+                        </div>
+                        : (null)}
+            </div>
+        )
     }
 
     render() {
diff --git a/src/client/views/nodes/DocumentView.scss b/src/client/views/nodes/DocumentView.scss
index 281f25fb3..7f164ca48 100644
--- a/src/client/views/nodes/DocumentView.scss
+++ b/src/client/views/nodes/DocumentView.scss
@@ -147,7 +147,7 @@
         .documentView-titleWrapper,
         .documentView-titleWrapper-hover {
             overflow: hidden;
-            color: gray;
+            color: $black;
             transform-origin: top left;
             top: 0;
             width: 100%;
diff --git a/src/client/views/topbar/TopBar.scss b/src/client/views/topbar/TopBar.scss
index adb968948..ebdf030e7 100644
--- a/src/client/views/topbar/TopBar.scss
+++ b/src/client/views/topbar/TopBar.scss
@@ -58,8 +58,8 @@
 
                 .topbar-dashSelect {
                     border: none;
-                    background-color: transparent;
-                    color: black;
+                    background-color: $dark-gray;
+                    color: $white;
                     font-family: 'Roboto';
                     font-size: 17;
                     font-weight: 500;
@@ -78,6 +78,7 @@
             display: flex;
             justify-content: flex-end;
             gap: 5px;
+            margin-right: 5px;
         }
 
         .topbar-left {
@@ -89,6 +90,10 @@
             width: 450;
             gap: 5px;
 
+            .topBar-icon:hover {
+                background-color: $logout-red;
+            }
+
             .topbar-lozenge-user,
             .topbar-lozenge {
                 height: 23;
@@ -99,7 +104,6 @@
                 padding: 4px;
                 align-self: center;
                 margin-left: 7px;
-                margin-right: 7px;
                 display: flex;
                 align-items: center;
 
diff --git a/src/client/views/topbar/TopBar.tsx b/src/client/views/topbar/TopBar.tsx
index 6e4d4fe15..bd9935333 100644
--- a/src/client/views/topbar/TopBar.tsx
+++ b/src/client/views/topbar/TopBar.tsx
@@ -29,7 +29,7 @@ export class TopBar extends React.Component {
                             {`${Doc.CurrentUserEmail}`}
                         </div>
                         <div className="topbar-icon" onClick={() => window.location.assign(Utils.prepend("/logout"))}>
-                            {"Logoff"}<FontAwesomeIcon icon="sign-out"></FontAwesomeIcon>
+                            {"Sign out"}
                         </div>
                     </div>
                     <div className="topbar-center" >
-- 
cgit v1.2.3-70-g09d2


From d3a7e378e26466b911733f76addfe9fc61a689df Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Sat, 31 Jul 2021 18:17:35 -0400
Subject: fixed linking issues with dragging & updating linking UI

---
 src/client/views/DocumentButtonBar.scss            |  21 +++++
 src/client/views/DocumentButtonBar.tsx             |  26 +++---
 src/client/views/DocumentDecorations.scss          |   2 +-
 .../views/collections/CollectionLinearView.scss    |   8 +-
 src/client/views/global/globalCssVariables.scss    |   2 +-
 src/client/views/nodes/DocumentLinksButton.scss    |  38 ++++++--
 src/client/views/nodes/DocumentLinksButton.tsx     | 102 ++++++++++-----------
 src/client/views/topbar/TopBar.scss                |   3 +-
 src/client/views/topbar/TopBar.tsx                 |   1 -
 9 files changed, 119 insertions(+), 84 deletions(-)

(limited to 'src')

diff --git a/src/client/views/DocumentButtonBar.scss b/src/client/views/DocumentButtonBar.scss
index 157f3a4f2..171e7134f 100644
--- a/src/client/views/DocumentButtonBar.scss
+++ b/src/client/views/DocumentButtonBar.scss
@@ -59,6 +59,7 @@ $linkGap : 3px;
     align-items: center;
 }
 
+// depracated (now use .documentButtonBar-icon) for standard buttons
 .documentButtonBar-linker {
     height: 20px;
     width: 20px;
@@ -74,6 +75,26 @@ $linkGap : 3px;
     }
 }
 
+.documentButtonBar-icon {
+    height: 80%;
+    width: 80%;
+    font-size: 100%;
+    text-align: center;
+    border-radius: 50%;
+    pointer-events: auto;
+    background-color: $dark-gray;
+    border: none;
+    transition: 0.2s ease all;
+    display: flex;
+    align-content: center;
+    justify-content: center;
+    align-items: center;
+
+    &:hover {
+        background-color: $black;
+    }
+}
+
 .documentButtonBar-linker:hover {
     cursor: pointer;
     transform: scale(1.05);
diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx
index 1e5380971..df1e6899d 100644
--- a/src/client/views/DocumentButtonBar.tsx
+++ b/src/client/views/DocumentButtonBar.tsx
@@ -110,7 +110,7 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
         const animation = this.isAnimatingPulse ? "shadow-pulse 1s linear infinite" : "none";
         return !targetDoc ? (null) : <Tooltip title={<><div className="dash-tooltip">{`${published ? "Push" : "Publish"} to Google Docs`}</div></>}>
             <div
-                className="documentButtonBar-linker"
+                className="documentButtonBar-button"
                 style={{ animation }}
                 onClick={async () => {
                     await GoogleAuthenticationManager.Instance.fetchOrGenerateAccessToken();
@@ -139,7 +139,7 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
 
         return !targetDoc || !dataDoc || !dataDoc[GoogleRef] ? (null) : <Tooltip
             title={<><div className="dash-tooltip">{title}</div></>}>
-            <div className="documentButtonBar-linker"
+            <div className="documentButtonBar-button"
                 style={{ backgroundColor: this.pullColor }}
                 onPointerEnter={action(e => {
                     if (e.altKey) {
@@ -188,8 +188,8 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
         const targetDoc = this.view0?.props.Document;
         return !targetDoc ? (null) : <Tooltip title={
             <div className="dash-tooltip">{"follow primary link on click"}</div>}>
-            <div className="documentButtonBar-linker"
-                style={{ color: targetDoc.isLinkButton ? "black" : "white", backgroundColor: targetDoc.isLinkButton ? "white" : "black" }}
+            <div className="documentButtonBar-icon"
+                style={{ color: targetDoc.isLinkButton ? "black" : "white" }}
                 onClick={undoBatch(e => this.props.views().map(view => view?.docView?.toggleFollowLink(undefined, false, false)))}>
                 <FontAwesomeIcon className="documentdecorations-icon" size="sm" icon="hand-point-right" />
             </div>
@@ -200,7 +200,7 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
         const targetDoc = this.view0?.props.Document;
         return !targetDoc ? (null) : <Tooltip title={
             <div className="dash-tooltip">{SelectionManager.Views().length > 1 ? "Pin multiple documents to presentation" : "Pin to presentation"}</div>}>
-            <div className="documentButtonBar-linker"
+            <div className="documentButtonBar-icon"
                 style={{ color: "white" }}
                 onClick={undoBatch(e => this.props.views().map(view => view && TabDocView.PinDoc(view.props.Document, { setPosition: e.shiftKey ? true : undefined })))}>
                 <FontAwesomeIcon className="documentdecorations-icon" size="sm" icon="map-pin" />
@@ -243,7 +243,7 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
         const presPinWithViewIcon = <img src="/assets/pinWithView.png" style={{ margin: "auto", width: 17, transform: 'translate(0, 1px)' }} />;
         const targetDoc = this.view0?.props.Document;
         return !targetDoc ? (null) : <Tooltip title={<><div className="dash-tooltip">{"Pin with current view"}</div></>}>
-            <div className="documentButtonBar-linker" onClick={() => this.pinWithView(targetDoc)}>
+            <div className="documentButtonBar-icon" onClick={() => this.pinWithView(targetDoc)}>
                 {presPinWithViewIcon}
             </div>
         </Tooltip>;
@@ -253,8 +253,8 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
     get shareButton() {
         const targetDoc = this.view0?.props.Document;
         return !targetDoc ? (null) : <Tooltip title={<><div className="dash-tooltip">{"Open Sharing Manager"}</div></>}>
-            <div className="documentButtonBar-linker" style={{ color: "white" }} onClick={e => SharingManager.Instance.open(this.view0, targetDoc)}>
-                <FontAwesomeIcon className="documentdecorations-icon" size="sm" icon="users" />
+            <div className="documentButtonBar-icon" style={{ color: "white" }} onClick={e => SharingManager.Instance.open(this.view0, targetDoc)}>
+                <FontAwesomeIcon className="documentdecorations-icon" icon="users" />
             </div></Tooltip >;
     }
 
@@ -262,8 +262,8 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
     get menuButton() {
         const targetDoc = this.view0?.props.Document;
         return !targetDoc ? (null) : <Tooltip title={<><div className="dash-tooltip">{`Open Context Menu`}</div></>}>
-            <div className="documentButtonBar-linker" style={{ color: "white", cursor: "pointer" }} onClick={e => this.openContextMenu(e)}>
-                <FontAwesomeIcon className="documentdecorations-icon" size="sm" icon="bars" />
+            <div className="documentButtonBar-icon" style={{ color: "white", cursor: "pointer" }} onClick={e => this.openContextMenu(e)}>
+                <FontAwesomeIcon className="documentdecorations-icon" icon="bars" />
             </div></Tooltip >;
     }
 
@@ -271,9 +271,9 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
     get moreButton() {
         const targetDoc = this.view0?.props.Document;
         return !targetDoc ? (null) : <Tooltip title={<><div className="dash-tooltip">{`${CurrentUserUtils.propertiesWidth > 0 ? "Close" : "Open"} Properties Panel`}</div></>}>
-            <div className="documentButtonBar-linker" style={{ color: "white", cursor: "e-resize" }} onClick={action(e =>
+            <div className="documentButtonBar-icon" style={{ color: "white", cursor: "e-resize" }} onClick={action(e =>
                 CurrentUserUtils.propertiesWidth = CurrentUserUtils.propertiesWidth > 0 ? 0 : 250)}>
-                <FontAwesomeIcon className="documentdecorations-icon" size="sm" icon="ellipsis-h"
+                <FontAwesomeIcon className="documentdecorations-icon" icon="ellipsis-h"
                 />
             </div></Tooltip >;
     }
@@ -286,7 +286,7 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
                 <Flyout anchorPoint={anchorPoints.LEFT_TOP}
                     content={<MetadataEntryMenu docs={this.props.views().filter(dv => dv).map(dv => dv!.props.Document)} suggestWithFunction />  /* tfs: @bcz This might need to be the data document? */}>
                     <div className={"documentButtonBar-linkButton-" + "empty"} onPointerDown={e => e.stopPropagation()} >
-                        {<FontAwesomeIcon className="documentdecorations-icon" icon="tag" size="sm" />}
+                        {<FontAwesomeIcon className="documentdecorations-icon" icon="tag" />}
                     </div>
                 </Flyout>
             </div></Tooltip>;
diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss
index 952d8d150..316f63240 100644
--- a/src/client/views/DocumentDecorations.scss
+++ b/src/client/views/DocumentDecorations.scss
@@ -336,7 +336,7 @@ $linkGap : 3px;
 }
 
 .documentdecorations-icon {
-    margin-top: 3px;
+    margin: 0px;
 }
 .templating-button,
 .docDecs-tagButton {
diff --git a/src/client/views/collections/CollectionLinearView.scss b/src/client/views/collections/CollectionLinearView.scss
index 86610ac20..913a65774 100644
--- a/src/client/views/collections/CollectionLinearView.scss
+++ b/src/client/views/collections/CollectionLinearView.scss
@@ -20,7 +20,7 @@
         }
 
         .bottomPopup-background {
-            background: $light-blue;
+            background: $medium-blue;
             display: flex;
             height: 35;
             transform: translate3d(6px, 0px, 0px);
@@ -30,7 +30,7 @@
         }
 
         .bottomPopup-text {
-            color: black;
+            color: $white;
             display: inline;
             white-space: nowrap;
             padding-left: 8px;
@@ -45,7 +45,7 @@
             padding-left: 8px;
             padding-right: 8px;
             vertical-align: middle;
-            background-color: #efefef;
+            background-color: $light-gray;
             border-radius: 3px;
             color: black;
             margin-right: 5px;
@@ -58,7 +58,7 @@
             padding-left: 8px;
             padding-right: 8px;
             vertical-align: middle;
-            background-color: #f3b6b6;
+            background-color: $close-red;
             border-radius: 3px;
             color: black;
         }
diff --git a/src/client/views/global/globalCssVariables.scss b/src/client/views/global/globalCssVariables.scss
index a9f33c4da..1b881ba43 100644
--- a/src/client/views/global/globalCssVariables.scss
+++ b/src/client/views/global/globalCssVariables.scss
@@ -11,7 +11,7 @@ $medium-blue: #4476F7;
 $pink: #E0217D;
 $yellow: #F5D747;
 
-$logout-red: #ca4444;
+$close-red: #e48282;
 
 $drop-shadow: "#32323215";
 
diff --git a/src/client/views/nodes/DocumentLinksButton.scss b/src/client/views/nodes/DocumentLinksButton.scss
index 9bab72d55..b37b68249 100644
--- a/src/client/views/nodes/DocumentLinksButton.scss
+++ b/src/client/views/nodes/DocumentLinksButton.scss
@@ -44,25 +44,43 @@
 }
 
 .documentLinksButton {
-    background-color: black;
+    background-color: $dark-gray;
+    color: $white;
     font-weight: bold;
+    width: 80%;
+    height: 80%;
+    font-size: 100%;
+    transition: 0.2s ease all;
 
     &:hover {
-        transform: scale(1.05);
-        cursor: pointer;
+        background-color: $black;
+    }
+}
+
+.documentLinksButton.startLink {
+    background-color: $medium-blue;
+    color: $white;
+    font-weight: bold;
+    width: 80%;
+    height: 80%;
+    font-size: 100%;
+    transition: 0.2s ease all;
+
+    &:hover {
+        background-color: $black;
     }
 }
 
 .documentLinksButton-endLink {
     border: $medium-blue 2px dashed;
     color: $medium-blue;
+    background-color: none !important;
+    width: 80%;
+    height: 80%;
+    font-size: 100%;
+    transition: 0.2s ease all;
+
     &:hover {
-        background: $light-gray;
-        transform: scale(1.05);
-        cursor: pointer;
+        background-color: $light-blue;
     }
-}
-
-.documentLinksButton-startLink {
-    background-color: $medium-blue;
 }
\ No newline at end of file
diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx
index cec06d2d4..482f551b5 100644
--- a/src/client/views/nodes/DocumentLinksButton.tsx
+++ b/src/client/views/nodes/DocumentLinksButton.tsx
@@ -68,6 +68,40 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
         return false;
     }
 
+    onLinkMenuOpen = (e: React.PointerEvent): void => {
+        setupMoveUpEvents(this, e, this.onLinkButtonMoved, emptyFunction, action((e, doubleTap) => {
+            if (doubleTap) {
+                const rootDoc = this.props.View.rootDoc;
+                const docid = Doc.CurrentUserEmail + Doc.GetProto(rootDoc)[Id] + "-pivotish";
+                DocServer.GetRefField(docid).then(async docx => {
+                    const rootAlias = () => {
+                        const rootAlias = Doc.MakeAlias(rootDoc);
+                        rootAlias.x = rootAlias.y = 0;
+                        return rootAlias;
+                    };
+                    let wid = rootDoc[WidthSym]();
+                    const target = ((docx instanceof Doc) && docx) || Docs.Create.FreeformDocument([rootAlias()], { title: this.props.View.Document.title + "-pivot", _width: 500, _height: 500, }, docid);
+                    const docs = await DocListCastAsync(Doc.GetProto(target).data);
+                    if (!target.pivotFocusish) (Doc.GetProto(target).pivotFocusish = target);
+                    DocListCast(rootDoc.links).forEach(link => {
+                        const other = LinkManager.getOppositeAnchor(link, rootDoc);
+                        const otherdoc = !other ? undefined : other.annotationOn ? Cast(other.annotationOn, Doc, null) : other;
+                        if (otherdoc && !docs?.some(d => Doc.AreProtosEqual(d, otherdoc))) {
+                            const alias = Doc.MakeAlias(otherdoc);
+                            alias.x = wid;
+                            alias.y = 0;
+                            alias._lockedPosition = false;
+                            wid += otherdoc[WidthSym]();
+                            Doc.AddDocToList(Doc.GetProto(target), "data", alias);
+                        }
+                    });
+                    LightboxView.SetLightboxDoc(target);
+                });
+            }
+            else DocumentLinksButton.LinkEditorDocView = this.props.View;
+        }));
+    }
+
     @undoBatch
     onLinkButtonDown = (e: React.PointerEvent): void => {
         setupMoveUpEvents(this, e, this.onLinkButtonMoved, emptyFunction, action((e, doubleTap) => {
@@ -80,37 +114,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
                     DocumentLinksButton.StartLink = this.props.View.props.Document;
                     DocumentLinksButton.StartLinkView = this.props.View;
                 }
-            } else if (!this.props.InMenu) {
-                if (doubleTap) {
-                    const rootDoc = this.props.View.rootDoc;
-                    const docid = Doc.CurrentUserEmail + Doc.GetProto(rootDoc)[Id] + "-pivotish";
-                    DocServer.GetRefField(docid).then(async docx => {
-                        const rootAlias = () => {
-                            const rootAlias = Doc.MakeAlias(rootDoc);
-                            rootAlias.x = rootAlias.y = 0;
-                            return rootAlias;
-                        };
-                        let wid = rootDoc[WidthSym]();
-                        const target = ((docx instanceof Doc) && docx) || Docs.Create.FreeformDocument([rootAlias()], { title: this.props.View.Document.title + "-pivot", _width: 500, _height: 500, }, docid);
-                        const docs = await DocListCastAsync(Doc.GetProto(target).data);
-                        if (!target.pivotFocusish) (Doc.GetProto(target).pivotFocusish = target);
-                        DocListCast(rootDoc.links).forEach(link => {
-                            const other = LinkManager.getOppositeAnchor(link, rootDoc);
-                            const otherdoc = !other ? undefined : other.annotationOn ? Cast(other.annotationOn, Doc, null) : other;
-                            if (otherdoc && !docs?.some(d => Doc.AreProtosEqual(d, otherdoc))) {
-                                const alias = Doc.MakeAlias(otherdoc);
-                                alias.x = wid;
-                                alias.y = 0;
-                                alias._lockedPosition = false;
-                                wid += otherdoc[WidthSym]();
-                                Doc.AddDocToList(Doc.GetProto(target), "data", alias);
-                            }
-                        });
-                        LightboxView.SetLightboxDoc(target);
-                    });
-                }
-                else DocumentLinksButton.LinkEditorDocView = this.props.View;
-            }
+            };
         }));
     }
 
@@ -126,7 +130,6 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
                 DocumentLinksButton.StartLink = this.props.View.props.Document;
                 DocumentLinksButton.StartLinkView = this.props.View;
             }
-
             //action(() => Doc.BrushDoc(this.props.View.Document));
         } else if (!this.props.InMenu) {
             DocumentLinksButton.LinkEditorDocView = this.props.View;
@@ -247,17 +250,19 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
 
     /**
      * gets the JSX of the link button (btn used to start/complete links) OR the link-view button (btn on bottom left of each linked node)
+     * 
+     * todo:glr / anh seperate functionality such as onClick onPointerDown of link menu button
      */
     @computed get linkButtonInner() {
-        const btnDim = this.props.InMenu ? "20px" : "30px";
+        const btnDim = "30px";
         const link = <img style={{ width: "22px", height: "16px" }} src={`/assets/${"link.png"}`} />;
-
+        const isActive = (DocumentLinksButton.StartLink === this.props.View.props.Document) && this.props.StartLink;
         return (!this.props.InMenu ?
-            <div className="documentLinksButton-cont" ref={this._linkButton}
+            <div className="documentLinksButton-cont"
                 style={{ left: this.props.Offset?.[0], top: this.props.Offset?.[1], right: this.props.Offset?.[2], bottom: this.props.Offset?.[3] }}
             >
                 <div className={"documentLinksButton"}
-                    onPointerDown={this.onLinkButtonDown} onClick={this.onLinkClick}
+                    onPointerDown={this.onLinkMenuOpen} onClick={this.onLinkClick}
                     style={{
                         backgroundColor: Colors.LIGHT_BLUE,
                         color: Colors.BLACK,
@@ -268,32 +273,23 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
                 </div>
             </div>
             :
-            <div className="documentLinksButton-menu">
+            <div className="documentLinksButton-menu" ref={this._linkButton}>
                 {this.props.InMenu && !this.props.StartLink && DocumentLinksButton.StartLink !== this.props.View.props.Document ? //if the origin node is not this node
                     <div className={"documentLinksButton-endLink"}
-                        style={{
-                            width: btnDim, height: btnDim,
-                            backgroundColor: DocumentLinksButton.StartLink ? "" : Colors.LIGHT_GRAY,
-                            opacity: DocumentLinksButton.StartLink ? "" : "50%",
-                            border: DocumentLinksButton.StartLink ? "" : "none",
-                            cursor: DocumentLinksButton.StartLink ? "pointer" : "default"
-                        }}
                         onPointerDown={DocumentLinksButton.StartLink && this.completeLink}
                         onClick={e => DocumentLinksButton.StartLink && DocumentLinksButton.finishLinkClick(e.clientX, e.clientY, DocumentLinksButton.StartLink, this.props.View.props.Document, true, this.props.View)}>
-                        {this.props.StartLink ?
-                            <FontAwesomeIcon className="documentdecorations-icon" icon="link" size="sm" />
-                            : link}
+                        <FontAwesomeIcon className="documentdecorations-icon" icon="link" />
                     </div>
                     : (null)
                 }
                 {
-                    this.props.InMenu ? //if link has been started from current node, then set behavior of link button to deactivate linking when clicked again
-                        <div className={'documentLinksButton' + (DocumentLinksButton.StartLink === this.props.View.props.Document && this.props.StartLink) ? '-startLink' : ''} onPointerDown={this.clearLinks} onClick={this.clearLinks} style={{ width: btnDim, height: btnDim }}>
-                            {this.props.StartLink ?
-                                <FontAwesomeIcon className="documentdecorations-icon" icon="link" size="sm" />
-                                : link}
+                    this.props.InMenu && this.props.StartLink ? //if link has been started from current node, then set behavior of link button to deactivate linking when clicked again
+                        <div className={`documentLinksButton ${isActive ? `startLink` : ``}`} onPointerDown={isActive ? undefined : this.onLinkButtonDown} onClick={isActive ? this.clearLinks : this.onLinkClick}>
+                            <FontAwesomeIcon className="documentdecorations-icon" icon="link" />
                         </div>
-                        : (null)}
+                        :
+                        (null)
+                }
             </div>
         )
     }
diff --git a/src/client/views/topbar/TopBar.scss b/src/client/views/topbar/TopBar.scss
index ebdf030e7..ac6ec9b30 100644
--- a/src/client/views/topbar/TopBar.scss
+++ b/src/client/views/topbar/TopBar.scss
@@ -23,6 +23,7 @@
         .topBar-icon {
             cursor: pointer;
             font-size: 12px;
+            font-family: 'Roboto';
             width: fit-content;
             display: flex;
             justify-content: center;
@@ -91,7 +92,7 @@
             gap: 5px;
 
             .topBar-icon:hover {
-                background-color: $logout-red;
+                background-color: $close-red;
             }
 
             .topbar-lozenge-user,
diff --git a/src/client/views/topbar/TopBar.tsx b/src/client/views/topbar/TopBar.tsx
index bd9935333..05edb975c 100644
--- a/src/client/views/topbar/TopBar.tsx
+++ b/src/client/views/topbar/TopBar.tsx
@@ -12,7 +12,6 @@ import { Borders, Colors } from "../global/globalEnums";
 import "./TopBar.scss";
 
 /**
- * REACT TYPE: FUNCTIONAL
  * ABOUT: This is the topbar in Dash, which included the current Dashboard as well as access to information on the user
  * and settings and help buttons. Future scope for this bar is to include the collaborators that are on the same Dashboard. 
  */
-- 
cgit v1.2.3-70-g09d2


From b1361eec6d3f554d4927931c339b5c169b9a54a7 Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Sat, 31 Jul 2021 22:23:55 -0400
Subject: mini css changes

---
 src/client/views/DocumentButtonBar.scss | 1 -
 src/client/views/topbar/TopBar.scss     | 9 ++++++---
 2 files changed, 6 insertions(+), 4 deletions(-)

(limited to 'src')

diff --git a/src/client/views/DocumentButtonBar.scss b/src/client/views/DocumentButtonBar.scss
index 171e7134f..a112f4745 100644
--- a/src/client/views/DocumentButtonBar.scss
+++ b/src/client/views/DocumentButtonBar.scss
@@ -46,7 +46,6 @@ $linkGap : 3px;
 .documentButtonBar {
     display: flex;
     flex-direction: row;
-    gap: 3px;
 }
 
 .documentButtonBar-button {
diff --git a/src/client/views/topbar/TopBar.scss b/src/client/views/topbar/TopBar.scss
index ac6ec9b30..164cc29cd 100644
--- a/src/client/views/topbar/TopBar.scss
+++ b/src/client/views/topbar/TopBar.scss
@@ -50,12 +50,15 @@
             align-items: center;
             gap: 5px;
 
+            .topbar-dashboards {
+                display: flex;
+                flex-direction: row;
+            }
+
             .topbar-lozenge-dashboard {
                 display: flex;
 
-                .topbar-dashboards {
-                    display: inline-flex;
-                }
+                    
 
                 .topbar-dashSelect {
                     border: none;
-- 
cgit v1.2.3-70-g09d2


From f59495f0aa5ba65b358f9430f55c653ed0fc3d70 Mon Sep 17 00:00:00 2001
From: Aubrey-Li <63608597+Aubrey-Li@users.noreply.github.com>
Date: Sat, 31 Jul 2021 22:26:48 -0700
Subject: small UI changes

---
 src/client/views/global/globalCssVariables.scss | 22 +++++++++++-----------
 src/client/views/nodes/DocumentView.tsx         |  4 ++--
 2 files changed, 13 insertions(+), 13 deletions(-)

(limited to 'src')

diff --git a/src/client/views/global/globalCssVariables.scss b/src/client/views/global/globalCssVariables.scss
index 1b881ba43..7556f8b8a 100644
--- a/src/client/views/global/globalCssVariables.scss
+++ b/src/client/views/global/globalCssVariables.scss
@@ -1,15 +1,15 @@
-@import url("https://fonts.googleapis.com/css?family=Noto+Sans:400,700|Crimson+Text:400,400i,700");
+@import url("https://fonts.googleapis.com/css2?family=Roboto&display=swap");
 // colors
 $white: #ffffff;
-$light-gray:#dfdfdf;
-$medium-gray: #9F9F9F;
+$light-gray: #dfdfdf;
+$medium-gray: #9f9f9f;
 $dark-gray: #323232;
 $black: #000000;
 
-$light-blue: #BDDDF5;
-$medium-blue: #4476F7;
-$pink: #E0217D;
-$yellow: #F5D747;
+$light-blue: #bdddf5;
+$medium-blue: #4476f7;
+$pink: #e0217d;
+$yellow: #f5d747;
 
 $close-red: #e48282;
 
@@ -24,7 +24,7 @@ $large-padding: 32px;
 $icon-size: 28px;
 
 // fonts
-$sans-serif: "Noto Sans", sans-serif;
+$sans-serif: "Roboto", sans-serif;
 $large-header: 16px;
 $body-text: 12px;
 $small-text: 9px;
@@ -41,7 +41,7 @@ $contextMenu-zindex: 100000; // context menu shows up over everything
 $radialMenu-zindex: 100000; // context menu shows up over everything
 
 // borders
-$standard-border: solid 1px #9F9F9F;
+$standard-border: solid 1px #9f9f9f;
 
 $searchpanel-height: 32px;
 $mainTextInput-zindex: 999; // then text input overlay so that it's context menu will appear over decorations, etc
@@ -49,7 +49,7 @@ $docDecorations-zindex: 998; // then doc decorations appear over everything else
 $remoteCursors-zindex: 997; // ... not sure what level the remote cursors should go -- is this right?
 $COLLECTION_BORDER_WIDTH: 0;
 $SCHEMA_DIVIDER_WIDTH: 4;
-$MINIMIZED_ICON_SIZE:24;
+$MINIMIZED_ICON_SIZE: 24;
 $MAX_ROW_HEIGHT: 44px;
 $DFLT_IMAGE_NATIVE_DIM: 900px;
 $MENU_PANEL_WIDTH: 60px;
@@ -67,4 +67,4 @@ $TREE_BULLET_WIDTH: 20px;
     DFLT_IMAGE_NATIVE_DIM: $DFLT_IMAGE_NATIVE_DIM;
     MENU_PANEL_WIDTH: $MENU_PANEL_WIDTH;
     TREE_BULLET_WIDTH: $TREE_BULLET_WIDTH;
-}
\ No newline at end of file
+}
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index df4cba01b..97ad37a08 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -971,7 +971,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
         const highlightIndex = this.props.LayoutTemplateString ? (Doc.IsHighlighted(this.props.Document) ? 6 : 0) : Doc.isBrushedHighlightedDegree(this.props.Document); // bcz: Argh!! need to identify a tree view doc better than a LayoutTemlatString
         const highlightColor = (CurrentUserUtils.ActiveDashboard?.darkScheme ?
             ["transparent", "#65350c", "#65350c", "yellow", "magenta", "cyan", "orange"] :
-            ["transparent", "maroon", "maroon", "yellow", "magenta", "cyan", "orange"])[highlightIndex];
+            ["transparent", "#4476F7", "#4476F7", "yellow", "magenta", "cyan", "orange"])[highlightIndex];
         const highlightStyle = ["solid", "dashed", "solid", "solid", "solid", "solid", "solid"][highlightIndex];
         const excludeTypes = !this.props.treeViewDoc ? [DocumentType.FONTICON, DocumentType.INK] : [DocumentType.FONTICON];
         let highlighting = !this.props.disableDocBrushing && highlightIndex && !excludeTypes.includes(this.layoutDoc.type as any) && this.layoutDoc._viewType !== CollectionViewType.Linear;
@@ -979,7 +979,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
 
         const borderPath = this.props.styleProvider?.(this.props.Document, this.props, StyleProp.BorderPath) || { path: undefined };
         const internal = PresBox.EffectsProvider(this.layoutDoc, this.renderDoc) || this.renderDoc;
-        const boxShadow = this.props.treeViewDoc ? undefined : highlighting && this.borderRounding && highlightStyle !== "dashed" ? `0 0 0 ${highlightIndex}px ${highlightColor}` :
+        const boxShadow = this.props.treeViewDoc ? null : highlighting && this.borderRounding && highlightStyle !== "dashed" ? `0 0 0 ${highlightIndex}px ${highlightColor}` :
             this.boxShadow || (this.props.Document.isTemplateForField ? "black 0.2vw 0.2vw 0.8vw" : undefined);
         return <div className={DocumentView.ROOT_DIV} ref={this._mainCont}
             onContextMenu={this.onContextMenu}
-- 
cgit v1.2.3-70-g09d2


From f5bec2e6cd0b5b0d6ca5665260003e9fb7291d4e Mon Sep 17 00:00:00 2001
From: Aubrey-Li <63608597+Aubrey-Li@users.noreply.github.com>
Date: Sat, 31 Jul 2021 22:35:07 -0700
Subject: unified Properties font to Roboto

---
 src/client/views/PropertiesView.scss | 28 +++-------------------------
 1 file changed, 3 insertions(+), 25 deletions(-)

(limited to 'src')

diff --git a/src/client/views/PropertiesView.scss b/src/client/views/PropertiesView.scss
index fa45a065d..934ede732 100644
--- a/src/client/views/PropertiesView.scss
+++ b/src/client/views/PropertiesView.scss
@@ -1,6 +1,6 @@
 .propertiesView {
     height: 100%;
-    font-family: "Noto Sans";
+    font-family: "Roboto";
     cursor: auto;
 
     overflow-x: hidden;
@@ -28,9 +28,7 @@
                 color: grey;
                 cursor: pointer;
             }
-
         }
-
     }
 
     .propertiesView-name {
@@ -80,7 +78,6 @@
             padding-bottom: 10px;
             padding-top: 8px;
         }
-
     }
 
     .propertiesView-sharing {
@@ -140,8 +137,6 @@
                 }
             }
 
-
-
             .change-buttons {
                 display: flex;
 
@@ -216,7 +211,6 @@
         }
     }
 
-
     .propertiesView-appearance {
         //border-bottom: 1px solid black;
         //padding: 8.5px;
@@ -305,7 +299,7 @@
         .notify-button-icon {
             width: 6px;
             height: 6.5px;
-            margin-left: .5px;
+            margin-left: 0.5px;
         }
 
         &:hover {
@@ -331,7 +325,6 @@
     }
 
     .propertiesView-sharingTable {
-
         // whatever's commented out - add it back in when adding the buttons
 
         // border: 1.5px solid black;
@@ -347,7 +340,6 @@
         width: 92%;
 
         .propertiesView-sharingTable-item {
-
             display: flex;
             // padding: 5px;
             padding: 3px;
@@ -421,7 +413,6 @@
                     cursor: pointer;
                 }
             }
-
         }
 
         .propertiesView-fields-checkbox {
@@ -468,7 +459,6 @@
     }
 
     .propertiesView-contexts {
-
         .propertiesView-contexts-title {
             font-weight: bold;
             font-size: 12.5px;
@@ -499,11 +489,9 @@
             overflow: hidden;
             padding: 10px;
         }
-
     }
 
     .propertiesView-layout {
-
         .propertiesView-layout-title {
             font-weight: bold;
             font-size: 12.5px;
@@ -534,7 +522,6 @@
             overflow: hidden;
             padding: 10px;
         }
-
     }
 
     .propertiesView-presTrails {
@@ -576,7 +563,6 @@
 }
 
 .inking-button {
-
     display: flex;
 
     .inking-button-points {
@@ -635,7 +621,6 @@
 }
 
 .inputBox {
-
     margin-top: 10px;
     display: flex;
     height: 19px;
@@ -658,7 +643,6 @@
     }
 
     .inputBox-button {
-
         .inputBox-button-up {
             background-color: #333333;
             height: 9px;
@@ -690,7 +674,6 @@
                 cursor: pointer;
             }
         }
-
     }
 }
 
@@ -767,7 +750,6 @@
 }
 
 .widthAndDash {
-
     .width {
         .width-top {
             display: flex;
@@ -792,13 +774,11 @@
     }
 
     .arrows {
-
         display: flex;
         margin-bottom: 3px;
         margin-left: 4px;
 
         .arrows-head {
-
             display: flex;
             margin-right: 35px;
 
@@ -827,7 +807,6 @@
     }
 
     .dashed {
-
         display: flex;
         margin-left: 64px;
         margin-bottom: 6px;
@@ -856,7 +835,6 @@
     }
 }
 
-
 .properties-flyout {
     grid-column: 2/4;
-}
\ No newline at end of file
+}
-- 
cgit v1.2.3-70-g09d2


From 149b2de414812063bc8c81305f284f74a24481cb Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Sun, 1 Aug 2021 18:45:21 -0400
Subject: small ui tweaks

---
 src/client/util/DragManager.ts                     |  9 +++
 src/client/views/EditableView.scss                 |  8 ++-
 src/client/views/PropertiesView.scss               |  9 ++-
 .../views/collections/CollectionLinearView.scss    |  3 +
 src/client/views/nodes/LinkDescriptionPopup.scss   | 65 ++++++++--------------
 5 files changed, 46 insertions(+), 48 deletions(-)

(limited to 'src')

diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index c4842e88a..5e16de617 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -15,6 +15,15 @@ import { SnappingManager } from "./SnappingManager";
 import { UndoManager } from "./UndoManager";
 
 export type dropActionType = "alias" | "copy" | "move" | "same" | "proto" | "none" | undefined; // undefined = move, "same" = move but don't call removeDropProperties
+
+/**
+ * Initialize drag
+ * @param _reference: The HTMLElement that is being dragged 
+ * @param docFunc: The Dash document being moved
+ * @param moveFunc: The function called when the document is moved
+ * @param dropAction: What to do with the document when it is dropped
+ * @param dragStarted: Method to call when the drag is started
+ */
 export function SetupDrag(
     _reference: React.RefObject<HTMLElement>,
     docFunc: () => Doc | Promise<Doc> | undefined,
diff --git a/src/client/views/EditableView.scss b/src/client/views/EditableView.scss
index 5dc0c1962..1aebedf2e 100644
--- a/src/client/views/EditableView.scss
+++ b/src/client/views/EditableView.scss
@@ -26,4 +26,10 @@
     width: 100%;
     background: inherit;
     pointer-events: all;
-}
\ No newline at end of file
+}
+
+.editableView-input:focus {
+    border: none;
+    outline: none;
+}
+ 
\ No newline at end of file
diff --git a/src/client/views/PropertiesView.scss b/src/client/views/PropertiesView.scss
index 934ede732..321b83f52 100644
--- a/src/client/views/PropertiesView.scss
+++ b/src/client/views/PropertiesView.scss
@@ -1,3 +1,5 @@
+@import "./global/globalCssVariables.scss";
+
 .propertiesView {
     height: 100%;
     font-family: "Roboto";
@@ -823,15 +825,12 @@
 }
 
 .editable-title {
-    border: none;
     padding: 6px;
     padding-bottom: 2px;
-    background: #eeeeee;
-    border-top: 1px solid;
-    border-left: 1px solid;
+    border: solid 1px $dark-gray;
 
     &:hover {
-        border: 0.75px solid rgb(122, 28, 28);
+        border: 0.75px solid $medium-blue;
     }
 }
 
diff --git a/src/client/views/collections/CollectionLinearView.scss b/src/client/views/collections/CollectionLinearView.scss
index 913a65774..46e40489b 100644
--- a/src/client/views/collections/CollectionLinearView.scss
+++ b/src/client/views/collections/CollectionLinearView.scss
@@ -22,6 +22,7 @@
         .bottomPopup-background {
             background: $medium-blue;
             display: flex;
+            border-radius: 10px;
             height: 35;
             transform: translate3d(6px, 0px, 0px);
             align-content: center;
@@ -40,6 +41,7 @@
         }
 
         .bottomPopup-descriptions {
+            cursor:pointer;
             display: inline;
             white-space: nowrap;
             padding-left: 8px;
@@ -52,6 +54,7 @@
         }
 
         .bottomPopup-exit {
+            cursor:pointer;
             display: inline;
             white-space: nowrap;
             margin-right: 10px;
diff --git a/src/client/views/nodes/LinkDescriptionPopup.scss b/src/client/views/nodes/LinkDescriptionPopup.scss
index d92823ccc..a8db5d360 100644
--- a/src/client/views/nodes/LinkDescriptionPopup.scss
+++ b/src/client/views/nodes/LinkDescriptionPopup.scss
@@ -1,9 +1,13 @@
+@import "../global/globalCssVariables.scss";
+
 .linkDescriptionPopup {
 
     display: flex;
-
-    border: 1px solid rgb(170, 26, 26);
-
+    flex-direction: row;
+    justify-content: center;
+    align-items: center;
+    border: 2px solid $medium-blue;
+    background-color: $white;
     width: auto;
     position: absolute;
 
@@ -11,17 +15,11 @@
     z-index: 10000;
     border-radius: 10px;
     font-size: 12px;
-    //white-space: nowrap;
-
-    background-color: rgba(250, 250, 250, 0.95);
-    padding-top: 9px;
-    padding-bottom: 9px;
-    padding-left: 9px;
-    padding-right: 9px;
+    gap: 5px;
+    padding: 9px;
 
     .linkDescriptionPopup-input {
         float: left;
-        background-color: rgba(250, 250, 250, 0.95);
         color: rgb(100, 100, 100);
         border: none;
         min-width: 160px;
@@ -30,46 +28,29 @@
     .linkDescriptionPopup-btn {
 
         float: right;
-
         justify-content: center;
         vertical-align: middle;
 
-
         .linkDescriptionPopup-btn-dismiss {
-            background-color: white;
-            color: black;
+            cursor: pointer;
             display: inline;
-            right: 0;
-            border-radius: 10px;
-            border: 1px solid black;
-            padding: 3px;
-            font-size: 9px;
-            text-align: center;
-            position: relative;
-            margin-right: 4px;
-            justify-content: center;
-
-            &:hover{
-                cursor: pointer;
-            }
+            white-space: nowrap;
+            padding: 5px;
+            vertical-align: middle;
+            background-color: $close-red;
+            border-radius: 3px;
+            color: black;
         }
 
         .linkDescriptionPopup-btn-add {
-            background-color: black;
-            color: white;
+            cursor: pointer;
             display: inline;
-            right: 0;
-            border-radius: 10px;
-            border: 1px solid black;
-            padding: 3px;
-            font-size: 9px;
-            text-align: center;
-            position: relative;
-            justify-content: center;
-
-            &:hover{
-                cursor: pointer;
-            }
+            white-space: nowrap;
+            padding: 5px;
+            vertical-align: middle;
+            background-color: $light-blue;
+            border-radius: 3px;
+            color: black;
         }
     }
 
-- 
cgit v1.2.3-70-g09d2


From 0546ecf205b7d2b76f341a7157beebf95fb888a8 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Sun, 1 Aug 2021 22:43:46 -0400
Subject: made url server references relative.

---
 src/Utils.ts                                       |  1 -
 .../apis/google_docs/GooglePhotosClientUtils.ts    |  2 +-
 src/client/documents/Documents.ts                  | 90 ++--------------------
 src/client/util/HypothesisUtils.ts                 |  2 +-
 src/client/views/collections/CollectionSubView.tsx |  2 +-
 .../views/collections/CollectionTimeView.tsx       |  2 +-
 src/client/views/nodes/AudioBox.tsx                |  2 +-
 src/client/views/nodes/DocumentLinksButton.tsx     |  2 +-
 src/client/views/nodes/DocumentView.tsx            |  6 +-
 src/client/views/nodes/FieldView.tsx               |  6 +-
 src/client/views/nodes/ImageBox.tsx                |  2 +-
 src/client/views/nodes/LinkDocPreview.tsx          |  4 +-
 src/client/views/nodes/PDFBox.tsx                  | 24 ------
 src/client/views/nodes/ScreenshotBox.tsx           |  4 +-
 src/client/views/nodes/VideoBox.tsx                |  8 +-
 .../views/nodes/formattedText/FormattedTextBox.tsx |  6 +-
 .../views/nodes/formattedText/RichTextMenu.tsx     |  8 +-
 src/client/views/pdf/AnchorMenu.tsx                |  1 -
 src/fields/Doc.ts                                  | 12 ++-
 src/fields/URLField.ts                             | 15 +++-
 src/mobile/ImageUpload.tsx                         |  2 +-
 src/server/server_Initialization.ts                |  3 +-
 22 files changed, 58 insertions(+), 146 deletions(-)

(limited to 'src')

diff --git a/src/Utils.ts b/src/Utils.ts
index d87c3cc6b..194c38a6f 100644
--- a/src/Utils.ts
+++ b/src/Utils.ts
@@ -67,7 +67,6 @@ export namespace Utils {
     export function prepend(extension: string): string {
         return window.location.origin + extension;
     }
-
     export function fileUrl(filename: string): string {
         return prepend(`/files/${filename}`);
     }
diff --git a/src/client/apis/google_docs/GooglePhotosClientUtils.ts b/src/client/apis/google_docs/GooglePhotosClientUtils.ts
index 899e65a16..ff9460b62 100644
--- a/src/client/apis/google_docs/GooglePhotosClientUtils.ts
+++ b/src/client/apis/google_docs/GooglePhotosClientUtils.ts
@@ -285,7 +285,7 @@ export namespace GooglePhotos {
             const photos = await endpoint();
             const albumId = StrCast(collection.albumId);
             if (albumId && albumId.length) {
-                const enrichment = new photos.TextEnrichment(content || Utils.prepend("/doc/" + collection[Id]));
+                const enrichment = new photos.TextEnrichment(content || Doc.globalServerPath(collection));
                 const position = new photos.AlbumPosition(photos.AlbumPosition.POSITIONS.FIRST_IN_ALBUM);
                 const enrichmentItem = await photos.albums.addEnrichment(albumId, enrichment, position);
                 if (enrichmentItem) {
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index e863b4198..ac52b0acf 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -549,84 +549,6 @@ export namespace Docs {
      */
     export namespace Create {
 
-        /**
-         * Synchronously returns a collection into which
-         * the device documents will be put. This is initially empty,
-         * but gets populated by updates from the web socket. When everything is over,
-         * this function cleans up after itself.
-         * s
-         * Look at Websocket.ts for the server-side counterpart to this
-         * function.
-         */
-        export function Buxton() {
-            let responded = false;
-            const loading = new Doc;
-            loading.title = "Please wait for the import script...";
-            const parent = TreeDocument([loading], {
-                title: "The Buxton Collection",
-                _width: 400,
-                _height: 400
-            });
-            const parentProto = Doc.GetProto(parent);
-            const { _socket } = DocServer;
-
-            // just in case, clean up
-            _socket.off(MessageStore.BuxtonDocumentResult.Message);
-            _socket.off(MessageStore.BuxtonImportComplete.Message);
-
-            // this is where the client handles the receipt of a new valid parsed document
-            Utils.AddServerHandler(_socket, MessageStore.BuxtonDocumentResult, ({ device, invalid: errors }) => {
-                if (!responded) {
-                    responded = true;
-                    parentProto.data = new List<Doc>();
-                }
-                if (device) {
-                    const { title, __images, additionalMedia } = device;
-                    delete device.__images;
-                    delete device.additionalMedia;
-                    const { ImageDocument, StackingDocument } = Docs.Create;
-                    const constructed = __images.map(({ url, nativeWidth, nativeHeight }) => ({ url: Utils.prepend(url), nativeWidth, nativeHeight }));
-                    const deviceImages = constructed.map(({ url, nativeWidth, nativeHeight }, i) => {
-                        const imageDoc = ImageDocument(url, {
-                            title: `image${i}.${extname(url)}`,
-                            _nativeWidth: nativeWidth,
-                            _nativeHeight: nativeHeight
-                        });
-                        const media = additionalMedia[i];
-                        if (media) {
-                            for (const key of Object.keys(media)) {
-                                imageDoc[`additionalMedia_${key}`] = Utils.prepend(`/files/${key}/buxton/${media[key]}`);
-                            }
-                        }
-                        return imageDoc;
-                    });
-                    // the main document we create
-                    const doc = StackingDocument(deviceImages, { title, hero: new ImageField(constructed[0].url) });
-                    doc.nameAliases = new List<string>([title.toLowerCase()]);
-                    // add the parsed attributes to this main document
-                    Doc.Get.FromJson({ data: device, appendToExisting: { targetDoc: Doc.GetProto(doc) } });
-                    Doc.AddDocToList(parentProto, "data", doc);
-                } else if (errors) {
-                    console.log("Documents:" + errors);
-                } else {
-                    alert("A Buxton document import was completely empty (??)");
-                }
-            });
-
-            // when the import is complete, we stop listening for these creation
-            // and termination events and alert the user
-            Utils.AddServerHandler(_socket, MessageStore.BuxtonImportComplete, ({ deviceCount, errorCount }) => {
-                _socket.off(MessageStore.BuxtonDocumentResult.Message);
-                _socket.off(MessageStore.BuxtonImportComplete.Message);
-                alert(`Successfully imported ${deviceCount} device${deviceCount === 1 ? "" : "s"}, with ${errorCount} error${errorCount === 1 ? "" : "s"}, in ${(Date.now() - startTime) / 1000} seconds.`);
-            });
-            const startTime = Date.now();
-            Utils.Emit(_socket, MessageStore.BeginBuxtonImport, ""); // signal the server to start importing
-            return parent; // synchronously return the collection, to be populateds
-        }
-
-        Scripting.addGlobal(Buxton);
-
         /**
          * This function receives the relevant document prototype and uses
          * it to create a new of that base-level prototype, or the
@@ -675,7 +597,7 @@ export namespace Docs {
         }
 
         export function ImageDocument(url: string, options: DocumentOptions = {}) {
-            const imgField = new ImageField(new URL(url));
+            const imgField = new ImageField(url);
             return InstanceFromProto(Prototypes.get(DocumentType.IMG), imgField, { title: path.basename(url), ...options });
         }
 
@@ -689,11 +611,11 @@ export namespace Docs {
         }
 
         export function VideoDocument(url: string, options: DocumentOptions = {}) {
-            return InstanceFromProto(Prototypes.get(DocumentType.VID), new VideoField(new URL(url)), options);
+            return InstanceFromProto(Prototypes.get(DocumentType.VID), new VideoField(url), options);
         }
 
         export function YoutubeDocument(url: string, options: DocumentOptions = {}) {
-            return InstanceFromProto(Prototypes.get(DocumentType.YOUTUBE), new YoutubeField(new URL(url)), options);
+            return InstanceFromProto(Prototypes.get(DocumentType.YOUTUBE), new YoutubeField(url), options);
         }
 
         export function WebCamDocument(url: string, options: DocumentOptions = {}) {
@@ -709,7 +631,7 @@ export namespace Docs {
         }
 
         export function AudioDocument(url: string, options: DocumentOptions = {}) {
-            return InstanceFromProto(Prototypes.get(DocumentType.AUDIO), new AudioField(new URL(url)),
+            return InstanceFromProto(Prototypes.get(DocumentType.AUDIO), new AudioField(url),
                 { ...options, backgroundColor: ComputedField.MakeFunction("this._mediaState === 'playing' ? 'green':'gray'") as any });
         }
 
@@ -782,11 +704,11 @@ export namespace Docs {
         }
 
         export function PdfDocument(url: string, options: DocumentOptions = {}) {
-            return InstanceFromProto(Prototypes.get(DocumentType.PDF), new PdfField(new URL(url)), options);
+            return InstanceFromProto(Prototypes.get(DocumentType.PDF), new PdfField(url), options);
         }
 
         export function WebDocument(url: string, options: DocumentOptions = {}) {
-            return InstanceFromProto(Prototypes.get(DocumentType.WEB), url ? new WebField(new URL(url)) : undefined, options);
+            return InstanceFromProto(Prototypes.get(DocumentType.WEB), url ? new WebField(url) : undefined, options);
         }
 
         export function HtmlDocument(html: string, options: DocumentOptions = {}) {
diff --git a/src/client/util/HypothesisUtils.ts b/src/client/util/HypothesisUtils.ts
index 8ddfce772..635673025 100644
--- a/src/client/util/HypothesisUtils.ts
+++ b/src/client/util/HypothesisUtils.ts
@@ -126,7 +126,7 @@ export namespace Hypothesis {
         });
 
         const annotationId = StrCast(linkDoc.annotationId);
-        const linkUrl = Utils.prepend("/doc/" + sourceDoc[Id]);
+        const linkUrl = Doc.globalServerPath(sourceDoc);
         const interval = setInterval(() => {// keep trying to edit until annotations have loaded and editing is successful
             !success && document.dispatchEvent(new CustomEvent<{ targetUrl: string, id: string }>("deleteLink", {
                 detail: { targetUrl: linkUrl, id: annotationId },
diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx
index a5d27f038..0d9b64d24 100644
--- a/src/client/views/collections/CollectionSubView.tsx
+++ b/src/client/views/collections/CollectionSubView.tsx
@@ -303,7 +303,7 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
                     } else {
                         const path = window.location.origin + "/doc/";
                         if (text.startsWith(path)) {
-                            const docid = text.replace(Utils.prepend("/doc/"), "").split("?")[0];
+                            const docid = text.replace(Doc.globalServerPath(), "").split("?")[0];
                             DocServer.GetRefField(docid).then(f => {
                                 if (f instanceof Doc) {
                                     if (options.x || options.y) { f.x = options.x; f.y = options.y; } // should be in CollectionFreeFormView
diff --git a/src/client/views/collections/CollectionTimeView.tsx b/src/client/views/collections/CollectionTimeView.tsx
index 339163510..08b5e6bac 100644
--- a/src/client/views/collections/CollectionTimeView.tsx
+++ b/src/client/views/collections/CollectionTimeView.tsx
@@ -37,7 +37,7 @@ export class CollectionTimeView extends CollectionSubView(doc => doc) {
     @observable _focusRangeFilters: Opt<string[]>;
 
     getAnchor = () => {
-        const anchor = Docs.Create.HTMLAnchorDocument({
+        const anchor = Docs.Create.HTMLAnchorDocument([], {
             title: ComputedField.MakeFunction(`"${this.pivotField}"])`) as any,
             annotationOn: this.rootDoc
         });
diff --git a/src/client/views/nodes/AudioBox.tsx b/src/client/views/nodes/AudioBox.tsx
index a2e36f12e..82bad971d 100644
--- a/src/client/views/nodes/AudioBox.tsx
+++ b/src/client/views/nodes/AudioBox.tsx
@@ -196,7 +196,7 @@ export class AudioBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
         this._recorder.ondataavailable = async (e: any) => {
             const [{ result }] = await Networking.UploadFilesToServer(e.data);
             if (!(result instanceof Error)) {
-                this.props.Document[this.props.fieldKey] = new AudioField(Utils.prepend(result.accessPaths.agnostic.client));
+                this.props.Document[this.props.fieldKey] = new AudioField(result.accessPaths.agnostic.client);
             }
         };
         this._recordStart = new Date().getTime();
diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx
index ddc36daa1..aa3f10188 100644
--- a/src/client/views/nodes/DocumentLinksButton.tsx
+++ b/src/client/views/nodes/DocumentLinksButton.tsx
@@ -194,7 +194,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
                 Doc.GetProto(linkDoc as Doc).linksToAnnotation = true;
                 Doc.GetProto(linkDoc as Doc).annotationId = DocumentLinksButton.AnnotationId;
                 Doc.GetProto(linkDoc as Doc).annotationUri = DocumentLinksButton.AnnotationUri;
-                const dashHyperlink = Utils.prepend("/doc/" + (startIsAnnotation ? endLink[Id] : startLink[Id]));
+                const dashHyperlink = Doc.globalServerPath(startIsAnnotation ? endLink : startLink);
                 Hypothesis.makeLink(StrCast(startIsAnnotation ? endLink.title : startLink.title), dashHyperlink, DocumentLinksButton.AnnotationId,
                     (startIsAnnotation ? startLink : endLink)); // edit annotation to add a Dash hyperlink to the linked doc
             }
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 60fa462ad..b8ccc4712 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -746,7 +746,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
                         moreItems.push({ description: "Tag Child Images via Google Photos", event: () => GooglePhotos.Query.TagChildImages(this.props.Document), icon: "caret-square-right" });
                         moreItems.push({ description: "Write Back Link to Album", event: () => GooglePhotos.Transactions.AddTextEnrichment(this.props.Document), icon: "caret-square-right" });
                     }
-                    moreItems.push({ description: "Copy ID", event: () => Utils.CopyText(Utils.prepend("/doc/" + this.props.Document[Id])), icon: "fingerprint" });
+                    moreItems.push({ description: "Copy ID", event: () => Utils.CopyText(Doc.globalServerPath(this.props.Document)), icon: "fingerprint" });
                 }
             }
 
@@ -760,7 +760,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
             const help = cm.findByDescription("Help...");
             const helpItems: ContextMenuProps[] = help && "subitems" in help ? help.subitems : [];
             !Doc.UserDoc().novice && helpItems.push({ description: "Show Fields ", event: () => this.props.addDocTab(Docs.Create.KVPDocument(this.props.Document, { _width: 300, _height: 300 }), "add:right"), icon: "layer-group" });
-            helpItems.push({ description: "Text Shortcuts Ctrl+/", event: () => this.props.addDocTab(Docs.Create.PdfDocument(Utils.prepend("/assets/cheat-sheet.pdf"), { _width: 300, _height: 300 }), "add:right"), icon: "keyboard" });
+            helpItems.push({ description: "Text Shortcuts Ctrl+/", event: () => this.props.addDocTab(Docs.Create.PdfDocument("/assets/cheat-sheet.pdf", { _width: 300, _height: 300 }), "add:right"), icon: "keyboard" });
             !Doc.UserDoc().novice && helpItems.push({ description: "Print Document in Console", event: () => console.log(this.props.Document), icon: "hand-point-right" });
             cm.addItem({ description: "Help...", noexpand: true, subitems: helpItems, icon: "question" });
         }
@@ -885,7 +885,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
             recorder.ondataavailable = async (e: any) => {
                 const [{ result }] = await Networking.UploadFilesToServer(e.data);
                 if (!(result instanceof Error)) {
-                    const audioDoc = Docs.Create.AudioDocument(Utils.prepend(result.accessPaths.agnostic.client), { title: "audio test", _width: 200, _height: 32 });
+                    const audioDoc = Docs.Create.AudioDocument(result.accessPaths.agnostic.client, { title: "audio test", _width: 200, _height: 32 });
                     audioDoc.treeViewExpandedView = "layout";
                     const audioAnnos = Cast(self.dataDoc[self.LayoutFieldKey + "-audioAnnotations"], listSpec(Doc));
                     if (audioAnnos === undefined) {
diff --git a/src/client/views/nodes/FieldView.tsx b/src/client/views/nodes/FieldView.tsx
index 86250c9d1..ebbc1138a 100644
--- a/src/client/views/nodes/FieldView.tsx
+++ b/src/client/views/nodes/FieldView.tsx
@@ -64,9 +64,9 @@ export class FieldView extends React.Component<FieldViewProps> {
         // else if (field instaceof PresBox) {
         //    return <PresBox {...this.props} />;
         // }
-        else if (field instanceof VideoField) {
-            return <VideoBox {...this.props} />;
-        }
+        // else if (field instanceof VideoField) {
+        //     return <VideoBox {...this.props} />;
+        // }
         // else if (field instanceof AudioField) {
         //     return <AudioBox {...this.props} />;
         //}
diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx
index cfd43bb62..2c0106960 100644
--- a/src/client/views/nodes/ImageBox.tsx
+++ b/src/client/views/nodes/ImageBox.tsx
@@ -238,7 +238,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
                     let succeeded = true;
                     let data: ImageField | undefined;
                     try {
-                        data = new ImageField(Utils.prepend(accessPaths.agnostic.client));
+                        data = new ImageField(accessPaths.agnostic.client);
                     } catch {
                         succeeded = false;
                     }
diff --git a/src/client/views/nodes/LinkDocPreview.tsx b/src/client/views/nodes/LinkDocPreview.tsx
index b73fb10df..126a37eb8 100644
--- a/src/client/views/nodes/LinkDocPreview.tsx
+++ b/src/client/views/nodes/LinkDocPreview.tsx
@@ -72,14 +72,14 @@ export class LinkDocPreview extends React.Component<LinkDocPreviewProps> {
     @computed get href() {
         if (this.props.hrefs?.length) {
             const href = this.props.hrefs[this._hrefInd];
-            if (href.indexOf(Utils.prepend("/doc/")) !== 0) {  // link to a web page URL -- try to show a preview
+            if (href.indexOf(Doc.localServerPath()) !== 0) {  // link to a web page URL -- try to show a preview
                 if (href.startsWith("https://en.wikipedia.org/wiki/")) {
                     wiki().page(href.replace("https://en.wikipedia.org/wiki/", "")).then(page => page.summary().then(action(summary => this._toolTipText = summary.substring(0, 500))));
                 } else {
                     setTimeout(action(() => this._toolTipText = "url => " + href));
                 }
             } else { // hyperlink to a document .. decode doc id and retrieve from the server. this will trigger vals() being invalidated
-                const anchorDoc = href.replace(Utils.prepend("/doc/"), "").split("?")[0];
+                const anchorDoc = href.replace(Doc.localServerPath(), "").split("?")[0];
                 anchorDoc && DocServer.GetRefField(anchorDoc).then(action(anchor => {
                     if (anchor instanceof Doc && DocListCast(anchor.links).length) {
                         this._linkDoc = DocListCast(anchor.links)[0];
diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx
index 8f61e252b..0b451e2b4 100644
--- a/src/client/views/nodes/PDFBox.tsx
+++ b/src/client/views/nodes/PDFBox.tsx
@@ -53,30 +53,6 @@ export class PDFBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
             if (PDFBox.pdfcache.get(this.pdfUrl.url.href)) runInAction(() => this._pdf = PDFBox.pdfcache.get(this.pdfUrl!.url.href));
             else if (PDFBox.pdfpromise.get(this.pdfUrl.url.href)) PDFBox.pdfpromise.get(this.pdfUrl.url.href)?.then(action(pdf => this._pdf = pdf));
         }
-
-        const backup = "oldPath";
-        const href = this.pdfUrl?.url.href;
-        if (href) {
-            const pathCorrectionTest = /upload\_[a-z0-9]{32}.(.*)/g;
-            const matches = pathCorrectionTest.exec(href);
-            // console.log("\nHere's the { url } being fed into the outer regex:");
-            // console.log(href);
-            // console.log("And here's the 'properPath' build from the captured filename:\n");
-            if (matches !== null && href.startsWith(window.location.origin)) {
-                const properPath = Utils.prepend(`/files/pdfs/${matches[0]}`);
-                //console.log(properPath);
-                if (!properPath.includes(href)) {
-                    console.log(`The two (url and proper path) were not equal`);
-                    const proto = Doc.GetProto(this.props.Document);
-                    proto[this.props.fieldKey] = new PdfField(properPath);
-                    proto[backup] = href;
-                } else {
-                    //console.log(`The two (url and proper path) were equal`);
-                }
-            } else {
-                console.log("Outer matches was null!");
-            }
-        }
     }
 
     componentWillUnmount() { this._selectReactionDisposer?.(); }
diff --git a/src/client/views/nodes/ScreenshotBox.tsx b/src/client/views/nodes/ScreenshotBox.tsx
index 700f8a7d3..0e235a62d 100644
--- a/src/client/views/nodes/ScreenshotBox.tsx
+++ b/src/client/views/nodes/ScreenshotBox.tsx
@@ -227,7 +227,7 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
             this._audioRec.onstop = async (e: any) => {
                 const [{ result }] = await Networking.UploadFilesToServer(aud_chunks);
                 if (!(result instanceof Error)) {
-                    this.dataDoc[this.props.fieldKey + "-audio"] = new AudioField(Utils.prepend(result.accessPaths.agnostic.client));
+                    this.dataDoc[this.props.fieldKey + "-audio"] = new AudioField(result.accessPaths.agnostic.client);
                 }
             };
             this._videoRef!.srcObject = await (navigator.mediaDevices as any).getDisplayMedia({ video: true });
@@ -244,7 +244,7 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
                     this.layoutDoc.layout = VideoBox.LayoutString(this.fieldKey);
                     this.dataDoc.nativeWidth = this.dataDoc.nativeHeight = undefined;
                     this.layoutDoc._fitWidth = undefined;
-                    this.dataDoc[this.props.fieldKey] = new VideoField(Utils.prepend(result.accessPaths.agnostic.client));
+                    this.dataDoc[this.props.fieldKey] = new VideoField(result.accessPaths.agnostic.client);
                 } else alert("video conversion failed");
             };
             this._audioRec.start();
diff --git a/src/client/views/nodes/VideoBox.tsx b/src/client/views/nodes/VideoBox.tsx
index fc08a2302..ce45c01e6 100644
--- a/src/client/views/nodes/VideoBox.tsx
+++ b/src/client/views/nodes/VideoBox.tsx
@@ -75,10 +75,6 @@ export class VideoBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
         return CollectionStackedTimeline.createAnchor(this.rootDoc, this.dataDoc, this.annotationKey, "_timecodeToShow"/* videoStart */, "_timecodeToHide" /* videoEnd */, timecode ? timecode : undefined) || this.rootDoc;
     }
 
-    choosePath(url: string) {
-        return url.indexOf(window.location.origin) === -1 ? Utils.CorsProxy(url) : url;
-    }
-
     videoLoad = () => {
         const aspect = this.player!.videoWidth / this.player!.videoHeight;
         Doc.SetNativeWidth(this.dataDoc, this.player!.videoWidth);
@@ -182,8 +178,8 @@ export class VideoBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
         }
     }
 
-    private createRealSummaryLink = (relative: string, downX?: number, downY?: number) => {
-        const url = this.choosePath(Utils.prepend(relative));
+    private createRealSummaryLink = (imagePath: string, downX?: number, downY?: number) => {
+        const url = !imagePath.startsWith("/") ? Utils.CorsProxy(imagePath) : imagePath;
         const width = this.layoutDoc._width || 1;
         const height = this.layoutDoc._height || 0;
         const imageSummary = Docs.Create.ImageDocument(url, {
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 140d39929..f7e9ee028 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -371,7 +371,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
                 this._searchIndex = ++this._searchIndex > flattened.length - 1 ? 0 : this._searchIndex;
                 const anchor = Docs.Create.TextanchorDocument();
                 const alink = DocUtils.MakeLink({ doc: anchor }, { doc: target }, "automatic")!;
-                const allAnchors = [{ href: Utils.prepend("/doc/" + anchor[Id]), title: "a link", anchorId: anchor[Id] }];
+                const allAnchors = [{ href: Doc.localServerPath(anchor), title: "a link", anchorId: anchor[Id] }];
                 const link = this._editorView!.state.schema.marks.linkAnchor.create({ allAnchors, title: "auto link", location });
                 tr = tr.addMark(flattened[i].from, flattened[i].to, link);
             });
@@ -705,7 +705,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
             let tr = state.tr.addMark(sel.from, sel.to, splitter);
             if (sel.from !== sel.to) {
                 const anchor = anchorDoc ?? Docs.Create.TextanchorDocument({ title: this._editorView?.state.doc.textBetween(sel.from, sel.to) });
-                const href = targetHref ?? Utils.prepend("/doc/" + anchor[Id]);
+                const href = targetHref ?? Doc.localServerPath(anchor);
                 if (anchor !== anchorDoc) this.addDocument(anchor);
                 tr.doc.nodesBetween(sel.from, sel.to, (node: any, pos: number, parent: any) => {
                     if (node.firstChild === null && node.marks.find((m: Mark) => m.type.name === schema.marks.splitter.name)) {
@@ -1042,7 +1042,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
             }
             const marks = [...node.marks];
             const linkIndex = marks.findIndex(mark => mark.type.name === "link");
-            const allLinks = [{ href: Utils.prepend(`/doc/${linkId}`), title, linkId }];
+            const allLinks = [{ href: Doc.globalServerPath(linkId), title, linkId }];
             const link = view.state.schema.mark(view.state.schema.marks.linkAnchor, { allLinks, location: "add:right", title, docref: true });
             marks.splice(linkIndex === -1 ? 0 : linkIndex, 1, link);
             return node.mark(marks);
diff --git a/src/client/views/nodes/formattedText/RichTextMenu.tsx b/src/client/views/nodes/formattedText/RichTextMenu.tsx
index a6f8ff2e2..fb4114023 100644
--- a/src/client/views/nodes/formattedText/RichTextMenu.tsx
+++ b/src/client/views/nodes/formattedText/RichTextMenu.tsx
@@ -821,8 +821,8 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
         if (link) {
             const href = link.attrs.allAnchors.length > 0 ? link.attrs.allAnchors[0].href : undefined;
             if (href) {
-                if (href.indexOf(Utils.prepend("/doc/")) === 0) {
-                    const linkclicked = href.replace(Utils.prepend("/doc/"), "").split("?")[0];
+                if (href.indexOf(Doc.localServerPath()) === 0) {
+                    const linkclicked = href.replace(Doc.localServerPath(), "").split("?")[0];
                     if (linkclicked) {
                         const linkDoc = await DocServer.GetRefField(linkclicked);
                         if (linkDoc instanceof Doc) {
@@ -864,8 +864,8 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
                 const allAnchors = linkAnchor.attrs.allAnchors.slice();
                 this.TextView.RemoveAnchorFromSelection(allAnchors);
                 // bcz: Argh ... this will remove the link from the document even it's anchored somewhere else in the text which happens if only part of the anchor text was selected.
-                allAnchors.filter((aref: any) => aref?.href.indexOf(Utils.prepend("/doc/")) === 0).forEach((aref: any) => {
-                    const anchorId = aref.href.replace(Utils.prepend("/doc/"), "").split("?")[0];
+                allAnchors.filter((aref: any) => aref?.href.indexOf(Doc.localServerPath()) === 0).forEach((aref: any) => {
+                    const anchorId = aref.href.replace(Doc.localServerPath(), "").split("?")[0];
                     anchorId && DocServer.GetRefField(anchorId).then(linkDoc => LinkManager.Instance.deleteLink(linkDoc as Doc));
                 });
             }
diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx
index 70ca19842..55816ed52 100644
--- a/src/client/views/pdf/AnchorMenu.tsx
+++ b/src/client/views/pdf/AnchorMenu.tsx
@@ -85,7 +85,6 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
     @action
     toggleLinkPopup = (e: React.MouseEvent) => {
         //ignore the potential null type error because this method cannot be called unless the user selects text and clicks the link button
-        console.log(window.getSelection().toString())
         //change popup visibility field to visible
         this._showLinkPopup = !this._showLinkPopup;
     }
diff --git a/src/fields/Doc.ts b/src/fields/Doc.ts
index 111fd3f0d..a7e5d8541 100644
--- a/src/fields/Doc.ts
+++ b/src/fields/Doc.ts
@@ -596,7 +596,7 @@ export namespace Doc {
                 const mapped = cloneMap.get(id);
                 return href + (mapped ? mapped[Id] : id);
             };
-            const regex = `(${Utils.prepend("/doc/")})([^"]*)`;
+            const regex = `(${Doc.localServerPath()})([^"]*)`;
             const re = new RegExp(regex, "g");
             copy[key] = new RichTextField(field.Data.replace(/("textId":|"audioId":|"anchorId":)"([^"]+)"/g, replacer).replace(re, replacer2), field.Text);
         });
@@ -896,6 +896,16 @@ export namespace Doc {
         return true;
     }
 
+
+    // converts a document id to a url path on the server
+    export function globalServerPath(doc: Doc | string = ""): string {
+        return Utils.prepend("/doc/" + (doc instanceof Doc ? doc[Id] : doc));
+    }
+    // converts a document id to a url path on the server
+    export function localServerPath(doc?: Doc): string {
+        return "/doc/" + (doc ? doc[Id] : "");
+    }
+
     export function overlapping(doc1: Doc, doc2: Doc, clusterDistance: number) {
         const doc2Layout = Doc.Layout(doc2);
         const doc1Layout = Doc.Layout(doc1);
diff --git a/src/fields/URLField.ts b/src/fields/URLField.ts
index fb71160ca..d96e8a70a 100644
--- a/src/fields/URLField.ts
+++ b/src/fields/URLField.ts
@@ -3,14 +3,17 @@ import { serializable, custom } from "serializr";
 import { ObjectField } from "./ObjectField";
 import { ToScriptString, ToString, Copy } from "./FieldSymbols";
 import { Scripting, scriptingGlobal } from "../client/util/Scripting";
+import { Utils } from "../Utils";
 
 function url() {
     return custom(
         function (value: URL) {
-            return value.href;
+            return value.origin === window.location.origin ?
+                value.pathname :
+                value.href;
         },
         function (jsonValue: string) {
-            return new URL(jsonValue);
+            return new URL(jsonValue, window.location.origin);
         }
     );
 }
@@ -24,15 +27,21 @@ export abstract class URLField extends ObjectField {
     constructor(url: URL | string) {
         super();
         if (typeof url === "string") {
-            url = new URL(url);
+            url = url.startsWith("http") ? new URL(url) : new URL(url, window.location.origin);
         }
         this.url = url;
     }
 
     [ToScriptString]() {
+        if (Utils.prepend(this.url.pathname) === this.url.href) {
+            return `new ${this.constructor.name}("${this.url.pathname}")`;
+        }
         return `new ${this.constructor.name}("${this.url.href}")`;
     }
     [ToString]() {
+        if (Utils.prepend(this.url.pathname) === this.url.href) {
+            return this.url.pathname;
+        }
         return this.url.href;
     }
 
diff --git a/src/mobile/ImageUpload.tsx b/src/mobile/ImageUpload.tsx
index 98696496f..f910d765e 100644
--- a/src/mobile/ImageUpload.tsx
+++ b/src/mobile/ImageUpload.tsx
@@ -50,7 +50,7 @@ export class Uploader extends React.Component<ImageUploadProps> {
                             if (result instanceof Error) {
                                 return;
                             }
-                            const path = Utils.prepend(result.accessPaths.agnostic.client);
+                            const path = result.accessPaths.agnostic.client;
                             let doc = null;
                             // Case 1: File is a video
                             if (file.type === "video/mp4") {
diff --git a/src/server/server_Initialization.ts b/src/server/server_Initialization.ts
index e40f2b8e5..0f4a067fc 100644
--- a/src/server/server_Initialization.ts
+++ b/src/server/server_Initialization.ts
@@ -142,8 +142,9 @@ function registerCorsProxy(server: express.Express) {
     const headerCharRegex = /[^\t\x20-\x7e\x80-\xff]/;
     server.use("/corsProxy", async (req, res) => {
 
-        const requrl = decodeURIComponent(req.url.substring(1));
         const referer = req.headers.referer ? decodeURIComponent(req.headers.referer) : "";
+        const requrlraw = decodeURIComponent(req.url.substring(1));
+        const requrl = requrlraw.startsWith("/") ? referer + requrlraw : requrlraw;
         // cors weirdness here... 
         // if the referer is a cors page and the cors() route (I think) redirected to /corsProxy/<path> and the requested url path was relative, 
         // then we redirect again to the cors referer and just add the relative path.
-- 
cgit v1.2.3-70-g09d2


From 2abbe23a9c6054e4ff5314333bba25b88554d1ec Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Tue, 3 Aug 2021 11:41:48 -0400
Subject: fixed links being blown away in sidebars.

---
 src/client/views/SidebarAnnos.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/views/SidebarAnnos.tsx b/src/client/views/SidebarAnnos.tsx
index 010418be5..7b11723c3 100644
--- a/src/client/views/SidebarAnnos.tsx
+++ b/src/client/views/SidebarAnnos.tsx
@@ -33,7 +33,7 @@ interface ExtraProps {
 export class SidebarAnnos extends React.Component<FieldViewProps & ExtraProps> {
     constructor(props: Readonly<FieldViewProps & ExtraProps>) {
         super(props);
-        this.props.dataDoc[this.sidebarKey] = new List<Doc>();
+        // this.props.dataDoc[this.sidebarKey] = new List<Doc>();  // bcz: can't do this here.  it blows away existing things and isn't a robust solution for making sure the field exists -- instead this should happen when the document is created and/or shared
     }
     _stackRef = React.createRef<CollectionStackingView>();
     @computed get allHashtags() {
-- 
cgit v1.2.3-70-g09d2


From 0e8aef275346b4ba3bc1bb91fda17a335c307bf1 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Tue, 3 Aug 2021 13:09:48 -0400
Subject: fixed using viewSpecs when following links to set filters/viewType
 properly.

---
 src/client/util/DocumentManager.ts                      |  2 +-
 src/client/views/collections/CollectionSubView.tsx      |  6 +++---
 .../collectionFreeForm/CollectionFreeFormView.tsx       | 17 ++++++++++++-----
 src/client/views/nodes/DocumentView.tsx                 | 14 ++++++++------
 4 files changed, 24 insertions(+), 15 deletions(-)

(limited to 'src')

diff --git a/src/client/util/DocumentManager.ts b/src/client/util/DocumentManager.ts
index 5b092258a..9c6100249 100644
--- a/src/client/util/DocumentManager.ts
+++ b/src/client/util/DocumentManager.ts
@@ -163,7 +163,7 @@ export class DocumentManager {
         const targetDocContext = contextDoc || annotatedDoc;
         const targetDocContextView = targetDocContext && getFirstDocView(targetDocContext);
         const focusView = !docView && targetDoc.type === DocumentType.MARKER && annoContainerView ? annoContainerView : docView;
-        if (!docView && annoContainerView && !focusView) {
+        if (!docView && annoContainerView) {
             annoContainerView.focus(targetDoc);  // this allows something like a PDF view to remove its doc filters to expose the target so that it can be found in the retry code below
         }
         if (focusView) {
diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx
index 0d9b64d24..3b143aeef 100644
--- a/src/client/views/collections/CollectionSubView.tsx
+++ b/src/client/views/collections/CollectionSubView.tsx
@@ -82,13 +82,13 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
             return Cast(this.dataField, listSpec(Doc));
         }
         docFilters = () => {
-            return [...this.props.docFilters(), ...Cast(this.props.Document._docFilters, listSpec("string"), [])];
+            return (this.props.docFilters?.() ?? Cast(this.props.Document._docFilters, listSpec("string"), []));
         }
         docRangeFilters = () => {
-            return [...this.props.docRangeFilters(), ...Cast(this.props.Document._docRangeFilters, listSpec("string"), [])];
+            return (this.props.docRangeFilters?.() ?? Cast(this.props.Document._docRangeFilters, listSpec("string"), []));
         }
         searchFilterDocs = () => {
-            return [...this.props.searchFilterDocs(), ...DocListCast(this.props.Document._searchFilterDocs)];
+            return this.props.searchFilterDocs?.() ?? DocListCast(this.props.Document._searchFilterDocs);
         }
         @computed.struct get childDocs() {
             TraceMobx();
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index 143d8e070..ecc93285e 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -159,8 +159,8 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
         this.layoutDoc._viewScale = vals.scale;
     }
     freeformData = (force?: boolean) => this.fitToContent || force ? this.fitToContentVals : undefined;
-    freeformDocFilters = () => this._focusFilters || this.docFilters();
-    freeformRangeDocFilters = () => this._focusRangeFilters || this.docRangeFilters();
+    freeformDocFilters = () => this._focusFilters;
+    freeformRangeDocFilters = () => this._focusRangeFilters;
     reverseNativeScaling = () => this.fitToContent ? true : false;
     panX = () => this.freeformData()?.bounds.cx ?? NumCast(this.Document._panX);
     panY = () => this.freeformData()?.bounds.cy ?? NumCast(this.Document._panY);
@@ -1197,14 +1197,21 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
         if (preview) {
             this._focusFilters = StrListCast(Doc.GetProto(anchor).docFilters);
             this._focusRangeFilters = StrListCast(Doc.GetProto(anchor).docRangeFilters);
-        } else if (anchor.pivotField !== undefined) {
-            this.layoutDoc._docFilters = new List<string>(StrListCast(anchor.docFilters));
-            this.layoutDoc._docRangeFilters = new List<string>(StrListCast(anchor.docRangeFilters));
+        } else {
+            if (anchor.docFilters) {
+                this.layoutDoc._docFilters = new List<string>(StrListCast(anchor.docFilters));
+            }
+            if (anchor.docRangeFilters) {
+                this.layoutDoc._docRangeFilters = new List<string>(StrListCast(anchor.docRangeFilters));
+            }
         }
         return 0;
     }
 
     getAnchor = () => {
+        if (this.props.Document.annotationOn) {
+            return this.rootDoc;
+        }
         const anchor = Docs.Create.TextanchorDocument({ title: StrCast(this.layoutDoc._viewType), annotationOn: this.rootDoc });
         const proto = Doc.GetProto(anchor);
         proto[ViewSpecPrefix + "_viewType"] = this.layoutDoc._viewType;
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index f716eb7b1..c218b805e 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -64,7 +64,7 @@ export enum ViewAdjustment {
     doNothing = 0
 }
 
-export const ViewSpecPrefix = "_VIEW";  // field prefix for anchor fields that are immediately copied over to the target document when link is followed.  Other anchor properties will be copied over in the specific setViewSpec() method on their view (which allows for seting preview values instead of writing to the document)
+export const ViewSpecPrefix = "viewSpec";  // field prefix for anchor fields that are immediately copied over to the target document when link is followed.  Other anchor properties will be copied over in the specific setViewSpec() method on their view (which allows for seting preview values instead of writing to the document)
 
 export interface DocFocusOptions {
     originalTarget?: Doc; // set in JumpToDocument, used by TabDocView to determine whether to fit contents to tab
@@ -105,9 +105,9 @@ export interface DocumentViewSharedProps {
     styleProvider: Opt<StyleProviderFunc>;
     focus: DocFocusFunc;
     fitWidth?: () => boolean;
-    docFilters: () => string[];
-    docRangeFilters: () => string[];
-    searchFilterDocs: () => Doc[];
+    docFilters?: () => Opt<string[]>;
+    docRangeFilters?: () => Opt<string[]>;
+    searchFilterDocs?: () => Opt<Doc[]>;
     whenChildContentsActiveChanged: (isActive: boolean) => void;
     rootSelected: (outsideReaction?: boolean) => boolean; // whether the root of a template has been selected
     addDocTab: (doc: Doc, where: string) => boolean;
@@ -421,7 +421,9 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
     focus = (anchor: Doc, options?: DocFocusOptions) => {
         LightboxView.SetCookie(StrCast(anchor["cookies-set"]));
         // copying over _VIEW fields immediately allows the view type to switch to create the right _componentView
-        Array.from(Object.keys(Doc.GetProto(anchor))).filter(key => key.startsWith(ViewSpecPrefix)).forEach(spec => this.layoutDoc[spec.replace(ViewSpecPrefix, "")] = ((field) => field instanceof ObjectField ? ObjectField.MakeCopy(field) : field)(anchor[spec]));
+        Array.from(Object.keys(Doc.GetProto(anchor))).filter(key => key.startsWith(ViewSpecPrefix)).forEach(spec => {
+            this.layoutDoc[spec.replace(ViewSpecPrefix, "")] = ((field) => field instanceof ObjectField ? ObjectField.MakeCopy(field) : field)(anchor[spec]);
+        });
         // after  a timeout, the right _componentView should have been created, so call it to update its view spec values
         setTimeout(() => this._componentView?.setViewSpec?.(anchor, LinkDocPreview.LinkInfo ? true : false));
         const focusSpeed = this._componentView?.scrollFocus?.(anchor, !LinkDocPreview.LinkInfo); // bcz: smooth parameter should really be passed into focus() instead of inferred here      
@@ -837,7 +839,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
         if (this.props.LayoutTemplateString?.includes(LinkAnchorBox.name)) return null;
         if (this.layoutDoc.presBox || this.rootDoc.type === DocumentType.LINK || this.props.dontRegisterView) return (null);
         // need to use allLinks for RTF since embedded linked text anchors are not rendered with DocumentViews.  All other documents render their anchors with nested DocumentViews so we just need to render the directLinks here
-        const filtered = DocUtils.FilterDocs(this.rootDoc.type === DocumentType.RTF ? this.allLinks : this.directLinks, this.props.docFilters(), []).filter(d => !d.hidden);
+        const filtered = DocUtils.FilterDocs(this.rootDoc.type === DocumentType.RTF ? this.allLinks : this.directLinks, this.props.docFilters?.() ?? [], []).filter(d => !d.hidden);
         return filtered.map((link, i) =>
             <div className="documentView-anchorCont" key={i + 1}>
                 <DocumentView {...this.props}
-- 
cgit v1.2.3-70-g09d2


From 70f98c6d4d3e457a05e7c84260bf33580ee0166a Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 4 Aug 2021 10:34:25 -0400
Subject: restructured filters again so that filter icons show whether a
 document has a filter or inherits one.  following a link with a view spec
 overrides only locally set filters (not inherited ones).

---
 src/client/views/.DS_Store                         | Bin 10244 -> 10244 bytes
 .../views/collections/CollectionSchemaView.tsx     |   4 +--
 .../views/collections/CollectionStackingView.tsx   |   4 +--
 src/client/views/collections/CollectionSubView.tsx |  29 ++++++++++++---------
 .../views/collections/CollectionTimeView.tsx       |  12 +++------
 src/client/views/collections/CollectionView.tsx    |  14 +++++++---
 src/client/views/collections/TabDocView.tsx        |   9 ++++---
 .../collectionFreeForm/CollectionFreeFormView.tsx  |   8 ++----
 .../CollectionMulticolumnView.tsx                  |   4 +--
 .../CollectionMultirowView.tsx                     |   4 +--
 .../collectionSchema/CollectionSchemaView.tsx      |   4 +--
 src/client/views/nodes/DocumentView.tsx            |   6 ++---
 12 files changed, 50 insertions(+), 48 deletions(-)

(limited to 'src')

diff --git a/src/client/views/.DS_Store b/src/client/views/.DS_Store
index 33e624ef4..e4ac87aad 100644
Binary files a/src/client/views/.DS_Store and b/src/client/views/.DS_Store differ
diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx
index e1e04915a..380f82813 100644
--- a/src/client/views/collections/CollectionSchemaView.tsx
+++ b/src/client/views/collections/CollectionSchemaView.tsx
@@ -413,8 +413,8 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) {
                     isContentActive={returnTrue}
                     isDocumentActive={returnFalse}
                     ScreenToLocalTransform={this.getPreviewTransform}
-                    docFilters={this.docFilters}
-                    docRangeFilters={this.docRangeFilters}
+                    docFilters={this.childDocFilters}
+                    docRangeFilters={this.childDocRangeFilters}
                     searchFilterDocs={this.searchFilterDocs}
                     styleProvider={DefaultStyleProvider}
                     layerProvider={undefined}
diff --git a/src/client/views/collections/CollectionStackingView.tsx b/src/client/views/collections/CollectionStackingView.tsx
index 7aa8dfd56..b9bc83d49 100644
--- a/src/client/views/collections/CollectionStackingView.tsx
+++ b/src/client/views/collections/CollectionStackingView.tsx
@@ -239,10 +239,10 @@ export class CollectionStackingView extends CollectionSubView<StackingDocument,
             onDoubleClick={this.onChildDoubleClickHandler}
             ScreenToLocalTransform={stackedDocTransform}
             focus={this.focusDocument}
-            docFilters={this.docFilters}
+            docFilters={this.childDocFilters}
             hideDecorationTitle={this.props.childHideDecorationTitle?.()}
             hideTitle={this.props.childHideTitle?.()}
-            docRangeFilters={this.docRangeFilters}
+            docRangeFilters={this.childDocRangeFilters}
             searchFilterDocs={this.searchFilterDocs}
             ContainingCollectionDoc={this.props.CollectionView?.props.Document}
             ContainingCollectionView={this.props.CollectionView}
diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx
index 3b143aeef..e5f266acf 100644
--- a/src/client/views/collections/CollectionSubView.tsx
+++ b/src/client/views/collections/CollectionSubView.tsx
@@ -8,7 +8,7 @@ import { ScriptField } from "../../../fields/ScriptField";
 import { WebField } from "../../../fields/URLField";
 import { Cast, ScriptCast, NumCast, StrCast } from "../../../fields/Types";
 import { GestureUtils } from "../../../pen-gestures/GestureUtils";
-import { Utils, returnFalse } from "../../../Utils";
+import { Utils, returnFalse, returnEmptyFilter } from "../../../Utils";
 import { DocServer } from "../../DocServer";
 import { Networking } from "../../Network";
 import { ImageUtils } from "../../util/Import & Export/ImageUtils";
@@ -22,6 +22,7 @@ import ReactLoading from 'react-loading';
 
 export interface SubCollectionViewProps extends CollectionViewProps {
     CollectionView: Opt<CollectionView>;
+    SetSubView: (subView: any) => void;
 }
 
 export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?: X) {
@@ -30,6 +31,8 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
         private gestureDisposer?: GestureUtils.GestureEventDisposer;
         protected _multiTouchDisposer?: InteractionUtils.MultiTouchEventDisposer;
         protected _mainCont?: HTMLDivElement;
+        @observable _focusFilters: Opt<string[]>; // docFilters that are overridden when previewing a link to an anchor which has docFilters set on it
+        @observable _focusRangeFilters: Opt<string[]>; // docRangeFilters that are overridden when previewing a link to an anchor which has docRangeFilters set on it
         protected createDashEventsTarget = (ele: HTMLDivElement) => { //used for stacking and masonry view
             this.dropDisposer?.();
             this.gestureDisposer?.();
@@ -45,6 +48,10 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
             this.createDashEventsTarget(ele);
         }
 
+        componentDidMount() {
+            this.props.SetSubView(this);
+        }
+
         componentWillUnmount() {
             this.gestureDisposer?.();
             this._multiTouchDisposer?.();
@@ -81,15 +88,13 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
         get childDocList() {
             return Cast(this.dataField, listSpec(Doc));
         }
-        docFilters = () => {
-            return (this.props.docFilters?.() ?? Cast(this.props.Document._docFilters, listSpec("string"), []));
-        }
-        docRangeFilters = () => {
-            return (this.props.docRangeFilters?.() ?? Cast(this.props.Document._docRangeFilters, listSpec("string"), []));
-        }
-        searchFilterDocs = () => {
-            return this.props.searchFilterDocs?.() ?? DocListCast(this.props.Document._searchFilterDocs);
-        }
+        collectionFilters = () => this._focusFilters ?? Cast(this.props.Document._docFilters, listSpec("string"), []);
+        collectionRangeDocFilters = () => this._focusRangeFilters ?? Cast(this.props.Document._docRangeFilters, listSpec("string"), []);
+        childDocFilters = () => [...this.props.docFilters(), ...this.collectionFilters()];
+        childDocRangeFilters = () => [...(this.props.docRangeFilters?.() || []), ...this.collectionRangeDocFilters()];
+        IsFiltered = () => this.collectionFilters().length || this.collectionRangeDocFilters().length ? "hasFilter" :
+            this.props.docFilters().length || this.props.docRangeFilters().length ? "inheritsFilter" : undefined;
+        searchFilterDocs = () => this.props.searchFilterDocs?.() ?? DocListCast(this.props.Document._searchFilterDocs);
         @computed.struct get childDocs() {
             TraceMobx();
             let rawdocs: (Doc | Promise<Doc>)[] = [];
@@ -108,8 +113,8 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
             const viewSpecScript = Cast(this.props.Document.viewSpecScript, ScriptField);
             const childDocs = viewSpecScript ? docs.filter(d => viewSpecScript.script.run({ doc: d }, console.log).result) : docs;
 
-            const docFilters = this.docFilters();
-            const docRangeFilters = this.docRangeFilters();
+            const docFilters = this.childDocFilters();
+            const docRangeFilters = this.childDocRangeFilters();
             const searchDocs = this.searchFilterDocs();
             if (this.props.Document.dontRegisterView || (!docFilters.length && !docRangeFilters.length && !searchDocs.length)) {
                 return childDocs.filter(cd => !cd.cookies); // remove any documents that require a cookie if there are no filters to provide one
diff --git a/src/client/views/collections/CollectionTimeView.tsx b/src/client/views/collections/CollectionTimeView.tsx
index 08b5e6bac..292dfd77c 100644
--- a/src/client/views/collections/CollectionTimeView.tsx
+++ b/src/client/views/collections/CollectionTimeView.tsx
@@ -32,9 +32,7 @@ export class CollectionTimeView extends CollectionSubView(doc => doc) {
     @observable _collapsed: boolean = false;
     @observable _childClickedScript: Opt<ScriptField>;
     @observable _viewDefDivClick: Opt<ScriptField>;
-    @observable _focusDocFilters: Opt<string[]>; // fields that get overridden by a focus anchor
     @observable _focusPivotField: Opt<string>;
-    @observable _focusRangeFilters: Opt<string[]>;
 
     getAnchor = () => {
         const anchor = Docs.Create.HTMLAnchorDocument([], {
@@ -72,9 +70,9 @@ export class CollectionTimeView extends CollectionSubView(doc => doc) {
     @action
     setViewSpec = (anchor: Doc, preview: boolean) => {
         if (preview) {   // if in preview, then override document's fields with view spec
+            this._focusFilters = StrListCast(Doc.GetProto(anchor).docFilters);
+            this._focusRangeFilters = StrListCast(Doc.GetProto(anchor).docRangeFilters);
             this._focusPivotField = StrCast(anchor.pivotField);
-            this._focusDocFilters = StrListCast(anchor.docFilters);
-            this._focusRangeFilters = StrListCast(anchor.docRangeFilters);
         } else if (anchor.pivotField !== undefined) {  // otherwise set document's fields based on anchor view spec
             this.layoutDoc._prevFilterIndex = 1;
             this.layoutDoc._pivotField = StrCast(anchor.pivotField);
@@ -84,8 +82,6 @@ export class CollectionTimeView extends CollectionSubView(doc => doc) {
         return 0;
     }
 
-    pivotDocFilters = () => this._focusDocFilters || this.props.docFilters();
-    pivotDocRangeFilters = () => this._focusRangeFilters || this.props.docRangeFilters();
     layoutEngine = () => this._layoutEngine;
     toggleVisibility = action(() => this._collapsed = !this._collapsed);
 
@@ -139,10 +135,8 @@ export class CollectionTimeView extends CollectionSubView(doc => doc) {
         return <div className="collectionTimeView-innards" key="timeline" style={{ pointerEvents: this.props.isContentActive() ? undefined : "none" }}
             onClick={this.contentsDown}>
             <CollectionFreeFormView {...this.props}
-                engineProps={{ pivotField: this.pivotField, docFilters: this.docFilters, docRangeFilters: this.docRangeFilters }}
+                engineProps={{ pivotField: this.pivotField, docFilters: this.childDocFilters, docRangeFilters: this.childDocRangeFilters }}
                 fitContentsToDoc={returnTrue}
-                docFilters={this.pivotDocFilters}
-                docRangeFilters={this.pivotDocRangeFilters}
                 childClickScript={this._childClickedScript}
                 viewDefDivClick={this._viewDefDivClick}
                 childFreezeDimensions={true}
diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx
index e225c4a11..2718cbbbf 100644
--- a/src/client/views/collections/CollectionView.tsx
+++ b/src/client/views/collections/CollectionView.tsx
@@ -1,4 +1,4 @@
-import { computed, observable, runInAction } from 'mobx';
+import { computed, observable, runInAction, action } from 'mobx';
 import { observer } from "mobx-react";
 import * as React from 'react';
 import 'react-image-lightbox-with-rotate/style.css'; // This only needs to be imported once in your app
@@ -236,13 +236,19 @@ export class CollectionView extends ViewBoxAnnotatableComponent<ViewBoxAnnotatab
     * Shows the filter icon if it's a user-created collection which isn't a dashboard and has some docFilters applied on it or on the current dashboard.
     */
     @computed get showFilterIcon() {
-        return this.props.Document.viewType !== CollectionViewType.Docking && !Doc.IsSystem(this.props.Document) && ((StrListCast(this.props.Document._docFilters).length || StrListCast(this.props.Document._docRangeFilters).length || StrListCast(CurrentUserUtils.ActiveDashboard._docFilters).length || StrListCast(CurrentUserUtils.ActiveDashboard._docRangeFilters).length));
+        return this.props.Document.viewType !== CollectionViewType.Docking && !Doc.IsSystem(this.props.Document) && this._subView?.IsFiltered()
     }
 
+    @observable _subView: any = undefined;
+
     render() {
         TraceMobx();
         const props: SubCollectionViewProps = {
             ...this.props,
+            SetSubView: action((subView: any) => {
+                console.log("Setting sub", subView);
+                return this._subView = subView
+            }),
             addDocument: this.addDocument,
             moveDocument: this.moveDocument,
             removeDocument: this.removeDocument,
@@ -260,8 +266,8 @@ export class CollectionView extends ViewBoxAnnotatableComponent<ViewBoxAnnotatab
             {this.collectionViewType !== undefined ? this.SubView(this.collectionViewType, props) : (null)}
             {this.showFilterIcon ?
                 <FontAwesomeIcon icon={"filter"} size="lg"
-                    style={{ position: 'absolute', top: '1%', right: '1%', cursor: "pointer", padding: 1, color: '#18c718bd', zIndex: 1 }}
-                    onPointerDown={e => { runInAction(() => CurrentUserUtils.propertiesWidth = 250); e.stopPropagation(); }}
+                    style={{ position: 'absolute', top: '1%', right: '1%', cursor: "pointer", padding: 1, color: this.showFilterIcon === "hasFilter" ? '#18c718bd' : "orange", zIndex: 1 }}
+                    onPointerDown={action(e => { this.props.select(false); CurrentUserUtils.propertiesWidth = 250; e.stopPropagation(); })}
                 />
                 : (null)}
         </div>);
diff --git a/src/client/views/collections/TabDocView.tsx b/src/client/views/collections/TabDocView.tsx
index a24f1eb7a..623e0f58d 100644
--- a/src/client/views/collections/TabDocView.tsx
+++ b/src/client/views/collections/TabDocView.tsx
@@ -363,8 +363,8 @@ export class TabDocView extends React.Component<TabDocViewProps> {
                 PanelHeight={this.PanelHeight}
                 layerProvider={this.layerProvider}
                 styleProvider={DefaultStyleProvider}
-                docFilters={CollectionDockingView.Instance.docFilters}
-                docRangeFilters={CollectionDockingView.Instance.docRangeFilters}
+                docFilters={CollectionDockingView.Instance.childDocFilters}
+                docRangeFilters={CollectionDockingView.Instance.childDocRangeFilters}
                 searchFilterDocs={CollectionDockingView.Instance.searchFilterDocs}
                 addDocument={undefined}
                 removeDocument={undefined}
@@ -468,6 +468,7 @@ export class TabMinimapView extends React.Component<TabMinimapViewProps> {
             <div className="miniMap" style={{ width: miniSize, height: miniSize, background: this.props.background() }}>
                 <CollectionFreeFormView
                     Document={this.props.document}
+                    SetSubView={() => this}
                     CollectionView={undefined}
                     ContainingCollectionView={undefined}
                     ContainingCollectionDoc={undefined}
@@ -496,8 +497,8 @@ export class TabMinimapView extends React.Component<TabMinimapViewProps> {
                     layerProvider={undefined}
                     addDocTab={this.props.addDocTab}
                     pinToPres={TabDocView.PinDoc}
-                    docFilters={CollectionDockingView.Instance.docFilters}
-                    docRangeFilters={CollectionDockingView.Instance.docRangeFilters}
+                    docFilters={CollectionDockingView.Instance.childDocFilters}
+                    docRangeFilters={CollectionDockingView.Instance.childDocRangeFilters}
                     searchFilterDocs={CollectionDockingView.Instance.searchFilterDocs}
                     fitContentsToDoc={returnTrue}
                 />
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index ecc93285e..ba6222605 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -110,8 +110,6 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
     @observable _timelineRef = React.createRef<Timeline>();
     @observable _marqueeRef = React.createRef<HTMLDivElement>();
     @observable _keyframeEditing = false;
-    @observable _focusFilters: Opt<string[]>; // docFilters that are overridden when previewing a link to an anchor which has docFilters set on it
-    @observable _focusRangeFilters: Opt<string[]>; // docRangeFilters that are overridden when previewing a link to an anchor which has docRangeFilters set on it
     @observable ChildDrag: DocumentView | undefined; // child document view being dragged.  needed to update drop areas of groups when a group item is dragged.
 
     @computed get views() { return this._layoutElements.filter(ele => ele.bounds && !ele.bounds.z).map(ele => ele.ele); }
@@ -159,8 +157,6 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
         this.layoutDoc._viewScale = vals.scale;
     }
     freeformData = (force?: boolean) => this.fitToContent || force ? this.fitToContentVals : undefined;
-    freeformDocFilters = () => this._focusFilters;
-    freeformRangeDocFilters = () => this._focusRangeFilters;
     reverseNativeScaling = () => this.fitToContent ? true : false;
     panX = () => this.freeformData()?.bounds.cx ?? NumCast(this.Document._panX);
     panY = () => this.freeformData()?.bounds.cy ?? NumCast(this.Document._panY);
@@ -1030,8 +1026,8 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
             ScreenToLocalTransform={childLayout.z ? this.getTransformOverlay : this.getTransform}
             PanelWidth={childLayout[WidthSym]}
             PanelHeight={childLayout[HeightSym]}
-            docFilters={this.freeformDocFilters}
-            docRangeFilters={this.freeformRangeDocFilters}
+            docFilters={this.childDocFilters}
+            docRangeFilters={this.childDocRangeFilters}
             searchFilterDocs={this.searchFilterDocs}
             isContentActive={this.isAnnotationOverlay ? this.props.isContentActive : returnFalse}
             isDocumentActive={this.props.childDocumentsActive ? this.props.isDocumentActive : this.isContentActive}
diff --git a/src/client/views/collections/collectionMulticolumn/CollectionMulticolumnView.tsx b/src/client/views/collections/collectionMulticolumn/CollectionMulticolumnView.tsx
index f3a39a262..65c345547 100644
--- a/src/client/views/collections/collectionMulticolumn/CollectionMulticolumnView.tsx
+++ b/src/client/views/collections/collectionMulticolumn/CollectionMulticolumnView.tsx
@@ -237,8 +237,8 @@ export class CollectionMulticolumnView extends CollectionSubView(MulticolumnDocu
             onDoubleClick={this.onChildDoubleClickHandler}
             ScreenToLocalTransform={dxf}
             focus={this.props.focus}
-            docFilters={this.docFilters}
-            docRangeFilters={this.docRangeFilters}
+            docFilters={this.childDocFilters}
+            docRangeFilters={this.childDocRangeFilters}
             searchFilterDocs={this.searchFilterDocs}
             ContainingCollectionDoc={this.props.CollectionView?.props.Document}
             ContainingCollectionView={this.props.CollectionView}
diff --git a/src/client/views/collections/collectionMulticolumn/CollectionMultirowView.tsx b/src/client/views/collections/collectionMulticolumn/CollectionMultirowView.tsx
index 29cb3511a..30836854a 100644
--- a/src/client/views/collections/collectionMulticolumn/CollectionMultirowView.tsx
+++ b/src/client/views/collections/collectionMulticolumn/CollectionMultirowView.tsx
@@ -236,9 +236,9 @@ export class CollectionMultirowView extends CollectionSubView(MultirowDocument)
             onDoubleClick={this.onChildDoubleClickHandler}
             ScreenToLocalTransform={dxf}
             focus={this.props.focus}
-            docFilters={this.docFilters}
+            docFilters={this.childDocFilters}
             isContentActive={returnFalse}
-            docRangeFilters={this.docRangeFilters}
+            docRangeFilters={this.childDocRangeFilters}
             searchFilterDocs={this.searchFilterDocs}
             ContainingCollectionDoc={this.props.CollectionView?.props.Document}
             ContainingCollectionView={this.props.CollectionView}
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
index 585cda729..fed64b620 100644
--- a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
@@ -413,8 +413,8 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) {
                     isContentActive={returnTrue}
                     isDocumentActive={returnFalse}
                     ScreenToLocalTransform={this.getPreviewTransform}
-                    docFilters={this.docFilters}
-                    docRangeFilters={this.docRangeFilters}
+                    docFilters={this.childDocFilters}
+                    docRangeFilters={this.childDocRangeFilters}
                     searchFilterDocs={this.searchFilterDocs}
                     styleProvider={DefaultStyleProvider}
                     layerProvider={undefined}
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index c218b805e..bea219831 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -105,9 +105,9 @@ export interface DocumentViewSharedProps {
     styleProvider: Opt<StyleProviderFunc>;
     focus: DocFocusFunc;
     fitWidth?: () => boolean;
-    docFilters?: () => Opt<string[]>;
-    docRangeFilters?: () => Opt<string[]>;
-    searchFilterDocs?: () => Opt<Doc[]>;
+    docFilters: () => string[];
+    docRangeFilters: () => string[];
+    searchFilterDocs: () => Doc[];
     whenChildContentsActiveChanged: (isActive: boolean) => void;
     rootSelected: (outsideReaction?: boolean) => boolean; // whether the root of a template has been selected
     addDocTab: (doc: Doc, where: string) => boolean;
-- 
cgit v1.2.3-70-g09d2


From 3c78da4d7724ca411486083176e394b18177231d Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 4 Aug 2021 13:55:36 -0400
Subject: from last

---
 src/client/views/collections/CollectionSubView.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx
index e5f266acf..a9b5ce465 100644
--- a/src/client/views/collections/CollectionSubView.tsx
+++ b/src/client/views/collections/CollectionSubView.tsx
@@ -22,7 +22,7 @@ import ReactLoading from 'react-loading';
 
 export interface SubCollectionViewProps extends CollectionViewProps {
     CollectionView: Opt<CollectionView>;
-    SetSubView: (subView: any) => void;
+    SetSubView?: (subView: any) => void;
 }
 
 export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?: X) {
@@ -49,7 +49,7 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
         }
 
         componentDidMount() {
-            this.props.SetSubView(this);
+            this.props.SetSubView?.(this);
         }
 
         componentWillUnmount() {
-- 
cgit v1.2.3-70-g09d2


From 43119dc3fc8b156f9e15deab7b2e3dd5b541d7af Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 4 Aug 2021 20:14:30 -0400
Subject: fixed toggle ink as a mask.

---
 src/client/views/InkingStroke.tsx | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

(limited to 'src')

diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx
index 21059b330..63cefbf67 100644
--- a/src/client/views/InkingStroke.tsx
+++ b/src/client/views/InkingStroke.tsx
@@ -44,14 +44,13 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps, InkDocume
         CognitiveServices.Inking.Appliers.ConcatenateHandwriting(this.dataDoc, ["inkAnalysis", "handwriting"], [data]);
     }
 
-    @action
-    public static toggleMask = (inkDoc: Doc) => {
+    public static toggleMask = action((inkDoc: Doc) => {
         inkDoc.isInkMask = !inkDoc.isInkMask;
         inkDoc._backgroundColor = inkDoc.isInkMask ? "rgba(0,0,0,0.7)" : undefined;
         inkDoc.mixBlendMode = inkDoc.isInkMask ? "hard-light" : undefined;
         inkDoc.color = "#9b9b9bff";
         inkDoc._stayInCollection = inkDoc.isInkMask ? true : undefined;
-    }
+    });
 
     /**
      * Handles the movement of the entire ink object when the user clicks and drags.
-- 
cgit v1.2.3-70-g09d2


From 8907b0f7ecd8aa8b25fbe4138eef4ed3d3b249ba Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 4 Aug 2021 21:29:03 -0400
Subject: fixed setting of ink pen mode.

---
 src/client/views/collections/CollectionMenu.tsx | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionMenu.tsx b/src/client/views/collections/CollectionMenu.tsx
index a9b978c4e..8f4df4a92 100644
--- a/src/client/views/collections/CollectionMenu.tsx
+++ b/src/client/views/collections/CollectionMenu.tsx
@@ -665,7 +665,7 @@ export class CollectionFreeFormViewChrome extends React.Component<CollectionMenu
     }
 
     @computed get drawButtons() {
-        const func = action((i: number, keep: boolean) => {
+        const func = action((e: React.MouseEvent | React.PointerEvent, i: number, keep: boolean) => {
             this._keepPrimitiveMode = keep;
             if (this._selectedPrimitive !== i) {
                 this._selectedPrimitive = i;
@@ -683,13 +683,14 @@ export class CollectionFreeFormViewChrome extends React.Component<CollectionMenu
                 GestureOverlay.Instance.InkShape = "";
                 SetActiveBezierApprox("0");
             }
+            e.stopPropagation();
         });
         return <div className="btn-draw" key="draw">
             {this._draw.map((icon, i) =>
                 <Tooltip key={icon} title={<div className="dash-tooltip">{this._title[i]}</div>} placement="bottom">
                     <button className="antimodeMenu-button"
-                        onPointerDown={() => func(i, false)}
-                        onDoubleClick={() => func(i, true)}
+                        onPointerDown={e => func(e, i, false)}
+                        onDoubleClick={e => func(e, i, true)}
                         style={{ backgroundColor: i === this._selectedPrimitive ? "525252" : "", fontSize: "20" }}>
                         <FontAwesomeIcon icon={this._faName[i] as IconProp} size="sm" />
                     </button>
-- 
cgit v1.2.3-70-g09d2


From 6d9c65bf95091b0d5ee7e3097995fc9e2ead4415 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 5 Aug 2021 11:21:04 -0400
Subject: improved opening sidebar when following a link to a sidebar
 annotation.  Still needs work when link is from outside of the sidebar
 document and on first click.

---
 src/client/views/SidebarAnnos.tsx                  |  5 +++--
 src/client/views/nodes/PDFBox.tsx                  | 26 +++++++++++++++-------
 src/client/views/nodes/WebBox.tsx                  | 24 ++++++++++++++------
 .../views/nodes/formattedText/FormattedTextBox.tsx | 21 ++++++++++++-----
 4 files changed, 53 insertions(+), 23 deletions(-)

(limited to 'src')

diff --git a/src/client/views/SidebarAnnos.tsx b/src/client/views/SidebarAnnos.tsx
index 7b11723c3..f1d168a22 100644
--- a/src/client/views/SidebarAnnos.tsx
+++ b/src/client/views/SidebarAnnos.tsx
@@ -23,6 +23,7 @@ interface ExtraProps {
     layoutDoc: Doc;
     rootDoc: Doc;
     dataDoc: Doc;
+    showSidebar: boolean;
     whenChildContentsActiveChanged: (isActive: boolean) => void;
     ScreenToLocalTransform: () => Transform;
     sidebarAddDocument: (doc: (Doc | Doc[]), suffix: string) => boolean;
@@ -75,7 +76,7 @@ export class SidebarAnnos extends React.Component<FieldViewProps & ExtraProps> {
     get sidebarKey() { return this.props.fieldKey + "-sidebar"; }
     filtersHeight = () => 38;
     screenToLocalTransform = () => this.props.ScreenToLocalTransform().translate(Doc.NativeWidth(this.props.dataDoc), 0).scale(this.props.scaling?.() || 1);
-    panelWidth = () => !this.props.layoutDoc._showSidebar ? 0 : this.props.layoutDoc.type === DocumentType.RTF ? this.props.PanelWidth() : (NumCast(this.props.layoutDoc.nativeWidth) - Doc.NativeWidth(this.props.dataDoc)) * this.props.PanelWidth() / NumCast(this.props.layoutDoc.nativeWidth);
+    panelWidth = () => !this.props.showSidebar ? 0 : this.props.layoutDoc.type === DocumentType.RTF ? this.props.PanelWidth() : (NumCast(this.props.layoutDoc.nativeWidth) - Doc.NativeWidth(this.props.dataDoc)) * this.props.PanelWidth() / NumCast(this.props.layoutDoc.nativeWidth);
     panelHeight = () => this.props.PanelHeight() - this.filtersHeight();
     addDocument = (doc: Doc | Doc[]) => this.props.sidebarAddDocument(doc, this.sidebarKey);
     moveDocument = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (doc: Doc | Doc[]) => boolean) => this.props.moveDocument(doc, targetCollection, addDocument, this.sidebarKey);
@@ -103,7 +104,7 @@ export class SidebarAnnos extends React.Component<FieldViewProps & ExtraProps> {
                 {user}
             </div>;
         };
-        return !this.props.layoutDoc._showSidebar ? (null) :
+        return !this.props.showSidebar ? (null) :
             <div style={{
                 position: "absolute", pointerEvents: this.props.isContentActive() ? "all" : undefined, top: 0, right: 0,
                 background: this.props.styleProvider?.(this.props.rootDoc, this.props, StyleProp.WidgetColor),
diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx
index 0b451e2b4..fc8fa4eef 100644
--- a/src/client/views/nodes/PDFBox.tsx
+++ b/src/client/views/nodes/PDFBox.tsx
@@ -3,10 +3,10 @@ import { action, computed, IReactionDisposer, observable, reaction, runInAction
 import { observer } from "mobx-react";
 import * as Pdfjs from "pdfjs-dist";
 import "pdfjs-dist/web/pdf_viewer.css";
-import { Doc, Opt, WidthSym } from "../../../fields/Doc";
+import { Doc, Opt, WidthSym, DocListCast } from "../../../fields/Doc";
 import { documentSchema } from '../../../fields/documentSchemas';
 import { makeInterface } from "../../../fields/Schema";
-import { Cast, NumCast, StrCast } from '../../../fields/Types';
+import { Cast, NumCast, StrCast, BoolCast } from '../../../fields/Types';
 import { PdfField } from "../../../fields/URLField";
 import { TraceMobx } from '../../../fields/util';
 import { Utils, setupMoveUpEvents, emptyFunction } from '../../../Utils';
@@ -66,6 +66,9 @@ export class PDFBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
     }
 
     scrollFocus = (doc: Doc, smooth: boolean) => {
+        if (DocListCast(this.props.Document[this.fieldKey + "-sidebar"]).includes(doc) && !this.SidebarShown) {
+            this.toggleSidebar(!smooth);
+        }
         if (this._sidebarRef?.current?.makeDocUnfiltered(doc)) return 1;
         this._initialScrollTarget = doc;
         return this._pdfViewer?.scrollFocus(doc, smooth);
@@ -141,15 +144,18 @@ export class PDFBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
                 this.layoutDoc._showSidebar = nativeWidth !== this.layoutDoc._nativeWidth;
             }
             return false;
-        }, emptyFunction, this.toggleSidebar);
+        }, emptyFunction, () => this.toggleSidebar());
     }
-    toggleSidebar = action(() => {
+    toggleSidebar = action((preview: boolean = false) => {
         const nativeWidth = NumCast(this.layoutDoc[this.fieldKey + "-nativeWidth"]);
         const ratio = ((!this.layoutDoc.nativeWidth || this.layoutDoc.nativeWidth === nativeWidth ? 250 : 0) + nativeWidth) / nativeWidth;
         const curNativeWidth = NumCast(this.layoutDoc.nativeWidth, nativeWidth);
-        this.layoutDoc.nativeWidth = nativeWidth * ratio;
-        this.layoutDoc._width = this.layoutDoc[WidthSym]() * nativeWidth * ratio / curNativeWidth;
-        this.layoutDoc._showSidebar = nativeWidth !== this.layoutDoc._nativeWidth;
+        if (preview) this._showSidebar = true;
+        else {
+            this.layoutDoc.nativeWidth = nativeWidth * ratio;
+            this.layoutDoc._width = this.layoutDoc[WidthSym]() * nativeWidth * ratio / curNativeWidth;
+            this.layoutDoc._showSidebar = nativeWidth !== this.layoutDoc._nativeWidth;
+        }
     });
     settingsPanel() {
         const pageBtns = <>
@@ -202,7 +208,7 @@ export class PDFBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
                 </button>
             </div>;
     }
-    sidebarWidth = () => !this.layoutDoc._showSidebar ? 0 : (NumCast(this.layoutDoc.nativeWidth) - Doc.NativeWidth(this.dataDoc)) * this.props.PanelWidth() / NumCast(this.layoutDoc.nativeWidth);
+    sidebarWidth = () => !this.SidebarShown ? 0 : (NumCast(this.layoutDoc.nativeWidth) - Doc.NativeWidth(this.dataDoc)) * this.props.PanelWidth() / NumCast(this.layoutDoc.nativeWidth);
 
     specificContextMenu = (e: React.MouseEvent): void => {
         const funcs: ContextMenuProps[] = [];
@@ -223,6 +229,9 @@ export class PDFBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
     }
 
     anchorMenuClick = () => this._sidebarRef.current?.anchorMenuClick;
+    @observable _showSidebar = false;
+    @computed get SidebarShown() { return this._showSidebar || this.layoutDoc._showSidebar ? true : false; }
+
 
     @computed get renderPdfView() {
         TraceMobx();
@@ -255,6 +264,7 @@ export class PDFBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
                 rootDoc={this.rootDoc}
                 layoutDoc={this.layoutDoc}
                 dataDoc={this.dataDoc}
+                showSidebar={this.SidebarShown}
                 whenChildContentsActiveChanged={this.whenChildContentsActiveChanged}
                 sidebarAddDocument={this.sidebarAddDocument}
                 moveDocument={this.moveDocument}
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index f5b1f96f2..bb2c09fdf 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -160,6 +160,9 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
     menuControls = () => this.urlEditor; // controls to be added to the top bar when a document of this type is selected
 
     scrollFocus = (doc: Doc, smooth: boolean) => {
+        if (DocListCast(this.props.Document[this.fieldKey + "-sidebar"]).includes(doc) && !this.SidebarShown) {
+            this.toggleSidebar(!smooth);
+        }
         if (this._sidebarRef?.current?.makeDocUnfiltered(doc)) return 1;
         if (doc !== this.rootDoc && this._outerRef.current) {
             const windowHeight = this.props.PanelHeight() / (this.props.scaling?.() || 1);
@@ -449,17 +452,20 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
                 this.layoutDoc._showSidebar = nativeWidth !== this.layoutDoc._nativeWidth;
             }
             return false;
-        }, emptyFunction, this.toggleSidebar);
+        }, emptyFunction, () => this.toggleSidebar());
     }
-    toggleSidebar = action(() => {
+    toggleSidebar = action((preview: boolean = false) => {
         const nativeWidth = NumCast(this.layoutDoc[this.fieldKey + "-nativeWidth"]);
         const ratio = ((!this.layoutDoc.nativeWidth || this.layoutDoc.nativeWidth === nativeWidth ? 250 : 0) + nativeWidth) / nativeWidth;
         const curNativeWidth = NumCast(this.layoutDoc.nativeWidth, nativeWidth);
-        this.layoutDoc.nativeWidth = nativeWidth * ratio;
-        this.layoutDoc._width = this.layoutDoc[WidthSym]() * nativeWidth * ratio / curNativeWidth;
-        this.layoutDoc._showSidebar = nativeWidth !== this.layoutDoc._nativeWidth;
+        if (preview) this._showSidebar;
+        else {
+            this.layoutDoc.nativeWidth = nativeWidth * ratio;
+            this.layoutDoc._width = this.layoutDoc[WidthSym]() * nativeWidth * ratio / curNativeWidth;
+            this.layoutDoc._showSidebar = nativeWidth !== this.layoutDoc._nativeWidth;
+        }
     });
-    sidebarWidth = () => !this.layoutDoc._showSidebar ? 0 : (NumCast(this.layoutDoc.nativeWidth) - Doc.NativeWidth(this.dataDoc)) * this.props.PanelWidth() / NumCast(this.layoutDoc.nativeWidth);
+    sidebarWidth = () => !this.SidebarShown ? 0 : (NumCast(this.layoutDoc.nativeWidth) - Doc.NativeWidth(this.dataDoc)) * this.props.PanelWidth() / NumCast(this.layoutDoc.nativeWidth);
 
     @computed get content() {
         return <div className={"webBox-cont" + (!this.props.docViewPath().lastElement()?.docView?._pendingDoubleClick && this.isContentActive() && CurrentUserUtils.SelectedTool === InkTool.None && !DocumentDecorations.Instance?.Interacting ? "-interactive" : "")}
@@ -475,7 +481,10 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
                 <Annotation {...this.props} fieldKey={this.annotationKey} showInfo={this.showInfo} dataDoc={this.dataDoc} anno={anno} key={`${anno[Id]}-annotation`} />)
             }
         </div>;
+
     }
+    @observable _showSidebar = false;
+    @computed get SidebarShown() { return this._showSidebar || this.layoutDoc._showSidebar ? true : false; }
 
     showInfo = action((anno: Opt<Doc>) => this._overlayAnnoInfo = anno);
     setPreviewCursor = (func?: (x: number, y: number, drag: boolean) => void) => this._setPreviewCursor = func;
@@ -548,10 +557,11 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
                 </div >
                 <SidebarAnnos ref={this._sidebarRef}
                     {...this.props}
-                    fieldKey={this.annotationKey}
+                    fieldKey={this.fieldKey}
                     rootDoc={this.rootDoc}
                     layoutDoc={this.layoutDoc}
                     dataDoc={this.dataDoc}
+                    showSidebar={this.SidebarShown}
                     sidebarAddDocument={this.sidebarAddDocument}
                     moveDocument={this.moveDocument}
                     removeDocument={this.removeDocument}
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index f7e9ee028..d308345ec 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -120,7 +120,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
     public get EditorView() { return this._editorView; }
     public get SidebarKey() { return this.fieldKey + "-sidebar"; }
 
-    @computed get sidebarWidthPercent() { return StrCast(this.layoutDoc._sidebarWidthPercent, "0%"); }
+    @computed get sidebarWidthPercent() { return this._showSidebar ? "20%" : StrCast(this.layoutDoc._sidebarWidthPercent, "0%"); }
     @computed get sidebarColor() { return StrCast(this.layoutDoc.sidebarColor, StrCast(this.layoutDoc[this.props.fieldKey + "-backgroundColor"], "#e4e4e4")); }
     @computed get autoHeight() { return this.layoutDoc._autoHeight && !this.props.ignoreAutoHeight; }
     @computed get textHeight() { return NumCast(this.rootDoc[this.fieldKey + "-height"]); }
@@ -544,11 +544,16 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
         }
     }
 
+    @observable _showSidebar = false;
+    @computed get SidebarShown() { return this._showSidebar || this.layoutDoc._showSidebar ? true : false; }
+
     @action
-    toggleSidebar = () => {
+    toggleSidebar = (preview: boolean = false) => {
         const prevWidth = this.sidebarWidth();
-        this.layoutDoc._showSidebar = ((this.layoutDoc._sidebarWidthPercent = StrCast(this.layoutDoc._sidebarWidthPercent, "0%") === "0%" ? "50%" : "0%")) !== "0%";
-        this.layoutDoc._width = this.layoutDoc._showSidebar ? NumCast(this.layoutDoc._width) * 2 : Math.max(20, NumCast(this.layoutDoc._width) - prevWidth);
+        if (preview) this._showSidebar = true;
+        else this.layoutDoc._showSidebar = ((this.layoutDoc._sidebarWidthPercent = StrCast(this.layoutDoc._sidebarWidthPercent, "0%") === "0%" ? "50%" : "0%")) !== "0%";
+
+        this.layoutDoc._width = !preview && this.SidebarShown ? NumCast(this.layoutDoc._width) * 2 : Math.max(20, NumCast(this.layoutDoc._width) - prevWidth);
     }
     sidebarDown = (e: React.PointerEvent) => {
         setupMoveUpEvents(this, e, this.sidebarMove, emptyFunction, () => setTimeout(this.toggleSidebar), false);
@@ -726,6 +731,9 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
     }
 
     scrollFocus = (textAnchor: Doc, smooth: boolean) => {
+        if (DocListCast(this.Document[this.fieldKey + "-sidebar"]).includes(textAnchor) && !this.SidebarShown) {
+            this.toggleSidebar(!smooth);
+        }
         const textAnchorId = textAnchor[Id];
         const findAnchorFrag = (frag: Fragment, editor: EditorView) => {
             const nodes: Node[] = [];
@@ -1468,10 +1476,11 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
             return ComponentTag === CollectionStackingView ?
                 <SidebarAnnos ref={this._sidebarRef}
                     {...this.props}
-                    fieldKey={this.annotationKey}
+                    fieldKey={this.fieldKey}
                     rootDoc={this.rootDoc}
                     layoutDoc={this.layoutDoc}
                     dataDoc={this.dataDoc}
+                    showSidebar={this.SidebarShown}
                     PanelWidth={this.sidebarWidth}
                     setHeight={this.setSidebarHeight}
                     sidebarAddDocument={this.sidebarAddDocument}
@@ -1569,7 +1578,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
                             }}
                         />
                     </div>
-                    {(this.props.noSidebar || this.Document._noSidebar) || this.props.dontSelectOnLoad || !this.layoutDoc._showSidebar || this.sidebarWidthPercent === "0%" ? (null) : this.sidebarCollection}
+                    {(this.props.noSidebar || this.Document._noSidebar) || this.props.dontSelectOnLoad || !this.SidebarShown || this.sidebarWidthPercent === "0%" ? (null) : this.sidebarCollection}
                     {(this.props.noSidebar || this.Document._noSidebar) || this.props.dontSelectOnLoad || this.Document._singleLine ? (null) : this.sidebarHandle}
                     {!this.layoutDoc._showAudio ? (null) : this.audioHandle}
                 </div>
-- 
cgit v1.2.3-70-g09d2


From b9d72dd3ed3b800ef9bd1f6695ac37e14d21f675 Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Thu, 5 Aug 2021 15:18:00 -0400
Subject: removed drop shadow from MyTools sidebar

---
 src/client/util/CurrentUserUtils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 66f9d060f..e1cbaf125 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -748,7 +748,7 @@ export class CurrentUserUtils {
         if (doc.myTools === undefined) {
             const toolsStack = new PrefetchProxy(Docs.Create.StackingDocument([doc.myCreators as Doc, doc.myColorPicker as Doc], {
                 title: "My Tools", _width: 500, _yMargin: 20, ignoreClick: true, _lockedPosition: true, _forceActive: true,
-                system: true, _stayInCollection: true, _hideContextMenu: true, _chromeHidden: true,
+                system: true, _stayInCollection: true, _hideContextMenu: true, _chromeHidden: true, boxShadow: "0 0",
             })) as any as Doc;
 
             doc.myTools = toolsStack;
-- 
cgit v1.2.3-70-g09d2