@fc-components/monaco-editor 0.1.26 → 0.2.1

package/dist/monaco-editor.esm.js

@@ -3,7 +3,7 @@ import MonacoEditor from 'react-monaco-editor';
 import * as monaco from 'monaco-editor';
 import { languages, Range, editor, Selection, KeyMod, KeyCode, MarkerSeverity } from 'monaco-editor';
 import { promLanguageDefinition } from 'monaco-promql';
-import { parser, LabelName, UnquotedLabelMatcher, LabelMatchers, VectorSelector, PromQL, Identifier, FunctionCallBody, StringLiteral, BinaryExpr, NumberDurationLiteralInDurationContext, MatrixSelector, GroupingLabels, AggregateModifier, AggregateExpr, MatchOp, EqlSingle, EqlRegex, Neq, NeqRegex } from '@fc-components/lezer-metricsql';
+import { parser, LabelName, UnquotedLabelMatcher, LabelMatchers, VectorSelector, PromQL, Identifier, FunctionCallBody, StringLiteral, BinaryExpr, NumberDurationLiteralInDurationContext, MatrixSelector, GroupingLabels, WithExpr, WithAssignment, AggregateModifier, AggregateExpr, MatchOp, EqlSingle, EqlRegex, Neq, NeqRegex } from '@fc-components/lezer-metricsql';
 import { v4 } from 'uuid';
 import { css } from '@emotion/css';
 
@@ -340,6 +340,7 @@ for (var _i = 0, aggregations_1 = aggregations; _i < aggregations_1.length; _i++
 // PromQL vector matching + the by and without clauses
 // (https://prometheus.io/docs/prometheus/latest/querying/operators/#vector-matching)
 var vectorMatching = ['on', 'ignoring', 'group_right', 'group_left', 'by', 'without'];
+var cteKeywords = ['with'];
 // Produce a regex matching elements : (elt1|elt2|...)
 var vectorMatchingRegex = '(' + /*#__PURE__*/vectorMatching.reduce(function (prev, curr) {
   return prev + '|' + curr;
@@ -351,7 +352,7 @@ var operators = ['+', '-', '*', '/', '%', '^', '==', '!=', '>', '<', '>=', '<=',
 // (https://prometheus.io/docs/prometheus/latest/querying/basics/#offset-modifier)
 var offsetModifier = ['offset'];
 // Merging all the keywords in one list
-var keywords = /*#__PURE__*/aggregations.concat(functions).concat(aggregationsOverTime).concat(vectorMatching).concat(offsetModifier);
+var keywords = /*#__PURE__*/aggregations.concat(functions).concat(aggregationsOverTime).concat(vectorMatching).concat(offsetModifier).concat(cteKeywords);
 // noinspection JSUnusedGlobalSymbols
 var language = {
   ignoreCase: false,
@@ -1289,6 +1290,15 @@ var RESOLVERS = [{
 }, {
   path: [GroupingLabels],
   fun: resolveLabelsForGrouping
+}, {
+  path: [WithExpr],
+  fun: resolveWithExpr
+}, {
+  path: [WithExpr, PromQL],
+  fun: resolveWithExpr
+}, {
+  path: [WithAssignment, WithExpr],
+  fun: resolveWithExpr
 }];
 var LABEL_OP_MAP = /*#__PURE__*/new Map([[EqlSingle, '='], [EqlRegex, '=~'], [Neq, '!='], [NeqRegex, '!~']]);
 function getLabelOp(opNode) {
@@ -1386,6 +1396,10 @@ function resolveLabelMatcher(node, text, _pos) {
   // - a StringNode (like in `{job="^"}`)
   // - or an error node (like in `{job=^}`)
   var inStringNode = !node.type.isError;
+  // calculate where the value starts
+  // for string nodes, it's after the opening quote
+  // for error nodes, it's at the node start
+  var valueStartPos = inStringNode ? node.from + 1 : node.from;
   var parent = walk(node, [['parent', UnquotedLabelMatcher]]);
   if (parent === null) {
     return null;
@@ -1412,7 +1426,8 @@ function resolveLabelMatcher(node, text, _pos) {
       type: 'IN_LABEL_SELECTOR_WITH_LABEL_NAME',
       labelName: labelName,
       betweenQuotes: inStringNode,
-      otherLabels: otherLabels
+      otherLabels: otherLabels,
+      valueStartPos: valueStartPos
     };
   }
   var metricName = getNodeText(metricNameNode, text);
@@ -1421,7 +1436,8 @@ function resolveLabelMatcher(node, text, _pos) {
     metricName: metricName,
     labelName: labelName,
     betweenQuotes: inStringNode,
-    otherLabels: otherLabels
+    otherLabels: otherLabels,
+    valueStartPos: valueStartPos
   };
 }
 function resolveErrorInLabelMatcher(node, text, pos) {
@@ -1455,6 +1471,25 @@ function resolveInFunction() {
     type: 'IN_FUNCTION'
   };
 }
+function resolveWithExpr(node, text, pos) {
+  // Find the containing WithExpr node (node may be a WithAssignment child)
+  var withExprNode = node.type.id === WithExpr ? node : node.parent;
+  while (withExprNode && withExprNode.type.id !== WithExpr) {
+    withExprNode = withExprNode.parent;
+  }
+  if (!withExprNode) return null;
+  // Only return IN_WITH_BODY when cursor is in the body expression (after the closing ')')
+  var children = getNodeChildren(withExprNode);
+  var closeParen = children.find(function (c) {
+    return getNodeText(c, text) === ')';
+  });
+  if (closeParen && pos > closeParen.to) {
+    return {
+      type: 'IN_WITH_BODY'
+    };
+  }
+  return null;
+}
 function resolveDurations() {
   return {
     type: 'IN_DURATION'
@@ -1564,6 +1599,25 @@ function getErrorNode(tree, pos) {
   }
   return null;
 }
+function findMatchingParen(text, openPos) {
+  var depth = 0;
+  for (var i = openPos; i < text.length; i++) {
+    if (text[i] === '(') depth++;
+    if (text[i] === ')') {
+      depth--;
+      if (depth === 0) return i;
+    }
+  }
+  return -1;
+}
+function isInWithBody(text, pos) {
+  var withMatch = text.match(/^with\s*\(/i);
+  if (!withMatch) return false;
+  var openParenPos = withMatch[0].length - 1;
+  var closeParenPos = findMatchingParen(text, openParenPos);
+  if (closeParenPos === -1) return false;
+  return pos > closeParenPos;
+}
 function getSituation(text, pos) {
   // there is a special-case when we are at the start of writing text,
   // so we handle that case first
@@ -1572,6 +1626,12 @@ function getSituation(text, pos) {
       type: 'EMPTY'
     };
   }
+  // text-based check for with body (fallback until grammar supports WithExpr)
+  if (isInWithBody(text, pos)) {
+    return {
+      type: 'IN_WITH_BODY'
+    };
+  }
   /**
      PromQL
      Expr
@@ -1654,12 +1714,19 @@ function _getAllFunctionsAndMetricNamesCompletions() {
       while (1) switch (_context.n) {
         case 0:
           metricNames = getAllMetricNamesCompletions(dataProvider);
-          return _context.a(2, [].concat(FUNCTION_COMPLETIONS, metricNames));
+          return _context.a(2, [CTE_KEYWORD_COMPLETION].concat(FUNCTION_COMPLETIONS, metricNames));
       }
     }, _callee);
   }));
   return _getAllFunctionsAndMetricNamesCompletions.apply(this, arguments);
 }
+var CTE_KEYWORD_COMPLETION = {
+  type: 'FUNCTION',
+  label: 'with',
+  insertText: 'with (',
+  detail: 'with (cte_name = expr, ...) expr',
+  documentation: 'Define Common Table Expressions (CTEs) for use in the query. MetricsQL extension.'
+};
 var DURATION_COMPLETIONS = /*#__PURE__*/['1m', '5m', '10m', '30m', '1h', '1d'].map(function (text) {
   return {
     type: 'DURATION',
@@ -1901,6 +1968,7 @@ function getCompletions(situation, dataProvider) {
       return Promise.resolve(DURATION_COMPLETIONS);
     case 'IN_FUNCTION':
       return getAllFunctionsAndMetricNamesCompletions(dataProvider);
+    case 'IN_WITH_BODY':
     case 'AT_ROOT':
       {
         return getAllFunctionsAndMetricNamesCompletions(dataProvider);
@@ -1909,7 +1977,7 @@ function getCompletions(situation, dataProvider) {
       {
         var metricNames = getAllMetricNamesCompletions(dataProvider);
         var historyCompletions = getAllHistoryCompletions();
-        return Promise.resolve([].concat(historyCompletions, FUNCTION_COMPLETIONS, metricNames));
+        return Promise.resolve([].concat(historyCompletions, [CTE_KEYWORD_COMPLETION], FUNCTION_COMPLETIONS, metricNames));
       }
     case 'IN_LABEL_SELECTOR_NO_LABEL_NAME':
       return getLabelNamesForSelectorCompletions(situation.metricName, situation.hasOperator, situation.otherLabels, dataProvider);
@@ -1973,6 +2041,18 @@ function getCompletionProvider(monaco, dataProvider) {
       // to stop it, we use a number-as-string sortkey,
       // so that monaco keeps the order we use
       var maxIndexDigits = items.length.toString().length;
+      // Determine the completion range based on situation type
+      var completionRange = range;
+      if (situation && situation.type === 'IN_LABEL_SELECTOR_WITH_LABEL_NAME' && situation.betweenQuotes) {
+        // For label values within quotes, replace from the start of the value to the current position
+        var valueStartPosition = model.getPositionAt(situation.valueStartPos);
+        completionRange = monaco.Range.lift({
+          startLineNumber: valueStartPosition.lineNumber,
+          endLineNumber: position.lineNumber,
+          startColumn: valueStartPosition.column,
+          endColumn: position.column
+        });
+      }
       var suggestions = items.map(function (item, index) {
         return {
           kind: getMonacoCompletionItemKind(item.type, monaco),
@@ -1981,7 +2061,7 @@ function getCompletionProvider(monaco, dataProvider) {
           detail: item.detail,
           documentation: item.documentation,
           sortText: index.toString().padStart(maxIndexDigits, '0'),
-          range: range,
+          range: completionRange,
           command: item.triggerOnInsert ? {
             id: 'editor.action.triggerSuggest',
             title: ''
@@ -2130,9 +2210,7 @@ function PromQLEditor(props) {
     onChange = props.onChange,
     onEnter = props.onEnter,
     onBlur = props.onBlur,
-    editorDidMount = props.editorDidMount,
-    _props$debugEscKey = props.debugEscKey,
-    debugEscKey = _props$debugEscKey === void 0 ? false : _props$debugEscKey;
+    editorDidMount = props.editorDidMount;
   var autocompleteDisposeFun = useRef(null);
   var containerRef = useRef(null);
   var dataProviderRef = useRef(null);
@@ -2222,18 +2300,6 @@ function PromQLEditor(props) {
     editor$1.addCommand(KeyCode.Enter, function () {
       onEnter == null || onEnter(editor$1.getValue());
     }, '!suggestWidgetVisible && isEditorFocused' + id);
-    editor$1.addCommand(KeyCode.Escape, function () {
-      if (debugEscKey) {
-        var _editor$_contextKeySe;
-        var suggestWidgetVisible = editor$1 == null || (_editor$_contextKeySe = editor$1._contextKeyService) == null || _editor$_contextKeySe.getContextKeyValue == null ? void 0 : _editor$_contextKeySe.getContextKeyValue('suggestWidgetVisible');
-        // eslint-disable-next-line no-console
-        console.log('[PromQLEditor][ESC]', {
-          suggestWidgetVisible: suggestWidgetVisible,
-          valueLength: editor$1.getValue().length
-        });
-      }
-      editor$1.trigger('keyboard', 'hideSuggestWidget', {});
-    }, 'suggestWidgetVisible && isEditorFocused' + id);
     // Initialize previous content tracking
     previousContentRef.current = editor$1.getValue();
     lastDeletionTriggerTimeRef.current = 0;