kibana/packages/kbn-text-based-editor
Stratoula Kalafateli 5ed2723355
[ES|QL] Various fixes in editor loading functionality (#186445)
## Summary

Closes https://github.com/elastic/kibana/issues/185886

This PR:

- make some fixes in the loading logic
- allows the user to edit the query even if another one is running
- fixes a bug in inline editing where the CMD + Enter command didnt work
after the first run
2024-06-21 07:59:54 +02:00
..
.storybook [Text based languages] Creates editor reusable component (#158008) 2023-05-22 14:27:38 +03:00
scripts [ES|QL] gather inline function documentation from Elasticsearch (#184689) 2024-06-10 14:12:26 -07:00
src [ES|QL] Various fixes in editor loading functionality (#186445) 2024-06-21 07:59:54 +02:00
index.ts [ResponseOps][Alerting] ESQL alerting rule type ( pointed at main) (#165480) 2023-09-05 06:59:52 -07:00
jest.config.js [ES|QL] Query history (#178302) 2024-03-28 15:59:47 +01:00
kibana.jsonc Move esql code to the new kibana-esql team (#179454) 2024-03-27 07:47:08 +01:00
package.json [ES|QL] add docs step to sync pipeline (#186011) 2024-06-12 17:42:37 -07:00
README.md [Text based languages] Creates editor reusable component (#158008) 2023-05-22 14:27:38 +03:00
setup_tests.ts [ES|QL] Query history (#178302) 2024-03-28 15:59:47 +01:00
tsconfig.json [ES|QL] Some UI enhancements in the editor (#184733) 2024-06-07 16:00:13 +02:00

@kbn/text-based-editor

Contains the editor for text based languages. Specifically for:

  • ESQL, with autocomplete and syntax highlighting
  • SQL, with syntax highlighting

Contains the ESQL editor with the autocomplete and the autosuggest functionality (based on atlr). The antlr code can be found in packages/kbn-monaco/src/esql

A monaco based editor that is part of the unified search experience. It is rendered for all the applications that support text-based languages. In order to enable text based languages on your unified search bar add textBasedLanguages: ['SQL', 'ESQL', '...'] to the dataViewPicker properties.

Languages supported

  • SQL: based on the Elasticsearch sql api
  • ESQL: based on the Elastisearch esql api

Features

  • The editor operates in 3 modes:
    • The inline mode: This is the one liner compact mode. If the query is large or consists of >1 lines then the user can't see the entire query.
    • The inline focused mode. The editor is transferred to this mode automatically when the user clicks on the above mode. On this mode the user can work with multiple lines, see the entire context, see the errors, the editor line numbers and interact with the editor on a compact way. The editor returns automatically to the inline mode when the user clicks outside the editor.
    • The expanded mode: The user has to click the maximize button to use this mode. Here the user has more space and can also minimize/maximize the editor height with a drag and drop experience.
  • The editor has a built in way to depict the errors but the user has to submit the query first. The error should be on the inline focuses mode or the expanded mode to view the errors details.
  • The editor is responsive regardless of the mode selected.
  • The editor has a built in documentation that dynamically changes based on the language of the query.
  • The user can quickly submit the query by pressing CMD/CTRL + Enter.