kibana/packages/shared-ux/code_editor/impl
2023-02-01 17:55:44 -06:00
..
__snapshots__ [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
languages [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
code_editor.stories.tsx [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
code_editor.test.helpers.tsx [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
code_editor.test.tsx [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
code_editor.tsx [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
editor.styles.ts [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
index.ts [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
jest.config.js [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
kibana.jsonc fix codeowners 2023-02-01 17:55:44 -06:00
package.json [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
placeholder_widget.ts [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
README.mdx [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
register_languages.ts [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
remeasure_fonts.ts [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00
tsconfig.json [Shared UX] Migrate code editor from kibana_react plugin to shared_ux package (#148550) 2023-01-30 15:13:38 -07:00

---
id: sharedUX/Components/CodeEditor
slug: /shared-ux/components/code-editor
title: Code Editor
description: A code editor to display code and edit code in Kibana.
tags: ['shared-ux', 'component']
date: 2022-12-05
---

## Description

This component is an abstraction of the [Monaco Code Editor](https://microsoft.github.io/monaco-editor/) (and the [React Monaco Editor component](https://github.com/react-monaco-editor/react-monaco-editor)). This component still allows access to the other Monaco features.

## Usage

This editor component allows easy access to:
* [Syntax highlighting (including custom language highlighting)](https://microsoft.github.io/monaco-editor/playground.html#extending-language-services-custom-languages)
* [Suggestion/autocompletion widget](https://microsoft.github.io/monaco-editor/playground.html#extending-language-services-completion-provider-example)
* Function signature widget 
* [Hover widget](https://microsoft.github.io/monaco-editor/playground.html#extending-language-services-hover-provider-example)

The Monaco editor doesn't automatically resize the editor area on window or container resize so this component includes a [resize detector](https://github.com/maslianok/react-resize-detector) to cause the Monaco editor to re-layout and adjust its size when the window or container size changes

## API