@fc-components/monaco-editor 0.1.3 → 0.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +6 -0
- package/dist/monaco-editor.cjs.development.js +12 -4
- package/dist/monaco-editor.cjs.development.js.map +1 -1
- package/dist/monaco-editor.cjs.production.min.js +1 -1
- package/dist/monaco-editor.cjs.production.min.js.map +1 -1
- package/dist/monaco-editor.esm.js +12 -4
- package/dist/monaco-editor.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/promql/index.tsx +13 -4
package/package.json
CHANGED
package/src/promql/index.tsx
CHANGED
|
@@ -27,7 +27,6 @@ interface PromQLEditorProps {
|
|
|
27
27
|
}
|
|
28
28
|
|
|
29
29
|
const PROMQL_LANG_ID = promLanguageDefinition.id;
|
|
30
|
-
const EDITOR_HEIGHT_OFFSET = 2;
|
|
31
30
|
const SIZE_MAP: Record<
|
|
32
31
|
string,
|
|
33
32
|
{
|
|
@@ -53,8 +52,8 @@ const SIZE_MAP: Record<
|
|
|
53
52
|
},
|
|
54
53
|
};
|
|
55
54
|
const themeMap: Record<string, string> = {
|
|
56
|
-
light: '
|
|
57
|
-
dark: '
|
|
55
|
+
light: 'light',
|
|
56
|
+
dark: 'n9e-dark',
|
|
58
57
|
};
|
|
59
58
|
|
|
60
59
|
const getStyles = (placeholder?: string) => {
|
|
@@ -98,6 +97,16 @@ export default function PromQLEditor(props: PromQLEditorProps & DataProviderPara
|
|
|
98
97
|
}, []);
|
|
99
98
|
|
|
100
99
|
const handleEditorDidMount = (editor: monacoTypes.editor.IStandaloneCodeEditor) => {
|
|
100
|
+
monaco.editor.defineTheme('n9e-dark', {
|
|
101
|
+
base: 'vs-dark',
|
|
102
|
+
inherit: true,
|
|
103
|
+
rules: [],
|
|
104
|
+
colors: {
|
|
105
|
+
'editor.background': '#00000000',
|
|
106
|
+
focusBorder: '#00000000',
|
|
107
|
+
},
|
|
108
|
+
});
|
|
109
|
+
|
|
101
110
|
const isEditorFocused = editor.createContextKey<boolean>('isEditorFocused' + id, false);
|
|
102
111
|
// we setup on-blur
|
|
103
112
|
editor.onDidBlurEditorWidget(() => {
|
|
@@ -143,7 +152,7 @@ export default function PromQLEditor(props: PromQLEditorProps & DataProviderPara
|
|
|
143
152
|
const containerDiv = containerRef.current;
|
|
144
153
|
if (containerDiv !== null) {
|
|
145
154
|
const pixelHeight = editor.getContentHeight();
|
|
146
|
-
containerDiv.style.height = `${pixelHeight
|
|
155
|
+
containerDiv.style.height = `${pixelHeight}px`;
|
|
147
156
|
containerDiv.style.width = '100%';
|
|
148
157
|
const pixelWidth = containerDiv.clientWidth;
|
|
149
158
|
editor.layout({ width: pixelWidth, height: pixelHeight });
|