@operato/app 1.11.3 → 1.11.6

package/package.json

@@ -2,7 +2,7 @@
   "name": "@operato/app",
   "description": "WebApplication production supporting components following open-wc recommendations",
   "author": "heartyoh",
-  "version": "1.11.3",
+  "version": "1.11.6",
   "main": "dist/src/index.js",
   "module": "dist/src/index.js",
   "exports": {
@@ -136,15 +136,15 @@
     "@material/mwc-button": "^0.27.0",
     "@material/mwc-icon": "^0.27.0",
     "@material/mwc-icon-button": "^0.27.0",
-    "@operato/attachment": "^1.11.3",
-    "@operato/data-grist": "^1.11.3",
-    "@operato/font": "^1.11.3",
+    "@operato/attachment": "^1.11.6",
+    "@operato/data-grist": "^1.11.6",
+    "@operato/font": "^1.11.6",
     "@operato/form": "^1.11.3",
     "@operato/graphql": "^1.4.76",
     "@operato/i18n": "^1.5.14",
-    "@operato/input": "^1.11.3",
+    "@operato/input": "^1.11.5",
     "@operato/layout": "^1.11.3",
-    "@operato/property-editor": "^1.11.3",
+    "@operato/property-editor": "^1.11.6",
     "@operato/shell": "^1.9.0",
     "@operato/styles": "^1.7.3",
     "@operato/utils": "^1.5.44",
@@ -189,5 +189,5 @@
       "prettier --write"
     ]
   },
-  "gitHead": "f4c3cf2f3a6e66f0b52b1b69cc21719706d2ac68"
+  "gitHead": "30d8c21bb20413a6e7906dbe07f4caef6a109e66"
 }

package/src/input/ox-input-graphql.ts

@@ -53,6 +53,7 @@ export default class OxInputGraphql extends OxFormField {
 
   private _self_changing: boolean = false
   private _editor?: EditorView
+  private _changed: boolean = false
 
   async updated(changes: PropertyValues<this>) {
     const editor = await this.getEditor()
@@ -113,25 +114,15 @@ export default class OxInputGraphql extends OxFormField {
           }),
           highlightActiveLine(),
           history(),
-          keymap.of([
-            ...historyKeymap,
-            indentWithTab,
-            {
-              key: 'Escape',
-              run: (view: EditorView) => {
-                togglefullscreen(this)
-                return true
-              }
-            }
-          ]),
-          EditorView.updateListener.of(v => {
+          keymap.of([...historyKeymap, indentWithTab]),
+          EditorView.updateListener.of(async v => {
             if (v.docChanged) {
               this._self_changing = true
-              this.value = v.state.doc.toString()
-              this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true, detail: this.value }))
-              requestAnimationFrame(() => {
-                this._self_changing = false
-              })
+              this._changed = true
+
+              await this.updateComplete
+
+              this._self_changing = false
             }
           })
         ],
@@ -139,6 +130,23 @@ export default class OxInputGraphql extends OxFormField {
       })
     }
 
+    this._editor.contentDOM.addEventListener('keydown', event => {
+      event.stopPropagation()
+
+      if (event.key === 'Escape') {
+        togglefullscreen(this._editor!.contentDOM)
+      }
+    })
+
+    this._editor.contentDOM.addEventListener('blur', e => {
+      if (!this._changed) {
+        return
+      }
+
+      this.value = this._editor!.state.doc.toString()
+      this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true, detail: this.value }))
+    })
+
     return this._editor
   }
 }