# Autocompletion & Suggestions in Editor

The **Autocompletion and Suggestions** feature in our Monaco Editor integration provides developers with intelligent, context-aware code completion for Solidity smart contracts. This feature leverages the Monaco Editor's capabilities, augmented by a custom backend API, to offer real-time suggestions, snippets, and ghost text, enhancing coding efficiency and reducing errors during smart contract development.

### Feature Overview

This feature is designed to assist developers by providing:

* **Context-Aware Autocompletion**: Suggestions are generated based on the current code context, such as keywords, function signatures, and Solidity-specific constructs (e.g., contract, function, event).
* **Code Snippets**: Predefined templates for common Solidity patterns like contracts, functions, events, and modifiers, which can be inserted with a single selection.
* **Ghost Text**: Inline preview of suggested code that can be accepted with a Tab key press, offering a seamless coding experience.
* **Custom Suggestion Box**: A UI component displaying detailed suggestions with documentation, types, and icons, triggered by specific keywords or key combinations (e.g., Ctrl+Shift+S).

#### Key Features in Detail

#### 1. Suggestion Box

* **Trigger**: Activated via Ctrl+Shift+S or automatically based on context.
* **Content**: Displays a list of suggestions with:
  * **Icons**: Visual indicators for types (e.g., ⚡ for functions, 📄 for contracts).
  * **Documentation**: Brief descriptions of each suggestion.
  * **Types**: Indicates whether the suggestion is a function, contract, event, etc.
* **Example**: Suggestions for contract include a full template with state variables, events, and functions.

<figure><img src="https://3633094706-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fj7rwyc4EeGqNoC2Ji4bS%2Fuploads%2F3l0bJ1Cjs3dhNXaIFjjq%2FScreenshot%202025-05-07%20101153.png?alt=media&#x26;token=bdd13055-bf09-4138-8583-01ca13597b1e" alt=""><figcaption><p>Suggestion box</p></figcaption></figure>

#### 2. Autocompletion

* **Trigger Characters**: Suggestions are triggered by characters like ., (, {, =, and even a space, ensuring seamless integration into the coding workflow.
* **Solidity-Specific Suggestions**: Includes keywords (public, private), types (uint256, address), and snippets for common patterns.
* **Example**: Typing modifier suggests onlyOwner with a complete implementation, as shown in the screenshot.

#### 3. Ghost Text

* **Behavior**: Displays a preview of the suggested code inline, styled in italic with a dotted underline.
* **Interaction**: Press Tab to accept the suggestion, or continue typing to ignore it.
* **Performance**: Suggestions are fetched with a 300ms debounce to avoid overwhelming the backend.

<figure><img src="https://3633094706-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fj7rwyc4EeGqNoC2Ji4bS%2Fuploads%2FbUtFvxIid8OXXoM8WzPo%2FScreenshot%202025-05-07%20101239.png?alt=media&#x26;token=9c7cac92-2683-4362-9cb7-123de30f0f59" alt=""><figcaption><p>Autocompletion-Ghost box</p></figcaption></figure>

### Benefits

* **Faster Development**: Focus more on logic, less on boilerplate.
* **Error Reduction**: Use verified and complete code patterns.
* **Learning Tool**: Great for beginners with inline docs and context.
* **Custom & AI Suggestions**: Supports both hardcoded templates and backend-powered, context-sensitive suggestions.

### Future Improvements

* Enhance AI suggestion accuracy by integrating a more powerful model.
* Add support for more languages beyond Solidity.
* Improve suggestion ranking based on user history and project context.
* Optimize backend performance for larger codebases.

This feature significantly enhances the developer experience by combining the power of Monaco Editor with intelligent, context-aware suggestions tailored for Solidity development.