From fa3e2a4cee2c59233d12580bd61bfe34b210967b Mon Sep 17 00:00:00 2001
From: dbetter <danielb@endor.com>
Date: Fri, 19 Feb 2021 12:07:50 +0200
Subject: [PATCH] Support user provided auto-complete - Use by providing a user
 defined function with respect to text editor model and text positoning

---
 src/index.tsx | 22 +++++++++++++++++++---
 1 file changed, 19 insertions(+), 3 deletions(-)

diff --git a/src/index.tsx b/src/index.tsx
index 338ac5c4..d6fd37e4 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,6 +1,6 @@
 import React, { useImperativeHandle, useEffect, useRef, useState } from 'react';
 import * as monaco from 'monaco-editor';
-import { editor } from 'monaco-editor';
+import {editor, languages} from 'monaco-editor';
 
 function noop() {}
 
@@ -29,6 +29,10 @@ export interface MonacoEditorProps extends Omit<React.HTMLAttributes<HTMLDivElem
    * To not create automatically a model, use `model: null`.
    */
   language?: monaco.editor.IStandaloneEditorConstructionOptions['language'];
+  /**
+   * User provided extension function provider for auto-complete.
+   */
+  autoComplete?: (model: monaco.editor.ITextModel, position: monaco.Position) => languages.CompletionItem[];
   /**
    * Initial theme to be used for rendering.
    * The current out-of-the-box available themes are: 'vs' (default), 'vs-dark', 'hc-black'.
@@ -57,7 +61,7 @@ export interface RefEditorInstance {
 }
 
 function MonacoEditor(props: MonacoEditorProps, ref: ((instance: RefEditorInstance) => void) | React.RefObject<RefEditorInstance> | null | undefined) {
-  const { width = '100%', height = '100%', value = '', theme = '', language = 'javascript', options = {}, editorDidMount = noop, onChange = noop, defaultValue = '', ...other } = props;
+  const { width = '100%', height = '100%', value = '', theme = '', language = 'javascript', autoComplete, options = {}, editorDidMount = noop, onChange = noop, defaultValue = '', ...other } = props;
   options.language = language || options.language;
   options.theme = theme || options.theme;
   const [val, setVal] = useState(defaultValue);
@@ -86,6 +90,18 @@ function MonacoEditor(props: MonacoEditorProps, ref: ((instance: RefEditorInstan
 
   useEffect(() => {
     if (value !== val && editor.current) {
+      if (autoComplete) {
+        if (editor?.current?.getModel() && editor?.current?.getPosition()) {
+          monaco.languages.registerCompletionItemProvider(language, {
+            provideCompletionItems: (model, position) => {
+              return {
+                suggestions: autoComplete(model, position)
+              };
+            }
+          });
+        }
+      }
+
       setVal(value);
       editor.current.setValue(value);
     }
@@ -115,4 +131,4 @@ function MonacoEditor(props: MonacoEditorProps, ref: ((instance: RefEditorInstan
   return <div {...other} ref={container} style={{ ...other.style, width, height }} />;
 }
 
-export default React.forwardRef<RefEditorInstance, MonacoEditorProps>(MonacoEditor);
+export default React.forwardRef<RefEditorInstance, MonacoEditorProps>(MonacoEditor);
\ No newline at end of file