@covalent/code-editor

Covalent-Code-Editor is a Text and Code Editor built on Covalent and Angular Material

Covalent is a reusable UI platform from Teradata for building web applications with common standards and tooling. It is based on Angular 2 and Material Design.

Covalent Github Repo: https://github.com/Teradata/covalent

Covalent-Code-Editor is an Angular Component for text and code editing based on Covalent

Setup

• Add the following dependency to package.json

"dependencies": {
    "@covalent/code-editor": "^1.0.0-alpha.2"
  },

• Important: Add the glob to assets in .angular-cli.json (to make monaco-editor javascript available to the app)

{
  "apps": [
    {
      "assets": [
        { "glob": "**/*", "input": "../node_modules/@covalent/code-editor/assets/monaco", "output": "./assets/monaco/" }
      ],

• Add the following tag to html file

<td-code-editor theme="vs" flex language="sql"></td-code-editor>

• Import the covalent-editor component into app.module.ts

import { CovalentCodeEditorModule } from '@covalent/code-editor';
...

imports: [
    CovalentCodeEditorModule.forRoot(),

...

API

Events

• onEditorInitialized
• onEditorConfigurationChanged
• onEditorLanguageChanged
• onEditorValueChange

Getters and Setters

• value
• language
• registerLanguage
• editorStyle
• theme
• isElectronApp

---

• Contributing Guidelines