mirror of https://github.com/grafana/grafana.git
TextPanel: Fix `CodeEditor` not appearing properly (#111937)
set width=100% on the CodeEditor
This commit is contained in:
parent
e9f44daa7e
commit
d04d4782b7
|
@ -1,6 +1,5 @@
|
||||||
import { css, cx } from '@emotion/css';
|
import { css, cx } from '@emotion/css';
|
||||||
import { useMemo } from 'react';
|
import { useMemo } from 'react';
|
||||||
import AutoSizer from 'react-virtualized-auto-sizer';
|
|
||||||
|
|
||||||
import { GrafanaTheme2, StandardEditorProps } from '@grafana/data';
|
import { GrafanaTheme2, StandardEditorProps } from '@grafana/data';
|
||||||
import {
|
import {
|
||||||
|
@ -25,26 +24,17 @@ export const TextPanelEditor = ({ value, onChange, context }: StandardEditorProp
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={cx(styles.editorBox)}>
|
<div className={cx(styles.editorBox)}>
|
||||||
<AutoSizer disableHeight>
|
<CodeEditor
|
||||||
{({ width }) => {
|
value={value}
|
||||||
if (width === 0) {
|
onBlur={onChange}
|
||||||
return null;
|
onSave={onChange}
|
||||||
}
|
language={language}
|
||||||
return (
|
width="100%"
|
||||||
<CodeEditor
|
showMiniMap={false}
|
||||||
value={value}
|
showLineNumbers={false}
|
||||||
onBlur={onChange}
|
height="500px"
|
||||||
onSave={onChange}
|
getSuggestions={getSuggestions}
|
||||||
language={language}
|
/>
|
||||||
width={width}
|
|
||||||
showMiniMap={false}
|
|
||||||
showLineNumbers={false}
|
|
||||||
height="500px"
|
|
||||||
getSuggestions={getSuggestions}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
}}
|
|
||||||
</AutoSizer>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
@ -52,8 +42,6 @@ export const TextPanelEditor = ({ value, onChange, context }: StandardEditorProp
|
||||||
const getStyles = (theme: GrafanaTheme2) => ({
|
const getStyles = (theme: GrafanaTheme2) => ({
|
||||||
editorBox: css({
|
editorBox: css({
|
||||||
label: 'editorBox',
|
label: 'editorBox',
|
||||||
border: `1px solid ${theme.colors.border.medium}`,
|
|
||||||
borderRadius: theme.shape.radius.default,
|
|
||||||
margin: theme.spacing(0.5, 0),
|
margin: theme.spacing(0.5, 0),
|
||||||
width: '100%',
|
width: '100%',
|
||||||
}),
|
}),
|
||||||
|
|
Loading…
Reference in New Issue