From 60ceef0a3a8c11d85434a154e542424d34d9562c Mon Sep 17 00:00:00 2001
From: Tyler Schicke <tyler_schicke@brown.edu>
Date: Sat, 13 Jul 2019 16:46:49 -0400
Subject: Refactored style in DocDecs and added metadata entry to DocDecs

---
 src/client/views/MetadataEntryMenu.scss | 10 ++++++++++
 1 file changed, 10 insertions(+)
 create mode 100644 src/client/views/MetadataEntryMenu.scss

(limited to 'src/client/views/MetadataEntryMenu.scss')

diff --git a/src/client/views/MetadataEntryMenu.scss b/src/client/views/MetadataEntryMenu.scss
new file mode 100644
index 000000000..73e5b6a73
--- /dev/null
+++ b/src/client/views/MetadataEntryMenu.scss
@@ -0,0 +1,10 @@
+.metadataEntry-input {
+    width: 40%;
+    margin-left: 5px;
+    margin-right: 5px;
+}
+
+.metadataEntry-outerDiv {
+    display: flex;
+    width: 300px;
+}
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From 86bf6857e98743502fe6bc85e7de6807808c41c4 Mon Sep 17 00:00:00 2001
From: Tyler Schicke <tyler_schicke@brown.edu>
Date: Sun, 14 Jul 2019 12:36:46 -0400
Subject: Fixed some of the auto suggest stuff

---
 src/client/views/MetadataEntryMenu.scss | 57 +++++++++++++++++++++++++++++++++
 src/client/views/MetadataEntryMenu.tsx  |  7 ++--
 2 files changed, 61 insertions(+), 3 deletions(-)

(limited to 'src/client/views/MetadataEntryMenu.scss')

diff --git a/src/client/views/MetadataEntryMenu.scss b/src/client/views/MetadataEntryMenu.scss
index 73e5b6a73..469843350 100644
--- a/src/client/views/MetadataEntryMenu.scss
+++ b/src/client/views/MetadataEntryMenu.scss
@@ -7,4 +7,61 @@
 .metadataEntry-outerDiv {
     display: flex;
     width: 300px;
+}
+
+.react-autosuggest__container {
+    position: relative;
+}
+
+.react-autosuggest__input {
+    width: 240px;
+    height: 30px;
+    padding: 10px 20px;
+    font-family: Helvetica, sans-serif;
+    font-weight: 300;
+    font-size: 16px;
+    border: 1px solid #aaa;
+    border-radius: 4px;
+}
+
+.react-autosuggest__input--focused {
+    outline: none;
+}
+
+.react-autosuggest__input--open {
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+}
+
+.react-autosuggest__suggestions-container {
+    display: none;
+}
+
+.react-autosuggest__suggestions-container--open {
+    display: block;
+    position: fixed;
+    width: 280px;
+    border: 1px solid #aaa;
+    background-color: #fff;
+    font-family: Helvetica, sans-serif;
+    font-weight: 300;
+    font-size: 16px;
+    border-bottom-left-radius: 4px;
+    border-bottom-right-radius: 4px;
+    z-index: 2;
+}
+
+.react-autosuggest__suggestions-list {
+    margin: 0;
+    padding: 0;
+    list-style-type: none;
+}
+
+.react-autosuggest__suggestion {
+    cursor: pointer;
+    padding: 10px 20px;
+}
+
+.react-autosuggest__suggestion--highlighted {
+    background-color: #ddd;
 }
\ No newline at end of file
diff --git a/src/client/views/MetadataEntryMenu.tsx b/src/client/views/MetadataEntryMenu.tsx
index 0c8fd3909..cb574aa96 100644
--- a/src/client/views/MetadataEntryMenu.tsx
+++ b/src/client/views/MetadataEntryMenu.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import "./MetadataEntryMenu.scss";
 import { observer } from 'mobx-react';
-import { observable, action, runInAction } from 'mobx';
+import { observable, action, runInAction, trace } from 'mobx';
 import { KeyValueBox } from './nodes/KeyValueBox';
 import { Doc } from '../../new_fields/Doc';
 import * as Autosuggest from 'react-autosuggest';
@@ -20,8 +20,8 @@ export class MetadataEntryMenu extends React.Component<MetadataEntryProps>{
     @observable private suggestions: string[] = [];
 
     @action
-    onKeyChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-        this._currentKey = e.target.value;
+    onKeyChange = (e: React.ChangeEvent, { newValue }: { newValue: string }) => {
+        this._currentKey = newValue;
     }
 
     @action
@@ -102,6 +102,7 @@ export class MetadataEntryMenu extends React.Component<MetadataEntryProps>{
     }
 
     render() {
+        trace();
         return (
             <div className="metadataEntry-outerDiv">
                 Key:
-- 
cgit v1.2.3-70-g09d2


From d09679619e7cf0fbae60e1f9220a6dbeb9de1bd7 Mon Sep 17 00:00:00 2001
From: Tyler Schicke <tyler_schicke@brown.edu>
Date: Sun, 14 Jul 2019 14:35:50 -0400
Subject: Fixed metadata entry css

---
 src/client/views/MetadataEntryMenu.scss | 23 ++++++++++-------------
 src/client/views/MetadataEntryMenu.tsx  | 11 +++++++++--
 2 files changed, 19 insertions(+), 15 deletions(-)

(limited to 'src/client/views/MetadataEntryMenu.scss')

diff --git a/src/client/views/MetadataEntryMenu.scss b/src/client/views/MetadataEntryMenu.scss
index 469843350..a6df3cd1e 100644
--- a/src/client/views/MetadataEntryMenu.scss
+++ b/src/client/views/MetadataEntryMenu.scss
@@ -1,9 +1,3 @@
-.metadataEntry-input {
-    width: 40%;
-    margin-left: 5px;
-    margin-right: 5px;
-}
-
 .metadataEntry-outerDiv {
     display: flex;
     width: 300px;
@@ -13,15 +7,18 @@
     position: relative;
 }
 
+.react-autosuggest__container,
+.metadataEntry-input {
+    width: 100%;
+    margin-left: 5px;
+    margin-right: 5px;
+}
+
+.metadataEntry-input,
 .react-autosuggest__input {
-    width: 240px;
-    height: 30px;
-    padding: 10px 20px;
-    font-family: Helvetica, sans-serif;
-    font-weight: 300;
-    font-size: 16px;
     border: 1px solid #aaa;
     border-radius: 4px;
+    width: 100%;
 }
 
 .react-autosuggest__input--focused {
@@ -40,7 +37,7 @@
 .react-autosuggest__suggestions-container--open {
     display: block;
     position: fixed;
-    width: 280px;
+    width: 180px;
     border: 1px solid #aaa;
     background-color: #fff;
     font-family: Helvetica, sans-serif;
diff --git a/src/client/views/MetadataEntryMenu.tsx b/src/client/views/MetadataEntryMenu.tsx
index cb574aa96..59de0e2b4 100644
--- a/src/client/views/MetadataEntryMenu.tsx
+++ b/src/client/views/MetadataEntryMenu.tsx
@@ -19,6 +19,8 @@ export class MetadataEntryMenu extends React.Component<MetadataEntryProps>{
     @observable private _currentValue: string = "";
     @observable private suggestions: string[] = [];
 
+    private autosuggestRef = React.createRef<Autosuggest>();
+
     @action
     onKeyChange = (e: React.ChangeEvent, { newValue }: { newValue: string }) => {
         this._currentKey = newValue;
@@ -62,6 +64,10 @@ export class MetadataEntryMenu extends React.Component<MetadataEntryProps>{
     clearInputs = () => {
         this._currentKey = "";
         this._currentValue = "";
+        if (this.autosuggestRef.current) {
+            const input: HTMLInputElement = (this.autosuggestRef.current as any).input;
+            input && input.focus();
+        }
     }
 
     getKeySuggestions = async (value: string): Promise<string[]> => {
@@ -106,12 +112,13 @@ export class MetadataEntryMenu extends React.Component<MetadataEntryProps>{
         return (
             <div className="metadataEntry-outerDiv">
                 Key:
-                <Autosuggest inputProps={{ value: this._currentKey, onChange: this.onKeyChange, className: "metadataEntry-input" }}
+                <Autosuggest inputProps={{ value: this._currentKey, onChange: this.onKeyChange }}
                     getSuggestionValue={this.getSuggestionValue}
                     suggestions={this.suggestions}
                     renderSuggestion={this.renderSuggestion}
                     onSuggestionsFetchRequested={this.onSuggestionFetch}
-                    onSuggestionsClearRequested={this.onSuggestionClear} />
+                    onSuggestionsClearRequested={this.onSuggestionClear}
+                    ref={this.autosuggestRef} />
                 Value:
                 <input className="metadataEntry-input" value={this._currentValue} onChange={this.onValueChange} onKeyDown={this.onValueKeyDown} />
             </div>
-- 
cgit v1.2.3-70-g09d2


From 68c135f23c54cc44a84fb17223bc49e3b7bff1a8 Mon Sep 17 00:00:00 2001
From: Tyler Schicke <tyler_schicke@brown.edu>
Date: Sun, 14 Jul 2019 19:20:03 -0400
Subject: Fixed a couple issues

---
 src/client/views/MetadataEntryMenu.scss                                | 2 ++
 src/client/views/MetadataEntryMenu.tsx                                 | 1 +
 .../views/collections/collectionFreeForm/CollectionFreeFormView.tsx    | 3 ++-
 3 files changed, 5 insertions(+), 1 deletion(-)

(limited to 'src/client/views/MetadataEntryMenu.scss')

diff --git a/src/client/views/MetadataEntryMenu.scss b/src/client/views/MetadataEntryMenu.scss
index a6df3cd1e..bcfc9a82d 100644
--- a/src/client/views/MetadataEntryMenu.scss
+++ b/src/client/views/MetadataEntryMenu.scss
@@ -37,6 +37,8 @@
 .react-autosuggest__suggestions-container--open {
     display: block;
     position: fixed;
+    overflow-y: auto;
+    max-height: 400px;
     width: 180px;
     border: 1px solid #aaa;
     background-color: #fff;
diff --git a/src/client/views/MetadataEntryMenu.tsx b/src/client/views/MetadataEntryMenu.tsx
index 5ee661944..bd5a307b3 100644
--- a/src/client/views/MetadataEntryMenu.tsx
+++ b/src/client/views/MetadataEntryMenu.tsx
@@ -158,6 +158,7 @@ export class MetadataEntryMenu extends React.Component<MetadataEntryProps>{
                 <Autosuggest inputProps={{ value: this._currentKey, onChange: this.onKeyChange }}
                     getSuggestionValue={this.getSuggestionValue}
                     suggestions={this.suggestions}
+                    alwaysRenderSuggestions
                     renderSuggestion={this.renderSuggestion}
                     onSuggestionsFetchRequested={this.onSuggestionFetch}
                     onSuggestionsClearRequested={this.onSuggestionClear}
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index b75cf7d5e..19e280444 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -485,7 +485,8 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
                     const script = this.Document[key];
                     let originalText: string | undefined = undefined;
                     if (script) originalText = script.script.originalScript;
-                    let scriptingBox = <ScriptBox initialText={originalText} onCancel={overlayDisposer} onSave={(text, onError) => {
+                    // tslint:disable-next-line: no-unnecessary-callback-wrapper
+                    let scriptingBox = <ScriptBox initialText={originalText} onCancel={() => overlayDisposer()} onSave={(text, onError) => {
                         const script = CompileScript(text, {
                             params,
                             requiredType,
-- 
cgit v1.2.3-70-g09d2