@grafana/plugin-ui 0.1.10

package/dist/components/QueryEditor/QueryEditor.js

@@ -0,0 +1,73 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SqlQueryEditor = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const react_use_1 = require("react-use");
+const defaults_1 = require("./defaults");
+const types_1 = require("./types");
+const sql_utils_1 = require("./utils/sql.utils");
+const QueryHeader_1 = require("./QueryHeader");
+const RawEditor_1 = require("./query-editor-raw/RawEditor");
+const VisualEditor_1 = require("./visual-query-builder/VisualEditor");
+const Space_1 = require("./Space");
+function SqlQueryEditor({ datasource, query, onChange, onRunQuery, range }) {
+    var _a, _b, _c, _d, _e, _f;
+    const [isQueryRunnable, setIsQueryRunnable] = (0, react_1.useState)(true);
+    const db = datasource.getDB();
+    const { loading, error } = (0, react_use_1.useAsync)(() => tslib_1.__awaiter(this, void 0, void 0, function* () {
+        return () => {
+            if (datasource.getDB(datasource.id).init !== undefined) {
+                datasource.getDB(datasource.id).init();
+            }
+        };
+    }), [datasource]);
+    const queryWithDefaults = (0, defaults_1.applyQueryDefaults)(query);
+    const [queryRowFilter, setQueryRowFilter] = (0, react_1.useState)({
+        filter: !!((_a = queryWithDefaults.sql) === null || _a === void 0 ? void 0 : _a.whereString),
+        group: !!((_d = (_c = (_b = queryWithDefaults.sql) === null || _b === void 0 ? void 0 : _b.groupBy) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.property.name),
+        order: !!((_f = (_e = queryWithDefaults.sql) === null || _e === void 0 ? void 0 : _e.orderBy) === null || _f === void 0 ? void 0 : _f.property.name),
+        preview: true,
+    });
+    const [queryToValidate, setQueryToValidate] = (0, react_1.useState)(queryWithDefaults);
+    (0, react_1.useEffect)(() => {
+        return () => {
+            if (datasource.getDB(datasource.id).dispose !== undefined) {
+                datasource.getDB(datasource.id).dispose();
+            }
+        };
+    }, [datasource]);
+    const processQuery = (0, react_1.useCallback)((q) => {
+        if (isQueryValid(q) && onRunQuery) {
+            onRunQuery();
+        }
+    }, [onRunQuery]);
+    const onQueryChange = (q, process = true) => {
+        var _a, _b;
+        setQueryToValidate(q);
+        onChange(q);
+        if ((0, sql_utils_1.haveColumns)((_a = q.sql) === null || _a === void 0 ? void 0 : _a.columns) && ((_b = q.sql) === null || _b === void 0 ? void 0 : _b.columns.some((c) => c.name)) && !queryRowFilter.group) {
+            setQueryRowFilter(Object.assign(Object.assign({}, queryRowFilter), { group: true }));
+        }
+        if (process) {
+            processQuery(q);
+        }
+    };
+    const onQueryHeaderChange = (q) => {
+        setQueryToValidate(q);
+        onChange(q);
+    };
+    if (loading || error) {
+        return null;
+    }
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(QueryHeader_1.QueryHeader, { db: db, onChange: onQueryHeaderChange, onRunQuery: onRunQuery, onQueryRowChange: setQueryRowFilter, queryRowFilter: queryRowFilter, query: queryWithDefaults, isQueryRunnable: isQueryRunnable, labels: datasource.getDB(datasource.id).labels }),
+        react_1.default.createElement(Space_1.Space, { v: 0.5 }),
+        queryWithDefaults.editorMode !== types_1.EditorMode.Code && (react_1.default.createElement(VisualEditor_1.VisualEditor, { db: db, query: queryWithDefaults, onChange: (q) => onQueryChange(q, false), queryRowFilter: queryRowFilter, onValidate: setIsQueryRunnable, range: range })),
+        queryWithDefaults.editorMode === types_1.EditorMode.Code && (react_1.default.createElement(RawEditor_1.RawEditor, { db: db, query: queryWithDefaults, queryToValidate: queryToValidate, onChange: onQueryChange, onRunQuery: onRunQuery, onValidate: setIsQueryRunnable, range: range }))));
+}
+exports.SqlQueryEditor = SqlQueryEditor;
+const isQueryValid = (q) => {
+    return Boolean(q.rawSql);
+};
+//# sourceMappingURL=QueryEditor.js.map

package/dist/components/QueryEditor/QueryEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"QueryEditor.js","sourceRoot":"","sources":["../../../src/components/QueryEditor/QueryEditor.tsx"],"names":[],"mappings":"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"}

package/dist/components/QueryEditor/QueryHeader.js

@@ -0,0 +1,92 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.QueryHeader = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const react_use_1 = require("react-use");
+const ConfirmModal_1 = require("./ConfirmModal");
+const DatasetSelector_1 = require("./DatasetSelector");
+const ErrorBoundary_1 = require("./ErrorBoundary");
+const TableSelector_1 = require("./TableSelector");
+const ui_1 = require("@grafana/ui");
+const EditorField_1 = require("./EditorField");
+const EditorHeader_1 = require("./EditorHeader");
+const EditorRow_1 = require("./EditorRow");
+const FlexItem_1 = require("./FlexItem");
+const InlineSelect_1 = require("./InlineSelect");
+const Space_1 = require("./Space");
+const types_1 = require("./types");
+const sql_utils_1 = require("./utils/sql.utils");
+const editorModes = [
+    { label: 'Builder', value: types_1.EditorMode.Builder },
+    { label: 'Code', value: types_1.EditorMode.Code },
+];
+function QueryHeader({ db, query, queryRowFilter, onChange, onRunQuery, onQueryRowChange, isQueryRunnable, labels = new Map([['dataset', 'Dataset']]), }) {
+    const { editorMode } = query;
+    const [_, copyToClipboard] = (0, react_use_1.useCopyToClipboard)();
+    const [showConfirm, setShowConfirm] = (0, react_1.useState)(false);
+    const toRawSql = db.toRawSql || sql_utils_1.defaultToRawSql;
+    const onEditorModeChange = (0, react_1.useCallback)((newEditorMode) => {
+        if (editorMode === types_1.EditorMode.Code) {
+            setShowConfirm(true);
+            return;
+        }
+        onChange(Object.assign(Object.assign({}, query), { editorMode: newEditorMode }));
+    }, [editorMode, onChange, query]);
+    const onFormatChange = (e) => {
+        const next = Object.assign(Object.assign({}, query), { format: e.value !== undefined ? e.value : types_1.QueryFormat.Table });
+        onChange(next);
+    };
+    const onDatasetChange = (e) => {
+        if (e.value === query.dataset) {
+            return;
+        }
+        const next = Object.assign(Object.assign({}, query), { dataset: e.value, table: undefined, sql: undefined, rawSql: '' });
+        onChange(next);
+    };
+    const onTableChange = (e) => {
+        if (e.value === query.table) {
+            return;
+        }
+        const next = Object.assign(Object.assign({}, query), { table: e.value, sql: undefined, rawSql: '' });
+        onChange(next);
+    };
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(EditorHeader_1.EditorHeader, null,
+            react_1.default.createElement(ErrorBoundary_1.ErrorBoundary, { fallBackComponent: react_1.default.createElement(ui_1.InlineField, { label: "Format", labelWidth: 15 },
+                    react_1.default.createElement(ui_1.Select, { placeholder: "Select format", value: query.format, onChange: onFormatChange, options: types_1.QUERY_FORMAT_OPTIONS })) },
+                react_1.default.createElement(InlineSelect_1.InlineSelect, { label: "Format", value: query.format, placeholder: "Select format", menuShouldPortal: true, onChange: onFormatChange, options: types_1.QUERY_FORMAT_OPTIONS })),
+            editorMode === types_1.EditorMode.Builder && (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement(ui_1.InlineSwitch, { id: "sql-filter", label: "Filter", transparent: true, showLabel: true, value: queryRowFilter.filter, onChange: (ev) => ev.target instanceof HTMLInputElement &&
+                        onQueryRowChange(Object.assign(Object.assign({}, queryRowFilter), { filter: ev.target.checked })) }),
+                react_1.default.createElement(ui_1.InlineSwitch, { id: "sql-group", label: "Group", transparent: true, showLabel: true, value: queryRowFilter.group, onChange: (ev) => ev.target instanceof HTMLInputElement &&
+                        onQueryRowChange(Object.assign(Object.assign({}, queryRowFilter), { group: ev.target.checked })) }),
+                react_1.default.createElement(ui_1.InlineSwitch, { id: "sql-order", label: "Order", transparent: true, showLabel: true, value: queryRowFilter.order, onChange: (ev) => ev.target instanceof HTMLInputElement &&
+                        onQueryRowChange(Object.assign(Object.assign({}, queryRowFilter), { order: ev.target.checked })) }),
+                react_1.default.createElement(ui_1.InlineSwitch, { id: "sql-preview", label: "Preview", transparent: true, showLabel: true, value: queryRowFilter.preview, onChange: (ev) => ev.target instanceof HTMLInputElement &&
+                        onQueryRowChange(Object.assign(Object.assign({}, queryRowFilter), { preview: ev.target.checked })) }))),
+            react_1.default.createElement(FlexItem_1.FlexItem, { grow: 1 }),
+            isQueryRunnable ? (react_1.default.createElement(ui_1.Button, { icon: "play", variant: "primary", size: "sm", onClick: () => onRunQuery() }, "Run query")) : (react_1.default.createElement(ui_1.Tooltip, { theme: "error", content: react_1.default.createElement(react_1.default.Fragment, null,
+                    "Your query is invalid. Check below for details. ",
+                    react_1.default.createElement("br", null),
+                    "However, you can still run this query."), placement: "top" },
+                react_1.default.createElement(ui_1.Button, { icon: "exclamation-triangle", variant: "secondary", size: "sm", onClick: () => onRunQuery() }, "Run query"))),
+            react_1.default.createElement(ui_1.RadioButtonGroup, { options: editorModes, size: "sm", value: editorMode, onChange: onEditorModeChange }),
+            react_1.default.createElement(ConfirmModal_1.ConfirmModal, { isOpen: showConfirm, onCopy: () => {
+                    setShowConfirm(false);
+                    copyToClipboard(query.rawSql);
+                    onChange(Object.assign(Object.assign({}, query), { rawSql: toRawSql(query), editorMode: types_1.EditorMode.Builder }));
+                }, onDiscard: () => {
+                    setShowConfirm(false);
+                    onChange(Object.assign(Object.assign({}, query), { rawSql: toRawSql(query), editorMode: types_1.EditorMode.Builder }));
+                }, onCancel: () => setShowConfirm(false) })),
+        editorMode === types_1.EditorMode.Builder && (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(Space_1.Space, { v: 0.5 }),
+            react_1.default.createElement(EditorRow_1.EditorRow, null,
+                react_1.default.createElement(EditorField_1.EditorField, { label: labels.get('dataset') || 'Dataset', width: 25 },
+                    react_1.default.createElement(DatasetSelector_1.DatasetSelector, { db: db, value: query.dataset === undefined ? null : query.dataset, onChange: onDatasetChange })),
+                react_1.default.createElement(EditorField_1.EditorField, { label: "Table", width: 25 },
+                    react_1.default.createElement(TableSelector_1.TableSelector, { db: db, query: query, value: query.table === undefined ? null : query.table, onChange: onTableChange, applyDefault: true })))))));
+}
+exports.QueryHeader = QueryHeader;
+//# sourceMappingURL=QueryHeader.js.map

package/dist/components/QueryEditor/QueryHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"QueryHeader.js","sourceRoot":"","sources":["../../../src/components/QueryEditor/QueryHeader.tsx"],"names":[],"mappings":"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"}

package/dist/components/QueryEditor/Space.js

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Space = void 0;
+const tslib_1 = require("tslib");
+const css_1 = require("@emotion/css");
+const react_1 = tslib_1.__importDefault(require("react"));
+const ui_1 = require("@grafana/ui");
+const Space = (props) => {
+    const theme = (0, ui_1.useTheme2)();
+    const styles = getStyles(theme, props);
+    return react_1.default.createElement("span", { className: (0, css_1.cx)(styles.wrapper) });
+};
+exports.Space = Space;
+exports.Space.defaultProps = {
+    v: 0,
+    h: 0,
+    layout: 'block',
+};
+const getStyles = (0, ui_1.stylesFactory)((theme, props) => {
+    var _a, _b;
+    return ({
+        wrapper: (0, css_1.css)([
+            {
+                paddingRight: theme.spacing((_a = props.h) !== null && _a !== void 0 ? _a : 0),
+                paddingBottom: theme.spacing((_b = props.v) !== null && _b !== void 0 ? _b : 0),
+            },
+            props.layout === 'inline' && {
+                display: 'inline-block',
+            },
+            props.layout === 'block' && {
+                display: 'block',
+            },
+        ]),
+    });
+});
+//# sourceMappingURL=Space.js.map

package/dist/components/QueryEditor/Space.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Space.js","sourceRoot":"","sources":["../../../src/components/QueryEditor/Space.tsx"],"names":[],"mappings":";;;;AAAA,sCAAuC;AACvC,0DAA0B;AAG1B,oCAAuD;AAQhD,MAAM,KAAK,GAAG,CAAC,KAAiB,EAAE,EAAE;IACzC,MAAM,KAAK,GAAG,IAAA,cAAS,GAAE,CAAC;IAC1B,MAAM,MAAM,GAAG,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;IAEvC,OAAO,wCAAM,SAAS,EAAE,IAAA,QAAE,EAAC,MAAM,CAAC,OAAO,CAAC,GAAI,CAAC;AACjD,CAAC,CAAC;AALW,QAAA,KAAK,SAKhB;AAEF,aAAK,CAAC,YAAY,GAAG;IACnB,CAAC,EAAE,CAAC;IACJ,CAAC,EAAE,CAAC;IACJ,MAAM,EAAE,OAAO;CAChB,CAAC;AAEF,MAAM,SAAS,GAAG,IAAA,kBAAa,EAAC,CAAC,KAAoB,EAAE,KAAiB,EAAE,EAAE;;IAAC,OAAA,CAAC;QAC5E,OAAO,EAAE,IAAA,SAAG,EAAC;YACX;gBACE,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,MAAA,KAAK,CAAC,CAAC,mCAAI,CAAC,CAAC;gBACzC,aAAa,EAAE,KAAK,CAAC,OAAO,CAAC,MAAA,KAAK,CAAC,CAAC,mCAAI,CAAC,CAAC;aAC3C;YACD,KAAK,CAAC,MAAM,KAAK,QAAQ,IAAI;gBAC3B,OAAO,EAAE,cAAc;aACxB;YACD,KAAK,CAAC,MAAM,KAAK,OAAO,IAAI;gBAC1B,OAAO,EAAE,OAAO;aACjB;SACF,CAAC;KACH,CAAC,CAAA;CAAA,CAAC,CAAC"}

package/dist/components/QueryEditor/Stack.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Stack = void 0;
+const tslib_1 = require("tslib");
+const css_1 = require("@emotion/css");
+const react_1 = tslib_1.__importDefault(require("react"));
+const ui_1 = require("@grafana/ui");
+const Stack = (_a) => {
+    var { children } = _a, props = tslib_1.__rest(_a, ["children"]);
+    const theme = (0, ui_1.useTheme2)();
+    const styles = useStyles(theme, props);
+    return react_1.default.createElement("div", { className: styles.root }, children);
+};
+exports.Stack = Stack;
+const useStyles = (0, ui_1.stylesFactory)((theme, props) => {
+    var _a, _b, _c;
+    return ({
+        root: (0, css_1.css)({
+            display: 'flex',
+            flexDirection: (_a = props.direction) !== null && _a !== void 0 ? _a : 'row',
+            flexWrap: ((_b = props.wrap) !== null && _b !== void 0 ? _b : true) ? 'wrap' : undefined,
+            alignItems: props.alignItems,
+            gap: theme.spacing((_c = props.gap) !== null && _c !== void 0 ? _c : 2),
+        }),
+    });
+});
+//# sourceMappingURL=Stack.js.map

package/dist/components/QueryEditor/Stack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stack.js","sourceRoot":"","sources":["../../../src/components/QueryEditor/Stack.tsx"],"names":[],"mappings":";;;;AAAA,sCAAmC;AACnC,0DAA6C;AAG7C,oCAAuD;AAShD,MAAM,KAAK,GAAyB,CAAC,EAAsB,EAAE,EAAE;QAA1B,EAAE,QAAQ,OAAY,EAAP,KAAK,sBAApB,YAAsB,CAAF;IAC9D,MAAM,KAAK,GAAG,IAAA,cAAS,GAAE,CAAC;IAC1B,MAAM,MAAM,GAAG,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;IAEvC,OAAO,uCAAK,SAAS,EAAE,MAAM,CAAC,IAAI,IAAG,QAAQ,CAAO,CAAC;AACvD,CAAC,CAAC;AALW,QAAA,KAAK,SAKhB;AAEF,MAAM,SAAS,GAAG,IAAA,kBAAa,EAAC,CAAC,KAAoB,EAAE,KAAiB,EAAE,EAAE;;IAAC,OAAA,CAAC;QAC5E,IAAI,EAAE,IAAA,SAAG,EAAC;YACR,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,MAAA,KAAK,CAAC,SAAS,mCAAI,KAAK;YACvC,QAAQ,EAAE,CAAA,MAAA,KAAK,CAAC,IAAI,mCAAI,IAAI,EAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;YACjD,UAAU,EAAE,KAAK,CAAC,UAAU;YAC5B,GAAG,EAAE,KAAK,CAAC,OAAO,CAAC,MAAA,KAAK,CAAC,GAAG,mCAAI,CAAC,CAAC;SACnC,CAAC;KACH,CAAC,CAAA;CAAA,CAAC,CAAC"}

package/dist/components/QueryEditor/TableSelector.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TableSelector = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const react_use_1 = require("react-use");
+const data_1 = require("@grafana/data");
+const ui_1 = require("@grafana/ui");
+const TableSelector = ({ db, query, value, className, onChange }) => {
+    const state = (0, react_use_1.useAsync)(() => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
+        if (!query.dataset) {
+            return [];
+        }
+        const tables = yield db.tables(query.dataset);
+        return tables.map(data_1.toOption);
+    }), [query.dataset]);
+    return (react_1.default.createElement(ui_1.Select, { className: className, disabled: state.loading, "aria-label": "Table selector", value: value, options: state.value, onChange: onChange, isLoading: state.loading, menuShouldPortal: true, placeholder: state.loading ? 'Loading tables' : 'Select table' }));
+};
+exports.TableSelector = TableSelector;
+//# sourceMappingURL=TableSelector.js.map

package/dist/components/QueryEditor/TableSelector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableSelector.js","sourceRoot":"","sources":["../../../src/components/QueryEditor/TableSelector.tsx"],"names":[],"mappings":";;;;AAAA,0DAA0B;AAC1B,yCAAqC;AAErC,wCAA0D;AAC1D,oCAAqC;AAW9B,MAAM,aAAa,GAAiC,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE;IACvG,MAAM,KAAK,GAAG,IAAA,oBAAQ,EAAC,GAAS,EAAE;QAChC,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE;YAClB,OAAO,EAAE,CAAC;SACX;QACD,MAAM,MAAM,GAAG,MAAM,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QAC9C,OAAO,MAAM,CAAC,GAAG,CAAC,eAAQ,CAAC,CAAC;IAC9B,CAAC,CAAA,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAEpB,OAAO,CACL,8BAAC,WAAM,IACL,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,KAAK,CAAC,OAAO,gBACZ,gBAAgB,EAC3B,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,KAAK,CAAC,KAAK,EACpB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,KAAK,CAAC,OAAO,EACxB,gBAAgB,EAAE,IAAI,EACtB,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,cAAc,GAC9D,CACH,CAAC;AACJ,CAAC,CAAC;AAtBW,QAAA,aAAa,iBAsBxB"}

package/dist/components/QueryEditor/defaults.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.applyQueryDefaults = void 0;
+const types_1 = require("./types");
+const sql_utils_1 = require("./utils/sql.utils");
+function applyQueryDefaults(q) {
+    let editorMode = (q === null || q === void 0 ? void 0 : q.editorMode) || types_1.EditorMode.Builder;
+    // Switching to code editor if the query was created before visual query builder was introduced.
+    if ((q === null || q === void 0 ? void 0 : q.editorMode) === undefined && (q === null || q === void 0 ? void 0 : q.rawSql) !== undefined) {
+        editorMode = types_1.EditorMode.Code;
+    }
+    const result = Object.assign(Object.assign({}, q), { refId: (q === null || q === void 0 ? void 0 : q.refId) || 'A', format: (q === null || q === void 0 ? void 0 : q.format) !== undefined ? q.format : types_1.QueryFormat.Table, rawSql: (q === null || q === void 0 ? void 0 : q.rawSql) || '', editorMode, sql: (q === null || q === void 0 ? void 0 : q.sql) || {
+            columns: [(0, sql_utils_1.createFunctionField)()],
+            groupBy: [(0, sql_utils_1.setGroupByField)()],
+            limit: 50,
+        } });
+    return result;
+}
+exports.applyQueryDefaults = applyQueryDefaults;
+//# sourceMappingURL=defaults.js.map

package/dist/components/QueryEditor/defaults.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaults.js","sourceRoot":"","sources":["../../../src/components/QueryEditor/defaults.ts"],"names":[],"mappings":";;;AAAA,mCAA4D;AAC5D,iDAAyE;AAEzE,SAAgB,kBAAkB,CAAC,CAAY;IAC7C,IAAI,UAAU,GAAG,CAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,UAAU,KAAI,kBAAU,CAAC,OAAO,CAAC;IAErD,gGAAgG;IAChG,IAAI,CAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,UAAU,MAAK,SAAS,IAAI,CAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,MAAM,MAAK,SAAS,EAAE;QAC1D,UAAU,GAAG,kBAAU,CAAC,IAAI,CAAC;KAC9B;IAED,MAAM,MAAM,mCACP,CAAC,KACJ,KAAK,EAAE,CAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,KAAK,KAAI,GAAG,EACtB,MAAM,EAAE,CAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,MAAM,MAAK,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,mBAAW,CAAC,KAAK,EAC9D,MAAM,EAAE,CAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,MAAM,KAAI,EAAE,EACvB,UAAU,EACV,GAAG,EAAE,CAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,GAAG,KAAI;YACb,OAAO,EAAE,CAAC,IAAA,+BAAmB,GAAE,CAAC;YAChC,OAAO,EAAE,CAAC,IAAA,2BAAe,GAAE,CAAC;YAC5B,KAAK,EAAE,EAAE;SACV,GACF,CAAC;IAEF,OAAO,MAAM,CAAC;AAChB,CAAC;AAtBD,gDAsBC"}

package/dist/components/QueryEditor/expressions.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.QueryEditorExpressionType = exports.QueryEditorPropertyType = void 0;
+var QueryEditorPropertyType;
+(function (QueryEditorPropertyType) {
+    QueryEditorPropertyType["String"] = "string";
+})(QueryEditorPropertyType = exports.QueryEditorPropertyType || (exports.QueryEditorPropertyType = {}));
+var QueryEditorExpressionType;
+(function (QueryEditorExpressionType) {
+    QueryEditorExpressionType["Property"] = "property";
+    QueryEditorExpressionType["Operator"] = "operator";
+    QueryEditorExpressionType["Or"] = "or";
+    QueryEditorExpressionType["And"] = "and";
+    QueryEditorExpressionType["GroupBy"] = "groupBy";
+    QueryEditorExpressionType["Function"] = "function";
+    QueryEditorExpressionType["FunctionParameter"] = "functionParameter";
+})(QueryEditorExpressionType = exports.QueryEditorExpressionType || (exports.QueryEditorExpressionType = {}));
+//# sourceMappingURL=expressions.js.map

package/dist/components/QueryEditor/expressions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"expressions.js","sourceRoot":"","sources":["../../../src/components/QueryEditor/expressions.ts"],"names":[],"mappings":";;;AAAA,IAAY,uBAEX;AAFD,WAAY,uBAAuB;IACjC,4CAAiB,CAAA;AACnB,CAAC,EAFW,uBAAuB,GAAvB,+BAAuB,KAAvB,+BAAuB,QAElC;AA+BD,IAAY,yBAQX;AARD,WAAY,yBAAyB;IACnC,kDAAqB,CAAA;IACrB,kDAAqB,CAAA;IACrB,sCAAS,CAAA;IACT,wCAAW,CAAA;IACX,gDAAmB,CAAA;IACnB,kDAAqB,CAAA;IACrB,oEAAuC,CAAA;AACzC,CAAC,EARW,yBAAyB,GAAzB,iCAAyB,KAAzB,iCAAyB,QAQpC"}

package/dist/components/QueryEditor/index.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SqlQueryEditor = exports.Space = exports.InputGroup = exports.InlineSelect = exports.Stack = exports.FlexItem = exports.EditorSwitch = exports.EditorRows = exports.EditorList = exports.EditorRow = exports.EditorField = exports.EditorHeader = exports.EditorFieldGroup = exports.AccessoryButton = void 0;
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./visual-query-builder"), exports);
+var AccessoryButton_1 = require("./AccessoryButton");
+Object.defineProperty(exports, "AccessoryButton", { enumerable: true, get: function () { return AccessoryButton_1.AccessoryButton; } });
+var EditorFieldGroup_1 = require("./EditorFieldGroup");
+Object.defineProperty(exports, "EditorFieldGroup", { enumerable: true, get: function () { return EditorFieldGroup_1.EditorFieldGroup; } });
+var EditorHeader_1 = require("./EditorHeader");
+Object.defineProperty(exports, "EditorHeader", { enumerable: true, get: function () { return EditorHeader_1.EditorHeader; } });
+var EditorField_1 = require("./EditorField");
+Object.defineProperty(exports, "EditorField", { enumerable: true, get: function () { return EditorField_1.EditorField; } });
+var EditorRow_1 = require("./EditorRow");
+Object.defineProperty(exports, "EditorRow", { enumerable: true, get: function () { return EditorRow_1.EditorRow; } });
+var EditorList_1 = require("./EditorList");
+Object.defineProperty(exports, "EditorList", { enumerable: true, get: function () { return EditorList_1.EditorList; } });
+var EditorRows_1 = require("./EditorRows");
+Object.defineProperty(exports, "EditorRows", { enumerable: true, get: function () { return EditorRows_1.EditorRows; } });
+var EditorSwitch_1 = require("./EditorSwitch");
+Object.defineProperty(exports, "EditorSwitch", { enumerable: true, get: function () { return EditorSwitch_1.EditorSwitch; } });
+var FlexItem_1 = require("./FlexItem");
+Object.defineProperty(exports, "FlexItem", { enumerable: true, get: function () { return FlexItem_1.FlexItem; } });
+var Stack_1 = require("./Stack");
+Object.defineProperty(exports, "Stack", { enumerable: true, get: function () { return Stack_1.Stack; } });
+var InlineSelect_1 = require("./InlineSelect");
+Object.defineProperty(exports, "InlineSelect", { enumerable: true, get: function () { return InlineSelect_1.InlineSelect; } });
+var InputGroup_1 = require("./InputGroup");
+Object.defineProperty(exports, "InputGroup", { enumerable: true, get: function () { return InputGroup_1.InputGroup; } });
+var Space_1 = require("./Space");
+Object.defineProperty(exports, "Space", { enumerable: true, get: function () { return Space_1.Space; } });
+var QueryEditor_1 = require("./QueryEditor");
+Object.defineProperty(exports, "SqlQueryEditor", { enumerable: true, get: function () { return QueryEditor_1.SqlQueryEditor; } });
+tslib_1.__exportStar(require("./types"), exports);
+//# sourceMappingURL=index.js.map

package/dist/components/QueryEditor/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/QueryEditor/index.ts"],"names":[],"mappings":";;;;AAAA,iEAAuC;AAEvC,qDAAoD;AAA3C,kHAAA,eAAe,OAAA;AACxB,uDAAsD;AAA7C,oHAAA,gBAAgB,OAAA;AACzB,+CAA8C;AAArC,4GAAA,YAAY,OAAA;AACrB,6CAA4C;AAAnC,0GAAA,WAAW,OAAA;AACpB,yCAAwC;AAA/B,sGAAA,SAAS,OAAA;AAClB,2CAA0C;AAAjC,wGAAA,UAAU,OAAA;AACnB,2CAA0C;AAAjC,wGAAA,UAAU,OAAA;AACnB,+CAA8C;AAArC,4GAAA,YAAY,OAAA;AACrB,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,iCAAgC;AAAvB,8FAAA,KAAK,OAAA;AACd,+CAA8C;AAArC,4GAAA,YAAY,OAAA;AACrB,2CAA0C;AAAjC,wGAAA,UAAU,OAAA;AACnB,iCAAgC;AAAvB,8FAAA,KAAK,OAAA;AACd,6CAA+C;AAAtC,6GAAA,cAAc,OAAA;AAEvB,kDAAwB"}

package/dist/components/QueryEditor/query-editor-raw/QueryEditorRaw.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.QueryEditorRaw = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const experimental_1 = require("@grafana/experimental");
+const formatSQL_1 = require("../utils/formatSQL");
+function QueryEditorRaw({ children, onChange, query, width, height, completionProvider }) {
+    // We need to pass query via ref to SQLEditor as onChange is executed via monacoEditor.onDidChangeModelContent callback, not onChange property
+    const queryRef = (0, react_1.useRef)(query);
+    (0, react_1.useEffect)(() => {
+        queryRef.current = query;
+    }, [query]);
+    const onRawQueryChange = (0, react_1.useCallback)((rawSql, processQuery) => {
+        const newQuery = Object.assign(Object.assign({}, queryRef.current), { rawQuery: true, rawSql });
+        onChange(newQuery, processQuery);
+    }, [onChange]);
+    return (react_1.default.createElement(experimental_1.SQLEditor, { width: width, height: height, query: query.rawSql, onChange: onRawQueryChange, language: { id: 'sql', completionProvider, formatter: formatSQL_1.formatSQL } }, children));
+}
+exports.QueryEditorRaw = QueryEditorRaw;
+//# sourceMappingURL=QueryEditorRaw.js.map

package/dist/components/QueryEditor/query-editor-raw/QueryEditorRaw.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"QueryEditorRaw.js","sourceRoot":"","sources":["../../../../src/components/QueryEditor/query-editor-raw/QueryEditorRaw.tsx"],"names":[],"mappings":";;;;AAAA,uDAA8D;AAE9D,wDAA8E;AAG9E,kDAA+C;AAW/C,SAAgB,cAAc,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,kBAAkB,EAAS;IACpG,8IAA8I;IAC9I,MAAM,QAAQ,GAAG,IAAA,cAAM,EAAW,KAAK,CAAC,CAAC;IACzC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,QAAQ,CAAC,OAAO,GAAG,KAAK,CAAC;IAC3B,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,gBAAgB,GAAG,IAAA,mBAAW,EAClC,CAAC,MAAc,EAAE,YAAqB,EAAE,EAAE;QACxC,MAAM,QAAQ,mCACT,QAAQ,CAAC,OAAO,KACnB,QAAQ,EAAE,IAAI,EACd,MAAM,GACP,CAAC;QACF,QAAQ,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;IACnC,CAAC,EACD,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,OAAO,CACL,8BAAC,wBAAS,IACR,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,CAAC,MAAO,EACpB,QAAQ,EAAE,gBAAgB,EAC1B,QAAQ,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,kBAAkB,EAAE,SAAS,EAAE,qBAAS,EAAE,IAEhE,QAAQ,CACC,CACb,CAAC;AACJ,CAAC;AA9BD,wCA8BC"}

package/dist/components/QueryEditor/query-editor-raw/QueryToolbox.js

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.QueryToolbox = void 0;
+const tslib_1 = require("tslib");
+const css_1 = require("@emotion/css");
+const react_1 = tslib_1.__importStar(require("react"));
+const ui_1 = require("@grafana/ui");
+const QueryValidator_1 = require("./QueryValidator");
+function QueryToolbox(_a) {
+    var { showTools, onFormatCode, onExpand, isExpanded } = _a, validatorProps = tslib_1.__rest(_a, ["showTools", "onFormatCode", "onExpand", "isExpanded"]);
+    const theme = (0, ui_1.useTheme2)();
+    const [validationResult, setValidationResult] = (0, react_1.useState)();
+    const styles = (0, react_1.useMemo)(() => {
+        return {
+            container: (0, css_1.css) `
+        border: 1px solid ${theme.colors.border.medium};
+        border-top: none;
+        padding: ${theme.spacing(0.5, 0.5, 0.5, 0.5)};
+        display: flex;
+        flex-grow: 1;
+        justify-content: space-between;
+        font-size: ${theme.typography.bodySmall.fontSize};
+      `,
+            error: (0, css_1.css) `
+        color: ${theme.colors.error.text};
+        font-size: ${theme.typography.bodySmall.fontSize};
+        font-family: ${theme.typography.fontFamilyMonospace};
+      `,
+            valid: (0, css_1.css) `
+        color: ${theme.colors.success.text};
+      `,
+            info: (0, css_1.css) `
+        color: ${theme.colors.text.secondary};
+      `,
+            hint: (0, css_1.css) `
+        color: ${theme.colors.text.disabled};
+        white-space: nowrap;
+        cursor: help;
+      `,
+        };
+    }, [theme]);
+    let style = {};
+    if (!showTools && validationResult === undefined) {
+        style = { height: 0, padding: 0, visibility: 'hidden' };
+    }
+    return (react_1.default.createElement("div", { className: styles.container, style: style },
+        react_1.default.createElement("div", null, validatorProps.onValidate && (react_1.default.createElement(QueryValidator_1.QueryValidator, Object.assign({}, validatorProps, { onValidate: (result) => {
+                setValidationResult(result);
+                validatorProps.onValidate(result);
+            } })))),
+        showTools && (react_1.default.createElement("div", null,
+            react_1.default.createElement(ui_1.HorizontalGroup, { spacing: "sm" },
+                onFormatCode && (react_1.default.createElement(ui_1.IconButton, { onClick: onFormatCode, name: "brackets-curly", size: "xs", tooltip: "Format query" })),
+                onExpand && (react_1.default.createElement(ui_1.IconButton, { onClick: () => onExpand(!isExpanded), name: isExpanded ? 'angle-up' : 'angle-down', size: "xs", tooltip: isExpanded ? 'Collapse editor' : 'Expand editor' })),
+                react_1.default.createElement(ui_1.Tooltip, { content: "Hit CTRL/CMD+Return to run query" },
+                    react_1.default.createElement(ui_1.Icon, { className: styles.hint, name: "keyboard" })))))));
+}
+exports.QueryToolbox = QueryToolbox;
+//# sourceMappingURL=QueryToolbox.js.map

package/dist/components/QueryEditor/query-editor-raw/QueryToolbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"QueryToolbox.js","sourceRoot":"","sources":["../../../../src/components/QueryEditor/query-editor-raw/QueryToolbox.tsx"],"names":[],"mappings":";;;;AAAA,sCAAmC;AACnC,uDAAiD;AAEjD,oCAAoF;AAEpF,qDAAuE;AAUvE,SAAgB,YAAY,CAAC,EAAuF;QAAvF,EAAE,SAAS,EAAE,YAAY,EAAE,QAAQ,EAAE,UAAU,OAAwC,EAAnC,cAAc,sBAAlE,uDAAoE,CAAF;IAC7F,MAAM,KAAK,GAAG,IAAA,cAAS,GAAE,CAAC;IAC1B,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,IAAA,gBAAQ,GAAW,CAAC;IAEpE,MAAM,MAAM,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC1B,OAAO;YACL,SAAS,EAAE,IAAA,SAAG,EAAA;4BACQ,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,MAAM;;mBAEnC,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;;;;qBAI/B,KAAK,CAAC,UAAU,CAAC,SAAS,CAAC,QAAQ;OACjD;YACD,KAAK,EAAE,IAAA,SAAG,EAAA;iBACC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI;qBACnB,KAAK,CAAC,UAAU,CAAC,SAAS,CAAC,QAAQ;uBACjC,KAAK,CAAC,UAAU,CAAC,mBAAmB;OACpD;YACD,KAAK,EAAE,IAAA,SAAG,EAAA;iBACC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI;OACnC;YACD,IAAI,EAAE,IAAA,SAAG,EAAA;iBACE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS;OACrC;YACD,IAAI,EAAE,IAAA,SAAG,EAAA;iBACE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ;;;OAGpC;SACF,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,IAAI,KAAK,GAAG,EAAE,CAAC;IAEf,IAAI,CAAC,SAAS,IAAI,gBAAgB,KAAK,SAAS,EAAE;QAChD,KAAK,GAAG,EAAE,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC;KACzD;IAED,OAAO,CACL,uCAAK,SAAS,EAAE,MAAM,CAAC,SAAS,EAAE,KAAK,EAAE,KAAK;QAC5C,2CACG,cAAc,CAAC,UAAU,IAAI,CAC5B,8BAAC,+BAAc,oBACT,cAAc,IAClB,UAAU,EAAE,CAAC,MAAe,EAAE,EAAE;gBAC9B,mBAAmB,CAAC,MAAM,CAAC,CAAC;gBAC5B,cAAc,CAAC,UAAW,CAAC,MAAM,CAAC,CAAC;YACrC,CAAC,IACD,CACH,CACG;QACL,SAAS,IAAI,CACZ;YACE,8BAAC,oBAAe,IAAC,OAAO,EAAC,IAAI;gBAC1B,YAAY,IAAI,CACf,8BAAC,eAAU,IAAC,OAAO,EAAE,YAAY,EAAE,IAAI,EAAC,gBAAgB,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAC,cAAc,GAAG,CAC7F;gBACA,QAAQ,IAAI,CACX,8BAAC,eAAU,IACT,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,CAAC,UAAU,CAAC,EACpC,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,EAC5C,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,eAAe,GACzD,CACH;gBACD,8BAAC,YAAO,IAAC,OAAO,EAAC,kCAAkC;oBACjD,8BAAC,SAAI,IAAC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,IAAI,EAAC,UAAU,GAAG,CACxC,CACM,CACd,CACP,CACG,CACP,CAAC;AACJ,CAAC;AA3ED,oCA2EC"}

package/dist/components/QueryEditor/query-editor-raw/QueryValidator.js

@@ -0,0 +1,79 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.QueryValidator = void 0;
+const tslib_1 = require("tslib");
+const css_1 = require("@emotion/css");
+const react_1 = tslib_1.__importStar(require("react"));
+const react_use_1 = require("react-use");
+const useDebounce_1 = tslib_1.__importDefault(require("react-use/lib/useDebounce"));
+const data_1 = require("@grafana/data");
+const ui_1 = require("@grafana/ui");
+function QueryValidator({ db, query, onValidate, range }) {
+    var _a;
+    const [validationResult, setValidationResult] = (0, react_1.useState)();
+    const theme = (0, ui_1.useTheme2)();
+    const valueFormatter = (0, react_1.useMemo)(() => (0, data_1.getValueFormat)('bytes'), []);
+    const styles = (0, react_1.useMemo)(() => {
+        return {
+            error: (0, css_1.css) `
+        color: ${theme.colors.error.text};
+        font-size: ${theme.typography.bodySmall.fontSize};
+        font-family: ${theme.typography.fontFamilyMonospace};
+      `,
+            valid: (0, css_1.css) `
+        color: ${theme.colors.success.text};
+      `,
+            info: (0, css_1.css) `
+        color: ${theme.colors.text.secondary};
+      `,
+        };
+    }, [theme]);
+    const [state, validateQuery] = (0, react_use_1.useAsyncFn)((q) => tslib_1.__awaiter(this, void 0, void 0, function* () {
+        var _b;
+        if (((_b = q.rawSql) === null || _b === void 0 ? void 0 : _b.trim()) === '') {
+            return null;
+        }
+        return yield db.validateQuery(q, range);
+    }), [db]);
+    const [,] = (0, useDebounce_1.default)(() => tslib_1.__awaiter(this, void 0, void 0, function* () {
+        const result = yield validateQuery(query);
+        if (result) {
+            setValidationResult(result);
+        }
+        return null;
+    }), 1000, [query, validateQuery]);
+    (0, react_1.useEffect)(() => {
+        if (validationResult === null || validationResult === void 0 ? void 0 : validationResult.isError) {
+            onValidate(false);
+        }
+        if (validationResult === null || validationResult === void 0 ? void 0 : validationResult.isValid) {
+            onValidate(true);
+        }
+    }, [validationResult, onValidate]);
+    if (!state.value && !state.loading) {
+        return null;
+    }
+    const error = ((_a = state.value) === null || _a === void 0 ? void 0 : _a.error) ? processErrorMessage(state.value.error) : '';
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        state.loading && (react_1.default.createElement("div", { className: styles.info },
+            react_1.default.createElement(ui_1.Spinner, { inline: true, size: 12 }),
+            " Validating query...")),
+        !state.loading && state.value && (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(react_1.default.Fragment, null, state.value.isValid && state.value.statistics && (react_1.default.createElement("div", { className: styles.valid },
+                react_1.default.createElement(ui_1.Icon, { name: "check" }),
+                " This query will process",
+                ' ',
+                react_1.default.createElement("strong", null, (0, data_1.formattedValueToString)(valueFormatter(state.value.statistics.TotalBytesProcessed))),
+                ' ',
+                "when run."))),
+            react_1.default.createElement(react_1.default.Fragment, null, state.value.isError && react_1.default.createElement("div", { className: styles.error }, error))))));
+}
+exports.QueryValidator = QueryValidator;
+function processErrorMessage(error) {
+    const splat = error.split(':');
+    if (splat.length > 2) {
+        return splat.slice(2).join(':');
+    }
+    return error;
+}
+//# sourceMappingURL=QueryValidator.js.map

package/dist/components/QueryEditor/query-editor-raw/QueryValidator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"QueryValidator.js","sourceRoot":"","sources":["../../../../src/components/QueryEditor/query-editor-raw/QueryValidator.tsx"],"names":[],"mappings":"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"}

package/dist/components/QueryEditor/query-editor-raw/RawEditor.js

@@ -0,0 +1,60 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RawEditor = void 0;
+const tslib_1 = require("tslib");
+const css_1 = require("@emotion/css");
+const react_1 = tslib_1.__importStar(require("react"));
+const react_use_1 = require("react-use");
+// @ts-ignore
+const react_virtualized_auto_sizer_1 = tslib_1.__importDefault(require("react-virtualized-auto-sizer"));
+const ui_1 = require("@grafana/ui");
+const QueryEditorRaw_1 = require("./QueryEditorRaw");
+const QueryToolbox_1 = require("./QueryToolbox");
+function RawEditor({ db, query, onChange, onRunQuery, onValidate, queryToValidate, range }) {
+    const theme = (0, ui_1.useTheme2)();
+    const styles = (0, ui_1.useStyles2)(getStyles);
+    const [isExpanded, setIsExpanded] = (0, react_1.useState)(false);
+    const [toolboxRef, toolboxMeasure] = (0, react_use_1.useMeasure)();
+    const [editorRef, editorMeasure] = (0, react_use_1.useMeasure)();
+    const completionProvider = (0, react_1.useMemo)(() => db.getSqlCompletionProvider(), [db]);
+    const renderQueryEditor = (width, height) => {
+        return (react_1.default.createElement(QueryEditorRaw_1.QueryEditorRaw, { completionProvider: completionProvider, query: query, width: width, height: height ? height - toolboxMeasure.height : undefined, onChange: onChange }, ({ formatQuery }) => {
+            return (react_1.default.createElement("div", { ref: toolboxRef },
+                react_1.default.createElement(QueryToolbox_1.QueryToolbox, { db: db, query: queryToValidate, onValidate: onValidate, onFormatCode: formatQuery, showTools: true, range: range, onExpand: setIsExpanded, isExpanded: isExpanded })));
+        }));
+    };
+    const renderEditor = (standalone = false) => {
+        return standalone ? (react_1.default.createElement(react_virtualized_auto_sizer_1.default, null, ({ width, height }) => {
+            return renderQueryEditor(width, height);
+        })) : (react_1.default.createElement("div", { ref: editorRef }, renderQueryEditor()));
+    };
+    const renderPlaceholder = () => {
+        return (react_1.default.createElement("div", { style: {
+                width: editorMeasure.width,
+                height: editorMeasure.height,
+                background: theme.colors.background.primary,
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+            } }, "Editing in expanded code editor"));
+    };
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        isExpanded ? renderPlaceholder() : renderEditor(),
+        isExpanded && (react_1.default.createElement(ui_1.Modal, { title: `Query ${query.refId}`, closeOnBackdropClick: false, closeOnEscape: false, className: styles.modal, contentClassName: styles.modalContent, isOpen: isExpanded, onDismiss: () => {
+                setIsExpanded(false);
+            } }, renderEditor(true)))));
+}
+exports.RawEditor = RawEditor;
+function getStyles(theme) {
+    return {
+        modal: (0, css_1.css) `
+      width: 95vw;
+      height: 95vh;
+    `,
+        modalContent: (0, css_1.css) `
+      height: 100%;
+      padding-top: 0;
+    `,
+    };
+}
+//# sourceMappingURL=RawEditor.js.map