@retailcrm/datalens-ui 0.0.0

package/components/FieldEditor.js

@@ -0,0 +1,2240 @@
+import { language, conf } from "monaco-editor/esm/vs/basic-languages/mysql/mysql";
+import { ci as DATALENS_LIGHT_THEME_MONACO, cj as DATALENS_DARK_HC_THEME_MONACO, ck as DATALENS_DARK_THEME_MONACO, cl as DATALENS_LIGHT_HC_THEME_MONACO, cm as LIGHT_THEME_MONACO, cn as DARK_HC_THEME_MONACO, co as DARK_THEME_MONACO, cp as LIGHT_HC_THEME_MONACO, cq as FORMULA_LANGUAGE_ID, cr as QL_LANGUAGE_ID, bA as DatasetFieldAggregation, b5 as DatasetFieldType, r as registry, D as DL, cs as SPLIT_PANE_RESIZER_CLASSNAME, l as I18n, ct as DocSectionQa, F as Feature, cu as FieldEditorQa, cv as DialogFieldEditorQA } from "./AccessRights.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import React__default from "react";
+import { Loader, List, Flex, Text, Button, Icon, Dialog, TextInput, SegmentedRadioGroup, ActionTooltip, HelpMark, Select } from "@gravity-ui/uikit";
+import block from "bem-cn-lite";
+import _ from "lodash";
+import { connect } from "react-redux";
+import SplitPane from "react-split-pane";
+import { u as updateUserSettings, b as selectFieldEditorDocShown } from "./AsideHeaderAdapter.js";
+import { l as logger, i as isEnabledFeature, U as Utils, g as getSdk, D as sdk } from "./ActionPanel.js";
+import { a as DialogConfirm } from "./DialogConfirm.js";
+import { Y as YfmWrapper } from "./YfmWrapper.js";
+import { D as DatasetFieldList } from "./DatasetFieldList.js";
+import { M as Monaco } from "./Monaco.js";
+import { Pencil, EyeSlash, Eye } from "@gravity-ui/icons";
+import { v1 } from "uuid";
+import { D as DataTypeIcon } from "./DataTypeIcon.js";
+const mapUIKitThemeToMonacoTheme = (uikitTheme) => {
+  switch (uikitTheme) {
+    case "light": {
+      return LIGHT_THEME_MONACO;
+    }
+    case "light-hc": {
+      return LIGHT_HC_THEME_MONACO;
+    }
+    case "dark": {
+      return DARK_THEME_MONACO;
+    }
+    case "dark-hc": {
+      return DARK_HC_THEME_MONACO;
+    }
+    default: {
+      logger.logError(`Unknown theme value ${uikitTheme}`);
+      return LIGHT_THEME_MONACO;
+    }
+  }
+};
+const mapUIKitThemeToDlMonacoTheme = (uikitTheme) => {
+  switch (uikitTheme) {
+    case "light": {
+      return DATALENS_LIGHT_THEME_MONACO;
+    }
+    case "light-hc": {
+      return DATALENS_LIGHT_HC_THEME_MONACO;
+    }
+    case "dark": {
+      return DATALENS_DARK_THEME_MONACO;
+    }
+    case "dark-hc": {
+      return DATALENS_DARK_HC_THEME_MONACO;
+    }
+    default: {
+      logger.logError(`Unknown theme value ${uikitTheme}`);
+      return DATALENS_LIGHT_THEME_MONACO;
+    }
+  }
+};
+const mapDlMonacoThemeToMonacoTheme = (dlTheme) => {
+  switch (dlTheme) {
+    case DATALENS_LIGHT_THEME_MONACO: {
+      return LIGHT_THEME_MONACO;
+    }
+    case DATALENS_LIGHT_HC_THEME_MONACO: {
+      return LIGHT_HC_THEME_MONACO;
+    }
+    case DATALENS_DARK_THEME_MONACO: {
+      return DARK_THEME_MONACO;
+    }
+    case DATALENS_DARK_HC_THEME_MONACO: {
+      return DARK_HC_THEME_MONACO;
+    }
+    default: {
+      logger.logError(`Unknown theme value ${dlTheme}`);
+      return LIGHT_THEME_MONACO;
+    }
+  }
+};
+const computedStyle = getComputedStyle(document.documentElement);
+const reRegExpChar = /[\\^$]/g;
+const reHasRegExpChar = RegExp(reRegExpChar.source);
+const getTokenColor = (token) => {
+  const preparedToken = token.split(".").join("-");
+  return computedStyle.getPropertyValue(`--dl-color-monaco-${preparedToken}`).substring(1) || void 0;
+};
+const isLanguageAlreadyRegister = (monaco, languageId) => {
+  const languages = monaco.languages.getLanguages();
+  return languages.findIndex(({ id }) => id === languageId) !== -1;
+};
+const createCompletionItem = ({
+  monaco,
+  label,
+  range,
+  kind,
+  detail,
+  documentation,
+  insertText,
+  sortText
+}) => {
+  return {
+    label,
+    range,
+    kind,
+    detail,
+    documentation,
+    insertText: insertText || label,
+    insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet,
+    sortText
+  };
+};
+const escapeFieldName = (string) => {
+  return string && reHasRegExpChar.test(string) ? string.replace(reRegExpChar, "\\$&") : string || "";
+};
+const TOKENS = {
+  KEYWORD: "keyword.sql",
+  OPERATOR: "operator.sql",
+  STRING: "string",
+  STRING_ESCAPE: "string.escape",
+  STRING_INVALID: "invalid",
+  NUMBER: "number.sql",
+  DATE: "date",
+  FIELD: "field",
+  COMMENT: "comment",
+  COMMENT_QUOTE: "comment.quote"
+};
+const OPERATORS$1 = ["BETWEEN", "IN", "IS", "NOT", "LIKE", "OR"];
+const KEYWORDS$1 = [
+  "AMONG",
+  "AND",
+  "CASE",
+  "ELSE",
+  "ELSEIF",
+  "END",
+  "FALSE",
+  "IF",
+  "NULL",
+  "THEN",
+  "TOTAL",
+  "TRUE",
+  "WHEN",
+  "WITHIN",
+  "ASC",
+  "DESC",
+  "FIXED",
+  "INCLUDE",
+  "EXCLUDE"
+];
+const COMPLEX_KEYWORDS = ["ORDER BY", "BEFORE FILTER BY", "IGNORE DIMENSIONS"];
+const COLOR_THEME_RULES = [
+  { token: TOKENS.STRING_ESCAPE, foreground: getTokenColor(TOKENS.STRING_ESCAPE) },
+  { token: TOKENS.DATE, foreground: getTokenColor(TOKENS.DATE) },
+  { token: TOKENS.FIELD, foreground: getTokenColor(TOKENS.FIELD) }
+];
+let currentItemProvider = null;
+const defineDlMonacoThemes = (monaco, dlThemes) => {
+  dlThemes.forEach((dlTheme) => {
+    monaco.editor.defineTheme(dlTheme, {
+      base: mapDlMonacoThemeToMonacoTheme(dlTheme),
+      inherit: true,
+      colors: {},
+      rules: COLOR_THEME_RULES
+    });
+  });
+};
+const registerDatalensFormulaLanguage = (monaco) => {
+  const isRegister = isLanguageAlreadyRegister(monaco, FORMULA_LANGUAGE_ID);
+  if (isRegister) {
+    return;
+  }
+  monaco.languages.register({ id: FORMULA_LANGUAGE_ID });
+  monaco.languages.setLanguageConfiguration(FORMULA_LANGUAGE_ID, {
+    brackets: [
+      ["{", "}"],
+      ["[", "]"],
+      ["(", ")"],
+      ["'", "'"],
+      ['"', '"']
+    ],
+    comments: {
+      lineComment: "--",
+      blockComment: ["/*", "*/"]
+    }
+  });
+  defineDlMonacoThemes(monaco, [
+    DATALENS_LIGHT_THEME_MONACO,
+    DATALENS_LIGHT_HC_THEME_MONACO,
+    DATALENS_DARK_THEME_MONACO,
+    DATALENS_DARK_HC_THEME_MONACO
+  ]);
+};
+const setDatalensFormulaLanguageConfiguration = (monaco, lowerCaseFunctions, fields) => {
+  const functions = lowerCaseFunctions.map((fn) => fn.toUpperCase());
+  monaco.languages.setMonarchTokensProvider(FORMULA_LANGUAGE_ID, {
+    /* TS swears at the use of custom fields that are not included in IMonarchLanguage. In the official documentation, a similar technique is used to create links in the tokenizer's regulars. Therefore, I put down ts-ignore*/
+    functions,
+    keywords: KEYWORDS$1,
+    complexKeywords: COMPLEX_KEYWORDS.map((keyword) => keyword.replace(" ", "\\W+")).join("|"),
+    operators: OPERATORS$1,
+    date: /\d{4}-\d{2}-\d{2}/,
+    datetime: /@date[Tt ](\d{2}(:\d{2}(:\d{2})?)?)?/,
+    escapes: /\\(?:[nrt"'\\])/,
+    tokenizer: {
+      root: [
+        [/#@date#/, TOKENS.DATE],
+        [/##@date##/, TOKENS.DATE],
+        [/#@datetime#/, TOKENS.DATE],
+        [/##@datetime##/, TOKENS.DATE],
+        { include: "@comments" },
+        { include: "@numbers" },
+        [/@complexKeywords/, "keyword"],
+        [
+          /[\w@#$]+/,
+          {
+            cases: {
+              "@keywords": TOKENS.KEYWORD,
+              "@functions": TOKENS.KEYWORD,
+              "@operators": TOKENS.OPERATOR
+            }
+          }
+        ],
+        [/[<>=!%&+\-*/|~^]/, TOKENS.OPERATOR],
+        [/"([^"\\]|\\.)*$/, TOKENS.STRING_INVALID],
+        [/'([^'\\]|\\.)*$/, TOKENS.STRING_INVALID],
+        [/'/, TOKENS.STRING, "@stringSingle"],
+        [/"/, TOKENS.STRING, "@stringDouble"],
+        [/\[[^[\]{}]+\]/, TOKENS.FIELD]
+      ],
+      comments: [
+        [/--+.*/, TOKENS.COMMENT],
+        [/\/\*/, { token: TOKENS.COMMENT_QUOTE, next: "@comment" }]
+      ],
+      comment: [
+        [/[^*/]+/, TOKENS.COMMENT],
+        [/\*\//, { token: TOKENS.COMMENT_QUOTE, next: "@pop" }],
+        [/./, TOKENS.COMMENT]
+      ],
+      numbers: [
+        [/0[xX][0-9a-fA-F]*/, TOKENS.NUMBER],
+        [/[$][+-]*\d*(\.\d*)?/, TOKENS.NUMBER],
+        [/((\d+(\.\d*)?)|(\.\d+))([eE][-+]?\d+)?/, TOKENS.NUMBER]
+      ],
+      stringSingle: [
+        [/[^\\']+/, TOKENS.STRING],
+        [/@escapes/, TOKENS.STRING_ESCAPE],
+        [/\\./, TOKENS.STRING_INVALID],
+        [/'/, TOKENS.STRING, "@pop"]
+      ],
+      stringDouble: [
+        [/[^\\"]+/, TOKENS.STRING],
+        [/@escapes/, TOKENS.STRING_ESCAPE],
+        [/\\./, TOKENS.STRING_INVALID],
+        [/"/, TOKENS.STRING, "@pop"]
+      ]
+    },
+    ignoreCase: true
+  });
+  if (currentItemProvider) {
+    currentItemProvider.dispose();
+  }
+  currentItemProvider = monaco.languages.registerCompletionItemProvider(FORMULA_LANGUAGE_ID, {
+    triggerCharacters: ["["],
+    provideCompletionItems: (model, position, context) => {
+      const word = model.getWordUntilPosition(position);
+      const range = {
+        startLineNumber: position.lineNumber,
+        endLineNumber: position.lineNumber,
+        startColumn: word.startColumn,
+        endColumn: word.endColumn
+      };
+      const hasOpeningParenthesis = model.getValueInRange({
+        startLineNumber: position.lineNumber,
+        startColumn: position.column,
+        endLineNumber: position.lineNumber,
+        endColumn: position.column + 1
+      }) === "(";
+      const hasOpeningSquareBracket = model.getValueInRange({
+        startLineNumber: position.lineNumber,
+        startColumn: word.startColumn,
+        endLineNumber: position.lineNumber,
+        endColumn: word.startColumn - 1
+      }) === "[";
+      const isTrigger = context.triggerKind === monaco.languages.CompletionTriggerKind.TriggerCharacter;
+      const showAllSuggestions = !isTrigger && !hasOpeningSquareBracket;
+      const suggestions = [
+        // Autocomplete for available fields
+        ...fields.map((label) => {
+          const escapedValue = escapeFieldName(label);
+          return createCompletionItem({
+            monaco,
+            label,
+            range,
+            kind: monaco.languages.CompletionItemKind.Value,
+            insertText: showAllSuggestions ? `[${escapedValue}]` : escapedValue
+          });
+        })
+      ];
+      if (showAllSuggestions) {
+        suggestions.push(
+          ...OPERATORS$1.map((label) => {
+            return createCompletionItem({
+              monaco,
+              label,
+              range,
+              kind: monaco.languages.CompletionItemKind.Operator
+            });
+          }),
+          ...functions.map((label) => {
+            return createCompletionItem({
+              monaco,
+              label,
+              range,
+              kind: monaco.languages.CompletionItemKind.Function,
+              insertText: `${label}${hasOpeningParenthesis ? "" : "($0)"}`
+            });
+          }),
+          ...[...KEYWORDS$1, ...COMPLEX_KEYWORDS].map((label) => {
+            return createCompletionItem({
+              monaco,
+              label,
+              range,
+              kind: monaco.languages.CompletionItemKind.Keyword
+            });
+          })
+        );
+      }
+      return { suggestions };
+    }
+  });
+};
+const KEYWORDS = [
+  "AS",
+  "ASC",
+  "BY",
+  "CONCAT",
+  "DATE",
+  "DATETIME",
+  "DAYOFYEAR",
+  "DECIMAL",
+  "DESC",
+  "DISTINCT",
+  "END",
+  "FALSE",
+  "FIRST",
+  "FROM",
+  "GROUP",
+  "HAVING",
+  "HOUR",
+  "IF",
+  "INT",
+  "LIMIT",
+  "OFFSET",
+  "RANGE",
+  "ROWCOUNT",
+  "SET",
+  "TIME",
+  "TRUE",
+  "UNIQUE",
+  "VARCHAR",
+  "WHERE",
+  "SELECT",
+  "ORDER"
+];
+const FUNCTIONS = [
+  // Aggregate
+  "AVG",
+  "ANY",
+  "CHECKSUM_AGG",
+  "COUNT",
+  "COUNT_BIG",
+  "COVARPOP",
+  "COVARSAMP",
+  "GROUPING",
+  "GROUPING_ID",
+  "MAX",
+  "MIN",
+  "SUM",
+  "STDEV",
+  "STDEVP",
+  "STDDEVPOP",
+  "STDDEVSAMP",
+  "VAR",
+  "VARP",
+  "VARPOP",
+  "VARSAMP",
+  // Analytic
+  "CUME_DIST",
+  "FIRST_VALUE",
+  "LAG",
+  "LAST_VALUE",
+  "LEAD",
+  "PERCENTILE_CONT",
+  "PERCENTILE_DISC",
+  "PERCENT_RANK",
+  // ClickHouse-specific aggregate functions
+  "ANYHEAVY",
+  "ANYLAST",
+  "ARGMIN",
+  "ARGMAX",
+  "AVGWEIGHTED",
+  "TOPK",
+  "TOPKWEIGHTED",
+  "GROUPARRAY",
+  "GROUPUNIQARRAY",
+  "GROUPARRAYINSERTAT",
+  "GROUPARRAYMOVINGAVG",
+  "GROUPARRAYMOVINGSUM",
+  "GROUPBITAND",
+  "GROUPBITOR",
+  "GROUPBITXOR",
+  "GROUPBITMAP",
+  "GROUPBITMAPAND",
+  "GROUPBITMAPOR",
+  "GROUPBITMAPXOR",
+  "SUMWITHOVERFLOW",
+  "SUMMAP",
+  "MINMAP",
+  "MAXMAP",
+  "SKEWSAMP",
+  "SKEWPOP",
+  "KURTSAMP",
+  "KURTPOP",
+  "UNIQ",
+  "UNIQEXACT",
+  "UNIQCOMBINED",
+  "UNIQCOMBINED64",
+  "UNIQHLL12",
+  "QUANTILE",
+  "QUANTILES",
+  "QUANTILEEXACT",
+  "QUANTILEEXACTLOW",
+  "QUANTILEEXACTHIGH",
+  "QUANTILEEXACTWEIGHTED",
+  "QUANTILETIMING",
+  "QUANTILETIMINGWEIGHTED",
+  "QUANTILEDETERMINISTIC",
+  "QUANTILETDIGEST",
+  "QUANTILETDIGESTWEIGHTED",
+  "QUANTILEBFLOAT16",
+  "QUANTILEBFLOAT16WEIGHTED",
+  "SIMPLELINEARREGRESSION",
+  "STOCHASTICLINEARREGRESSION",
+  "STOCHASTICLOGISTICREGRESSION",
+  "CATEGORICALINFORMATIONVALUE",
+  // Collation
+  "COLLATE",
+  "COLLATIONPROPERTY",
+  "TERTIARY_WEIGHTS",
+  // Azure
+  "FEDERATION_FILTERING_VALUE",
+  // Conversion
+  "CAST",
+  "CONVERT",
+  "PARSE",
+  "TRY_CAST",
+  "TRY_CONVERT",
+  "TRY_PARSE",
+  // Cryptographic
+  "ASYMKEY_ID",
+  "ASYMKEYPROPERTY",
+  "CERTPROPERTY",
+  "CERT_ID",
+  "CRYPT_GEN_RANDOM",
+  "DECRYPTBYASYMKEY",
+  "DECRYPTBYCERT",
+  "DECRYPTBYKEY",
+  "DECRYPTBYKEYAUTOASYMKEY",
+  "DECRYPTBYKEYAUTOCERT",
+  "DECRYPTBYPASSPHRASE",
+  "ENCRYPTBYASYMKEY",
+  "ENCRYPTBYCERT",
+  "ENCRYPTBYKEY",
+  "ENCRYPTBYPASSPHRASE",
+  "HASHBYTES",
+  "IS_OBJECTSIGNED",
+  "KEY_GUID",
+  "KEY_ID",
+  "KEY_NAME",
+  "SIGNBYASYMKEY",
+  "SIGNBYCERT",
+  "SYMKEYPROPERTY",
+  "VERIFYSIGNEDBYCERT",
+  "VERIFYSIGNEDBYASYMKEY",
+  // Cursor
+  "CURSOR_STATUS",
+  // Datatype
+  "DATALENGTH",
+  "IDENT_CURRENT",
+  "IDENT_INCR",
+  "IDENT_SEED",
+  "IDENTITY",
+  "SQL_VARIANT_PROPERTY",
+  // Datetime
+  "CURRENT_TIMESTAMP",
+  "DATEADD",
+  "DATEDIFF",
+  "DATEFROMPARTS",
+  "DATENAME",
+  "DATEPART",
+  "DATETIME2FROMPARTS",
+  "DATETIMEFROMPARTS",
+  "DATETIMEOFFSETFROMPARTS",
+  "DAY",
+  "EOMONTH",
+  "GETDATE",
+  "GETUTCDATE",
+  "ISDATE",
+  "MONTH",
+  "SMALLDATETIMEFROMPARTS",
+  "SWITCHOFFSET",
+  "SYSDATETIME",
+  "SYSDATETIMEOFFSET",
+  "SYSUTCDATETIME",
+  "TIMEFROMPARTS",
+  "TODATETIMEOFFSET",
+  "YEAR",
+  // Logical
+  "CHOOSE",
+  "COALESCE",
+  "IIF",
+  "NULLIF",
+  // Mathematical
+  "ABS",
+  "ACOS",
+  "ASIN",
+  "ATAN",
+  "ATN2",
+  "CEILING",
+  "COS",
+  "COT",
+  "DEGREES",
+  "EXP",
+  "FLOOR",
+  "LOG",
+  "LOG10",
+  "PI",
+  "POWER",
+  "RADIANS",
+  "RAND",
+  "ROUND",
+  "SIGN",
+  "SIN",
+  "SQRT",
+  "SQUARE",
+  "TAN",
+  // Metadata
+  "APP_NAME",
+  "APPLOCK_MODE",
+  "APPLOCK_TEST",
+  "ASSEMBLYPROPERTY",
+  "COL_LENGTH",
+  "COL_NAME",
+  "COLUMNPROPERTY",
+  "DATABASE_PRINCIPAL_ID",
+  "DATABASEPROPERTYEX",
+  "DB_ID",
+  "DB_NAME",
+  "FILE_ID",
+  "FILE_IDEX",
+  "FILE_NAME",
+  "FILEGROUP_ID",
+  "FILEGROUP_NAME",
+  "FILEGROUPPROPERTY",
+  "FILEPROPERTY",
+  "FULLTEXTCATALOGPROPERTY",
+  "FULLTEXTSERVICEPROPERTY",
+  "INDEX_COL",
+  "INDEXKEY_PROPERTY",
+  "INDEXPROPERTY",
+  "OBJECT_DEFINITION",
+  "OBJECT_ID",
+  "OBJECT_NAME",
+  "OBJECT_SCHEMA_NAME",
+  "OBJECTPROPERTY",
+  "OBJECTPROPERTYEX",
+  "ORIGINAL_DB_NAME",
+  "PARSENAME",
+  "SCHEMA_ID",
+  "SCHEMA_NAME",
+  "SCOPE_IDENTITY",
+  "SERVERPROPERTY",
+  "STATS_DATE",
+  "TYPE_ID",
+  "TYPE_NAME",
+  "TYPEPROPERTY",
+  // Ranking
+  "DENSE_RANK",
+  "NTILE",
+  "RANK",
+  "ROW_NUMBER",
+  // Replication
+  "PUBLISHINGSERVERNAME",
+  // Rowset
+  "OPENDATASOURCE",
+  "OPENQUERY",
+  "OPENROWSET",
+  "OPENXML",
+  // Security
+  "CERTENCODED",
+  "CERTPRIVATEKEY",
+  "CURRENT_USER",
+  "HAS_DBACCESS",
+  "HAS_PERMS_BY_NAME",
+  "IS_MEMBER",
+  "IS_ROLEMEMBER",
+  "IS_SRVROLEMEMBER",
+  "LOGINPROPERTY",
+  "ORIGINAL_LOGIN",
+  "PERMISSIONS",
+  "PWDENCRYPT",
+  "PWDCOMPARE",
+  "SESSION_USER",
+  "SESSIONPROPERTY",
+  "SUSER_ID",
+  "SUSER_NAME",
+  "SUSER_SID",
+  "SUSER_SNAME",
+  "SYSTEM_USER",
+  "USER",
+  "USER_ID",
+  "USER_NAME",
+  // String
+  "ASCII",
+  "CHAR",
+  "CHARINDEX",
+  "CONCAT",
+  "DIFFERENCE",
+  "FORMAT",
+  "LEFT",
+  "LEN",
+  "LOWER",
+  "LTRIM",
+  "NCHAR",
+  "PATINDEX",
+  "QUOTENAME",
+  "REPLACE",
+  "REPLICATE",
+  "REVERSE",
+  "RIGHT",
+  "RTRIM",
+  "SOUNDEX",
+  "SPACE",
+  "STR",
+  "STUFF",
+  "SUBSTRING",
+  "UNICODE",
+  "UPPER",
+  // System
+  "BINARY_CHECKSUM",
+  "CHECKSUM",
+  "CONNECTIONPROPERTY",
+  "CONTEXT_INFO",
+  "CURRENT_REQUEST_ID",
+  "ERROR_LINE",
+  "ERROR_NUMBER",
+  "ERROR_MESSAGE",
+  "ERROR_PROCEDURE",
+  "ERROR_SEVERITY",
+  "ERROR_STATE",
+  "FORMATMESSAGE",
+  "GETANSINULL",
+  "GET_FILESTREAM_TRANSACTION_CONTEXT",
+  "HOST_ID",
+  "HOST_NAME",
+  "ISNULL",
+  "ISNUMERIC",
+  "MIN_ACTIVE_ROWVERSION",
+  "NEWID",
+  "NEWSEQUENTIALID",
+  "ROWCOUNT_BIG",
+  "XACT_STATE",
+  // TextImage
+  "TEXTPTR",
+  "TEXTVALID",
+  // Trigger
+  "COLUMNS_UPDATED",
+  "EVENTDATA",
+  "TRIGGER_NESTLEVEL",
+  "UPDATE",
+  // ChangeTracking
+  "CHANGETABLE",
+  "CHANGE_TRACKING_CONTEXT",
+  "CHANGE_TRACKING_CURRENT_VERSION",
+  "CHANGE_TRACKING_IS_COLUMN_IN_MASK",
+  "CHANGE_TRACKING_MIN_VALID_VERSION",
+  // FullTextSearch
+  "CONTAINSTABLE",
+  "FREETEXTTABLE",
+  // SemanticTextSearch
+  "SEMANTICKEYPHRASETABLE",
+  "SEMANTICSIMILARITYDETAILSTABLE",
+  "SEMANTICSIMILARITYTABLE",
+  // FileStream
+  "FILETABLEROOTPATH",
+  "GETFILENAMESPACEPATH",
+  "GETPATHLOCATOR",
+  "PATHNAME",
+  // ServiceBroker
+  "GET_TRANSMISSION_STATUS",
+  // ClickHouse Arrays
+  "EMPTY",
+  "NOTEMPTY",
+  "LENGTH",
+  "ARRAYCONCAT",
+  "ARRAYELEMENT",
+  "HAS",
+  "HASALL",
+  "HASANY",
+  "HASSUBSTR",
+  "INDEXOF",
+  "ARRAYCOUNT",
+  "COUNTEQUAL",
+  "ARRAYENUMERATE",
+  "ARRAYENUMERATEUNIQ",
+  "ARRAYSORT",
+  "ARRAYUNIQ",
+  "ARRAYJOIN",
+  "ARRAYDIFFERENCE",
+  "ARRAYDISTINCT",
+  "REVERSE",
+  "ARRAYFLATTEN",
+  "ARRAYCOMPACT",
+  "ARRAYZIP",
+  "ARRAYAUC",
+  "ARRAYMAP",
+  "ARRAYFILTER",
+  "ARRAYFILL",
+  "ARRAYREVERSEFILL",
+  "ARRAYSPLIT",
+  "ARRAYREVERSESPLIT",
+  "ARRAYEXISTS",
+  "ARRAYALL",
+  "ARRAYFIRST",
+  "ARRAYLAST",
+  "ARRAYFIRSTINDEX",
+  "ARRAYLASTINDEX",
+  "ARRAYMIN",
+  "ARRAYMAX",
+  "ARRAYSUM",
+  "ARRAYAVG",
+  "ARRAYCUMSUM",
+  "ARRAYCUMSUMNONNEGATIVE",
+  "ARRAYPRODUCT"
+];
+const OPERATORS = [
+  // Logical
+  "ALL",
+  "AND",
+  "ANY",
+  "BETWEEN",
+  "EQUALS",
+  "GREATER",
+  "GREATEROREQUALS",
+  "EXISTS",
+  "IN",
+  "LESSOREQUALS",
+  "LESS",
+  "LIKE",
+  "NOTLIKE",
+  "NOT",
+  "NOTEQUALS",
+  "NOTIN",
+  "OR",
+  "SOME",
+  // Set
+  "EXCEPT",
+  "INTERSECT",
+  "UNION",
+  // Join
+  "APPLY",
+  "CROSS",
+  "FULL",
+  "INNER",
+  "JOIN",
+  "LEFT",
+  "OUTER",
+  "RIGHT",
+  // Predicates
+  "CONTAINS",
+  "FREETEXT",
+  "IS",
+  "NULL",
+  // Pivoting
+  "PIVOT",
+  "UNPIVOT",
+  // Merging
+  "MATCHED",
+  // Access Operators
+  "ARRAYELEMENT",
+  "TUPLEELEMENT",
+  // Numeric Negation
+  "NEGATE",
+  // Multiplication and Division
+  "MULTIPLY",
+  "DIVIDE",
+  "MODULO",
+  // Dates and Times
+  "DAY",
+  "HOUR",
+  "MINUTE",
+  "MONTH",
+  "QUARTER",
+  "SECOND",
+  "WEEK",
+  "YEAR",
+  // Concat
+  "CONCAT",
+  // Array
+  "ARRAY",
+  // Tuple
+  "TUPLE"
+];
+let fieldItemProvider = null;
+const registerDatalensQLLanguage = (monaco) => {
+  const isRegister = isLanguageAlreadyRegister(monaco, QL_LANGUAGE_ID);
+  if (isRegister) {
+    return;
+  }
+  monaco.languages.register({ id: QL_LANGUAGE_ID });
+  monaco.languages.setLanguageConfiguration(QL_LANGUAGE_ID, conf);
+};
+const setDatalensQLLanguageConfiguration = (monaco, fields, tables) => {
+  monaco.languages.setMonarchTokensProvider(QL_LANGUAGE_ID, language);
+  if (fieldItemProvider) {
+    fieldItemProvider.dispose();
+  }
+  fieldItemProvider = monaco.languages.registerCompletionItemProvider(QL_LANGUAGE_ID, {
+    triggerCharacters: [" "],
+    provideCompletionItems: (model, position, context) => {
+      const word = model.getWordUntilPosition(position);
+      const isTrigger = context.triggerKind === monaco.languages.CompletionTriggerKind.TriggerCharacter;
+      const rangeFromStart = {
+        startLineNumber: 1,
+        endLineNumber: position.lineNumber,
+        startColumn: 1,
+        endColumn: word.endColumn
+      };
+      const rangeFromLineStart = {
+        startLineNumber: position.lineNumber,
+        endLineNumber: position.lineNumber,
+        startColumn: 1,
+        endColumn: word.endColumn
+      };
+      const textBeforePosition = model.getValueInRange(rangeFromStart).replace(/\n/g, " ").trim().toLowerCase();
+      const lineTextBeforePosition = model.getValueInRange(rangeFromLineStart).toLowerCase();
+      const range = {
+        startLineNumber: position.lineNumber,
+        endLineNumber: position.lineNumber,
+        startColumn: word.startColumn,
+        endColumn: word.endColumn
+      };
+      const matchLastIdentificator = lineTextBeforePosition.match(/.* ([^ ]+)$/);
+      if (matchLastIdentificator && matchLastIdentificator[1]) {
+        range.startColumn = position.column - matchLastIdentificator[1].length;
+      }
+      let suggestFields = /(select|group by|order by)$/.test(textBeforePosition);
+      let suggestTables = /from$/.test(textBeforePosition);
+      if (!suggestFields || !suggestTables) {
+        const selectIndex = textBeforePosition.indexOf("select");
+        const fromIndex = textBeforePosition.indexOf("from");
+        const groupByIndex = textBeforePosition.indexOf("group by");
+        const orderByIndex = textBeforePosition.indexOf("order by");
+        const maxFieldsIndex = Math.max(...[selectIndex, groupByIndex, orderByIndex]);
+        if (maxFieldsIndex > fromIndex) {
+          suggestFields = true;
+        } else if (fromIndex > maxFieldsIndex) {
+          suggestTables = true;
+        }
+      }
+      let suggestions = [];
+      const fieldsSuggestions = fields.map(({ title, description, user_type }) => {
+        const escapedValue = escapeFieldName(title);
+        return createCompletionItem({
+          monaco,
+          label: title,
+          documentation: description,
+          detail: user_type,
+          range,
+          kind: monaco.languages.CompletionItemKind.Field,
+          insertText: escapedValue,
+          sortText: `0${title}`
+        });
+      });
+      const tablesSuggestions = tables.map(({ title, source_type, group }) => {
+        let text = escapeFieldName(title);
+        const prefix = group ? group.join(".") : "";
+        if (prefix) {
+          text = `${prefix}.${text}`;
+        }
+        return createCompletionItem({
+          monaco,
+          label: text,
+          detail: source_type,
+          range,
+          kind: monaco.languages.CompletionItemKind.Struct,
+          insertText: text,
+          sortText: `0${text}`
+        });
+      });
+      const basicSuggestions = [
+        ...KEYWORDS.map((text) => {
+          return createCompletionItem({
+            monaco,
+            label: text,
+            range,
+            kind: monaco.languages.CompletionItemKind.Keyword,
+            insertText: text,
+            sortText: text
+          });
+        }),
+        ...FUNCTIONS.map((text) => {
+          return createCompletionItem({
+            monaco,
+            label: text,
+            range,
+            kind: monaco.languages.CompletionItemKind.Function,
+            insertText: text,
+            sortText: text
+          });
+        }),
+        ...OPERATORS.map((text) => {
+          return createCompletionItem({
+            monaco,
+            label: text,
+            range,
+            kind: monaco.languages.CompletionItemKind.Operator,
+            insertText: text,
+            sortText: text
+          });
+        })
+      ];
+      if (suggestFields) {
+        suggestions = [...fieldsSuggestions, ...basicSuggestions];
+      } else if (suggestTables) {
+        suggestions = [...tablesSuggestions, ...basicSuggestions];
+      } else if (!isTrigger) {
+        suggestions = [...fieldsSuggestions, ...tablesSuggestions, ...basicSuggestions];
+      }
+      return { suggestions };
+    }
+  });
+};
+const NEW_FIELD_PROPERTIES = {
+  calc_mode: "formula",
+  source: "",
+  formula: "",
+  description: "",
+  title: "",
+  type: DatasetFieldType.Dimension,
+  aggregation: DatasetFieldAggregation.None,
+  hidden: false
+};
+const DUPLICATE_TITLE = "duplicateTitle";
+const EMPTY_SOURCE = "emptySource";
+const EMPTY_TITLE = "emptyTitle";
+const INVALID_ID = "invalidId";
+const LEFT_PANE_MIN_WIDTH = 256;
+const LEFT_PANE_MAX_WIDTH = 512;
+const RESIZER_WIDTH = 1;
+const ID_ALLOWED_CHARS = /^[a-z0-9_-]{1,36}$/;
+const isTitleEmpty = (field) => {
+  const { title = "" } = field;
+  return !title.replace(/\s/g, "");
+};
+const isTitleDuplicate = (field, fields) => {
+  const { title: titleCurrent, guid: guidCurrent } = field;
+  return fields.some(({ title, guid }) => {
+    if (guidCurrent === guid) {
+      return false;
+    }
+    const titleCurrentPrepared = titleCurrent.trim();
+    const titlePrepared = title.trim();
+    return titleCurrentPrepared === titlePrepared;
+  });
+};
+const isSourceEmpty = (field) => {
+  return !field.source;
+};
+const isInvalidId = (field) => {
+  return !ID_ALLOWED_CHARS.test(field.new_id || field.guid);
+};
+const createInitialField = () => {
+  const guid = v1();
+  return {
+    ...NEW_FIELD_PROPERTIES,
+    guid
+  };
+};
+const createInitialErrors = () => {
+  return {
+    duplicateTitle: false,
+    emptySource: false,
+    emptyTitle: false,
+    invalidId: false
+  };
+};
+const getErrors = (field, fields) => {
+  const { calc_mode: calcMode } = field;
+  const errors = createInitialErrors();
+  errors.duplicateTitle = isTitleDuplicate(field, fields);
+  errors.emptyTitle = isTitleEmpty(field);
+  errors.invalidId = isInvalidId(field);
+  if (calcMode === "direct") {
+    errors.emptySource = isSourceEmpty(field);
+  }
+  return errors;
+};
+const getErrorMessageKey = (reason, errors) => {
+  let key;
+  if (Array.isArray(reason)) {
+    key = reason.filter(
+      (reasonItem) => Boolean(errors[reasonItem])
+    )[0];
+  } else {
+    const hasReason = Boolean(errors[reason]);
+    key = hasReason ? reason : "";
+  }
+  switch (key) {
+    case DUPLICATE_TITLE:
+      return "label_field-already-exist";
+    case EMPTY_SOURCE:
+      return "label_source-is-empty";
+    case EMPTY_TITLE:
+      return "label_title-is-empty";
+    case INVALID_ID:
+      return "label_invalid-id";
+    default:
+      return "";
+  }
+};
+const validateField = (field, fields) => {
+  const errors = getErrors(field, fields);
+  return Object.values(errors).every((value) => !value);
+};
+const prepareField = (field) => {
+  const { title } = field;
+  let fixedTitle = title.trim();
+  if (fixedTitle === "" && field.formula) {
+    fixedTitle = field.formula?.trim();
+    if (fixedTitle.length > 100) {
+      fixedTitle = `${fixedTitle.slice(0, 97)}...`;
+    }
+  }
+  return {
+    ...field,
+    title: fixedTitle
+  };
+};
+const getFieldEditorDocPath = (href) => {
+  return href.replace(/^\/docs\//, "");
+};
+class ChunkedFieldEditor extends React__default.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      module: null
+    };
+  }
+  componentDidMount() {
+    this.getFieldEditor();
+  }
+  render() {
+    const { module } = this.state;
+    if (!module) {
+      return null;
+    }
+    const FieldEditor2 = module;
+    return /* @__PURE__ */ jsx(FieldEditor2, { ...this.props });
+  }
+  async getFieldEditor() {
+    const { onLoadStart, onLoadComplete } = this.props;
+    if (onLoadStart) {
+      onLoadStart();
+    }
+    const module = (await Promise.resolve().then(() => FieldEditor$1)).default;
+    this.setState({ module });
+    if (onLoadComplete) {
+      onLoadComplete();
+    }
+  }
+}
+async function getFunctionsDocumentation() {
+  const getFunctionsDocumentation2 = registry.common.functions.get("getFunctionsDocumentation");
+  return getFunctionsDocumentation2();
+}
+async function fetchFunctionsDocumentation(docsEndpoint, path) {
+  const fetchFunctionsDocumentation2 = registry.common.functions.get(
+    "fetchFunctionsDocumentation"
+  );
+  return await fetchFunctionsDocumentation2(docsEndpoint, path);
+}
+const b$5 = block("dl-field-editor");
+const i18n$3 = I18n.keyset("component.dl-field-editor.view");
+const ITEM_HEIGHT = 28;
+class DocSection extends React__default.Component {
+  constructor(props) {
+    super(props);
+    this.fetchAllFunctions = async () => {
+      const { filter } = this.state;
+      this.setState({ allFunctionsLoading: true });
+      try {
+        const result = await getFunctionsDocumentation();
+        const groupedFunctions = this.getGroupedFunctions(result);
+        this.setState({
+          groupedFunctions,
+          docItems: this.getDocItems(filter, groupedFunctions, "init"),
+          allFunctionsLoading: false
+        });
+      } catch (error) {
+        logger.logError("DocSection: doc functions list failed", error);
+        this.setState({ allFunctionsLoading: false });
+      }
+    };
+    this.fetchFunctionDoc = async (item) => {
+      const { datalensDocs } = DL.ENDPOINTS;
+      this.setState({ functionLoading: true });
+      try {
+        const { href } = item;
+        const { getFieldEditorDocPath: getFieldEditorDocPath2 } = registry.docs.functions.getAll();
+        const path = getFieldEditorDocPath2(href);
+        const functionDoc = await fetchFunctionsDocumentation(datalensDocs, path);
+        this.setState({
+          functionDoc,
+          functionLoading: false
+        });
+      } catch (error) {
+        logger.logError("DocSection: function doc failed", error);
+        this.setState({ functionLoading: false });
+      }
+    };
+    this.getListContainer = () => {
+      if (!this.ref.current) {
+        return null;
+      }
+      return this.ref.current.querySelector(
+        ".g-list__items > div:first-of-type > div:first-of-type"
+      );
+    };
+    this.scrollItemToTop = (index) => {
+      setTimeout(() => {
+        this.getListContainer()?.scrollTo({
+          left: 0,
+          top: ITEM_HEIGHT * index,
+          behavior: "smooth"
+        });
+      }, 0);
+    };
+    this.onGroupDocItemClick = (groupItem, index) => {
+      const { filter, groupedFunctions } = this.state;
+      const nextGroupedFunctions = [...groupedFunctions];
+      const updatedItemIndex = nextGroupedFunctions.findIndex(({ id }) => id === groupItem.id);
+      const isOpening = !groupItem.opened;
+      if (updatedItemIndex === -1) {
+        return;
+      }
+      nextGroupedFunctions[updatedItemIndex].opened = !groupItem.opened;
+      this.setState(
+        {
+          groupedFunctions: nextGroupedFunctions,
+          docItems: this.getDocItems(filter, nextGroupedFunctions, "click")
+        },
+        () => {
+          if (isOpening) {
+            this.scrollItemToTop(index);
+          }
+        }
+      );
+    };
+    this.onFunctionDocItemClick = (item) => {
+      const { filter, groupedFunctions } = this.state;
+      const nextGroupedFunctions = [...groupedFunctions];
+      let selectedItem;
+      nextGroupedFunctions.forEach((group) => {
+        group.items.forEach((func) => {
+          func.selected = false;
+        });
+      });
+      const updatedGroupItemIndex = nextGroupedFunctions.findIndex((group) => {
+        const index = group.items.findIndex(({ id }) => id === item.id);
+        if (index !== -1) {
+          selectedItem = group.items[index];
+          group.items[index].selected = true;
+        }
+        return index !== -1;
+      });
+      if (updatedGroupItemIndex !== -1 && selectedItem?.id !== this.state.selectedItem?.id) {
+        this.fetchFunctionDoc(item);
+        this.setState({
+          selectedItem,
+          groupedFunctions: nextGroupedFunctions,
+          docItems: this.getDocItems(filter, nextGroupedFunctions, "click")
+        });
+      }
+    };
+    this.onDocItemClick = (item, index) => {
+      if (item.items) {
+        this.onGroupDocItemClick(item, index);
+        return;
+      }
+      this.onFunctionDocItemClick(item);
+    };
+    this.ref = React__default.createRef();
+    this.state = {
+      groupedFunctions: [],
+      docItems: [],
+      filter: "",
+      functionDoc: null,
+      functionLoading: false,
+      allFunctionsLoading: false,
+      selectedItem: void 0
+    };
+  }
+  async componentDidMount() {
+    this.fetchAllFunctions();
+  }
+  render() {
+    const {
+      filter,
+      functionDoc,
+      docItems,
+      groupedFunctions,
+      selectedItem,
+      functionLoading,
+      allFunctionsLoading
+    } = this.state;
+    return /* @__PURE__ */ jsx("div", { ref: this.ref, className: b$5("doc"), children: allFunctionsLoading ? /* @__PURE__ */ jsx("div", { className: b$5("doc-loader"), children: /* @__PURE__ */ jsx(Loader, { size: "m" }) }) : /* @__PURE__ */ jsxs(
+      SplitPane,
+      {
+        resizerClassName: SPLIT_PANE_RESIZER_CLASSNAME,
+        split: "vertical",
+        defaultSize: LEFT_PANE_MIN_WIDTH,
+        minSize: LEFT_PANE_MIN_WIDTH,
+        maxSize: LEFT_PANE_MAX_WIDTH,
+        pane2Style: {
+          overflowY: "auto",
+          backgroundColor: "var(--g-color-base-generic-ultralight)"
+        },
+        children: [
+          /* @__PURE__ */ jsx("div", { className: b$5("doc-list"), children: /* @__PURE__ */ jsx(
+            List,
+            {
+              items: docItems,
+              itemHeight: ITEM_HEIGHT,
+              filter,
+              filterPlaceholder: i18n$3("label_doc-list-placeholder"),
+              renderItem: this.renderList,
+              onItemClick: this.onDocItemClick,
+              onFilterUpdate: (newFilter) => {
+                this.setState({
+                  filter: newFilter,
+                  docItems: this.getDocItems(
+                    newFilter,
+                    groupedFunctions,
+                    "filter"
+                  )
+                });
+              }
+            }
+          ) }),
+          /* @__PURE__ */ jsx("div", { className: b$5("doc-item-wrap"), children: functionLoading ? /* @__PURE__ */ jsx("div", { className: b$5("doc-loader"), children: /* @__PURE__ */ jsx(Loader, { size: "m" }) }) : /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: b$5("doc-item-title"),
+                "data-qa": DocSectionQa.Title,
+                children: selectedItem?.name
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              YfmWrapper,
+              {
+                className: b$5("doc-item"),
+                setByInnerHtml: true,
+                content: functionDoc?.html || "",
+                noMagicLinks: true
+              }
+            )
+          ] }) })
+        ]
+      }
+    ) });
+  }
+  renderList(item) {
+    const isGroup = Boolean(item.items);
+    const mods = {
+      group: isGroup,
+      function: !isGroup,
+      selected: Boolean(item.selected)
+    };
+    const qa = isGroup ? DocSectionQa.Group : DocSectionQa.Item;
+    return /* @__PURE__ */ jsx("div", { id: item.id, className: b$5("doc-list-item", mods), "data-qa": qa, children: item.name });
+  }
+  getGroupedFunctions(functions) {
+    return functions.map((group) => {
+      const extendedItems = group.items.filter(this.checkFunctionHref).map((item) => {
+        return {
+          ...item,
+          selected: false
+        };
+      });
+      const extendedGroup = {
+        ...group,
+        items: extendedItems,
+        opened: false
+      };
+      return extendedGroup;
+    });
+  }
+  getDocItems(filter, groupedFunctions, updeteEvent) {
+    return groupedFunctions.reduce((acc, group) => {
+      if (filter) {
+        const filterInLowerCase = filter.toLowerCase();
+        const filteredItems = group.items.filter(({ name }) => {
+          return name.toLowerCase().indexOf(filterInLowerCase) !== -1;
+        });
+        if (filteredItems.length && updeteEvent === "click" && !group.opened) {
+          acc.push(group);
+        } else if (filteredItems.length) {
+          group.opened = true;
+          acc.push(group, ...filteredItems);
+        }
+        return acc;
+      }
+      if (updeteEvent === "filter") {
+        group.opened = false;
+      }
+      acc.push(group);
+      if (group.opened) {
+        group.items.forEach((item) => {
+          acc.push(item);
+        });
+      }
+      return acc;
+    }, []);
+  }
+  checkFunctionHref({ href }) {
+    return !/-functions$/.test(href);
+  }
+}
+const b$4 = block("dl-field-editor");
+const getCalculatedWidht = (width) => {
+  return `calc(100% - ${width}px)`;
+};
+class FormulaSection extends React__default.Component {
+  constructor() {
+    super(...arguments);
+    this.editor = null;
+    this.monaco = null;
+    this.decorations = [];
+    this.editorWillMount = (monaco) => {
+      this.monaco = monaco;
+      this.props.setMonaco(monaco);
+      const { fields, supportedFunctions } = this.props;
+      if (this.monaco) {
+        setDatalensFormulaLanguageConfiguration(
+          this.monaco,
+          supportedFunctions,
+          fields.map(({ title }) => title)
+        );
+      }
+    };
+    this.editorDidMount = (editor) => {
+      this.editor = editor;
+      this.props.setEditorInstance(editor);
+      if (this.editor) {
+        this.editor.focus();
+      }
+    };
+    this.escapePressHandler = (e) => {
+      const isEscapePressed = e.key === "Escape";
+      const isEditorFocused = this.editor?.hasTextFocus();
+      if (isEscapePressed && isEditorFocused) {
+        e.stopPropagation();
+      }
+    };
+    this.pasteTextOverSelection = (selection, text) => {
+      if (!this.editor || !this.monaco) {
+        return;
+      }
+      const { startLineNumber, startColumn, endLineNumber, endColumn } = selection;
+      const hasOpeningSquareBracket = this.editor.getModel()?.getValueInRange({
+        startLineNumber,
+        startColumn: startColumn - 1,
+        endLineNumber,
+        endColumn: startColumn
+      }) === "[";
+      this.editor?.executeEdits("source", [
+        {
+          range: new this.monaco.Range(
+            startLineNumber,
+            startColumn,
+            endLineNumber,
+            endColumn
+          ),
+          text: hasOpeningSquareBracket ? text : `[${text}]`,
+          forceMoveMarkers: true
+        }
+      ]);
+    };
+    this.onDatasetItemClick = async ({ title }) => {
+      if (!this.editor) {
+        return;
+      }
+      this.editor.focus();
+      const selections = this.editor.getSelections() || [];
+      selections.forEach((selection) => this.pasteTextOverSelection(selection, title));
+    };
+  }
+  componentDidMount() {
+    document.addEventListener("keydown", this.escapePressHandler);
+  }
+  componentDidUpdate(prevProps) {
+    const { fields, fieldErrors, supportedFunctions } = this.props;
+    if (this.monaco && prevProps.fields !== fields) {
+      setDatalensFormulaLanguageConfiguration(
+        this.monaco,
+        supportedFunctions,
+        fields.map(({ title }) => title)
+      );
+    }
+    if (prevProps.fieldErrors !== fieldErrors) {
+      this.handleErrorState();
+    }
+  }
+  componentWillUnmount() {
+    this.props.setEditorInstance(null);
+    document.removeEventListener("keydown", this.escapePressHandler);
+  }
+  render() {
+    const {
+      fields,
+      field: { formula },
+      modifyField,
+      onSplitPaneChange,
+      children
+    } = this.props;
+    return /* @__PURE__ */ jsxs(
+      SplitPane,
+      {
+        resizerClassName: SPLIT_PANE_RESIZER_CLASSNAME,
+        split: "vertical",
+        primary: "second",
+        defaultSize: getCalculatedWidht(LEFT_PANE_MIN_WIDTH + RESIZER_WIDTH),
+        style: { overflow: "initial" },
+        pane1Style: {
+          minWidth: LEFT_PANE_MIN_WIDTH,
+          maxWidth: LEFT_PANE_MAX_WIDTH
+        },
+        pane2Style: {
+          minWidth: getCalculatedWidht(LEFT_PANE_MAX_WIDTH),
+          maxWidth: getCalculatedWidht(LEFT_PANE_MIN_WIDTH + RESIZER_WIDTH)
+        },
+        onChange: onSplitPaneChange,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: b$4("formula-fields"), children: /* @__PURE__ */ jsx(
+            DatasetFieldList,
+            {
+              fields,
+              itemHeight: 32,
+              onFiledItemClick: this.onDatasetItemClick
+            }
+          ) }),
+          /* @__PURE__ */ jsxs("div", { className: b$4("formula-editor-wrap"), children: [
+            /* @__PURE__ */ jsx(
+              Monaco,
+              {
+                editorWillMount: this.editorWillMount,
+                editorDidMount: this.editorDidMount,
+                className: b$4("formula-editor"),
+                language: FORMULA_LANGUAGE_ID,
+                value: formula,
+                options: {
+                  glyphMargin: true,
+                  hideCursorInOverviewRuler: true
+                },
+                onChange: (newFormula) => modifyField({ formula: newFormula }),
+                useDatalensTheme: true
+              }
+            ),
+            children
+          ] })
+        ]
+      }
+    );
+  }
+  getError() {
+    const { fieldErrors } = this.props;
+    if (!fieldErrors.length) {
+      return { column: 1, row: 1, message: "" };
+    }
+    const { column, row, message } = fieldErrors[0].errors[0];
+    return {
+      message: message || "",
+      // Backend counts rows and columns starting from 0, monaco use 1 as start index
+      column: column ? column + 1 : 1,
+      row: row ? row + 1 : 1
+    };
+  }
+  hideGlyph() {
+    const model = this.editor?.getModel();
+    if (!model) {
+      return;
+    }
+    model.deltaDecorations([this.decorations[0]], []);
+  }
+  showGlyph() {
+    const model = this.editor?.getModel();
+    const { row, message } = this.getError();
+    if (!model) {
+      return;
+    }
+    this.hideGlyph();
+    this.decorations = model.deltaDecorations(
+      [],
+      [
+        {
+          range: {
+            startLineNumber: row,
+            startColumn: 1,
+            endLineNumber: row,
+            endColumn: 1
+          },
+          options: {
+            glyphMarginClassName: b$4("formula-editor-glyph"),
+            glyphMarginHoverMessage: { value: message }
+          }
+        }
+      ]
+    );
+  }
+  setErrorMarker(marker) {
+    const model = this.editor?.getModel();
+    if (!model) {
+      return;
+    }
+    const markers = [];
+    if (marker) {
+      markers.push(marker);
+    }
+    if (this.monaco) {
+      this.monaco.editor.setModelMarkers(model, "owner", markers);
+    }
+  }
+  handleErrorState() {
+    const { fieldErrors } = this.props;
+    const { column, row, message } = this.getError();
+    const model = this.editor?.getModel();
+    if (!model) {
+      return;
+    }
+    if (!fieldErrors.length) {
+      this.hideGlyph();
+      this.setErrorMarker();
+      return;
+    }
+    this.showGlyph();
+    if (this.monaco) {
+      this.setErrorMarker({
+        message,
+        startLineNumber: row,
+        startColumn: column,
+        endLineNumber: row,
+        endColumn: column,
+        severity: this.monaco.MarkerSeverity.Error
+      });
+    }
+  }
+}
+const b$3 = block("dl-field-editor");
+const NameHeader = ({ title, onStartEdit }) => {
+  return /* @__PURE__ */ jsxs(Flex, { alignItems: "center", className: b$3("settings-name"), onDoubleClick: onStartEdit, children: [
+    /* @__PURE__ */ jsx(Text, { variant: "subheader-3", ellipsis: true, children: title }),
+    /* @__PURE__ */ jsx(Button, { view: "flat", onClick: onStartEdit, className: b$3("settings-field-name-icon"), children: /* @__PURE__ */ jsx(Icon, { data: Pencil, size: 16 }) })
+  ] });
+};
+const b$2 = block("dl-field-editor");
+const i18n$2 = I18n.keyset("component.dl-field-editor.view");
+const MIN_NAME_INPUT_WIDTH = 300;
+const NAME_INPUT_OFFSET = 44;
+const Settings = ({
+  field: { calc_mode: calcMode, title, hidden },
+  errors,
+  onlyFormulaEditor,
+  modifyField,
+  toggleDocumentationPanel,
+  toggleAdditionalPanel,
+  isNewField
+}) => {
+  const inputRef = React__default.useRef(null);
+  const fakeInputTitleRef = React__default.useRef(null);
+  const [inputTitleWidth, setInputTitleWidth] = React__default.useState(MIN_NAME_INPUT_WIDTH);
+  const { AdditionalButtonsWrapper } = registry.fieldEditor.components.getAll();
+  const updateTitleInputWidth = React__default.useCallback((inputTitle2 = "") => {
+    if (fakeInputTitleRef.current) {
+      fakeInputTitleRef.current.textContent = inputTitle2;
+      setInputTitleWidth(
+        Math.max(
+          fakeInputTitleRef.current.offsetWidth + NAME_INPUT_OFFSET,
+          MIN_NAME_INPUT_WIDTH
+        )
+      );
+    }
+  }, []);
+  React__default.useEffect(() => {
+    setTimeout(() => {
+      updateTitleInputWidth(title);
+    });
+  }, []);
+  const onChangeTitle = (inputTitle2) => {
+    updateTitleInputWidth(inputTitle2);
+    const errorMessageKey2 = getErrorMessageKey([DUPLICATE_TITLE, EMPTY_TITLE], errors);
+    let errorUpdates;
+    if (errorMessageKey2) {
+      errorUpdates = {
+        [EMPTY_TITLE]: false,
+        [DUPLICATE_TITLE]: false
+      };
+    }
+    modifyField({ title: inputTitle2 }, errorUpdates);
+  };
+  const onCalcModeChange = (e) => {
+    modifyField({ calc_mode: e.target.value });
+  };
+  const inputTitle = title;
+  const errorMessageKey = getErrorMessageKey([DUPLICATE_TITLE, EMPTY_TITLE], errors);
+  const showDocButton = isEnabledFeature(Feature.FieldEditorDocSection) && calcMode === "formula";
+  const [titleEditMode, setTitleEditMode] = React__default.useState(!title || Boolean(errorMessageKey));
+  const handleStartEditTitle = React__default.useCallback(() => {
+    setTitleEditMode(true);
+    setTimeout(() => {
+      inputRef.current?.focus();
+    });
+  }, []);
+  const handleStopEditTitle = React__default.useCallback(() => {
+    if (inputTitle && !errorMessageKey) {
+      setTitleEditMode(false);
+    }
+  }, [inputTitle, errorMessageKey]);
+  React__default.useEffect(() => {
+    if (errorMessageKey) {
+      setTitleEditMode(true);
+    }
+  }, [errorMessageKey]);
+  return /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      Dialog.Header,
+      {
+        caption: titleEditMode ? /* @__PURE__ */ jsx(
+          TextInput,
+          {
+            className: b$2("settings-field-name"),
+            controlProps: {
+              className: b$2("settings-field-name-input")
+            },
+            style: {
+              width: inputTitleWidth
+            },
+            controlRef: inputRef,
+            qa: "field-name",
+            placeholder: isNewField ? i18n$2("label_field-name-placeholder-new") : i18n$2("label_field-name-placeholder"),
+            value: inputTitle,
+            error: errorMessageKey && i18n$2(errorMessageKey),
+            onUpdate: onChangeTitle,
+            size: "l",
+            errorPlacement: "inside",
+            onKeyDown: (event) => {
+              if (event.key === "Enter") {
+                handleStopEditTitle();
+              }
+            },
+            onBlur: handleStopEditTitle,
+            hasClear: true
+          }
+        ) : /* @__PURE__ */ jsx(NameHeader, { title: inputTitle, onStartEdit: handleStartEditTitle })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "span",
+      {
+        ref: fakeInputTitleRef,
+        className: b$2("settings-field-name-input", { fake: true })
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: b$2("settings"), children: [
+      !onlyFormulaEditor && /* @__PURE__ */ jsxs(SegmentedRadioGroup, { value: calcMode, onChange: onCalcModeChange, children: [
+        /* @__PURE__ */ jsx(SegmentedRadioGroup.Option, { content: i18n$2("value_formula"), value: "formula" }),
+        /* @__PURE__ */ jsx(
+          SegmentedRadioGroup.Option,
+          {
+            content: i18n$2("value_source-from-field"),
+            value: "direct"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: b$2("settings-buttons-container"), children: [
+        showDocButton && /* @__PURE__ */ jsx(AdditionalButtonsWrapper, { toggleAdditionalPanel }),
+        !onlyFormulaEditor && /* @__PURE__ */ jsx(
+          ActionTooltip,
+          {
+            title: hidden ? i18n$2("label_hide-in-wizard") : i18n$2("label_show-in-wizard"),
+            children: /* @__PURE__ */ jsx(
+              Button,
+              {
+                onClick: () => modifyField({ hidden: !hidden }),
+                className: b$2("hide-in-wizard-button", {
+                  last: !showDocButton
+                }),
+                children: /* @__PURE__ */ jsx(Icon, { data: hidden ? EyeSlash : Eye })
+              }
+            )
+          }
+        ),
+        showDocButton && /* @__PURE__ */ jsx(Button, { onClick: toggleDocumentationPanel, children: i18n$2("button_documentation") })
+      ] })
+    ] })
+  ] });
+};
+const b$1 = block("dl-field-editor");
+const i18n$1 = I18n.keyset("component.dl-field-editor.view");
+const getSourceAvatarItems = (sourceAvatars) => {
+  return sourceAvatars.filter(Utils.filterVirtual).map(({ id, title }) => ({
+    value: id,
+    content: title
+  }));
+};
+const getSourceItems = (avatarId, sources, sourceAvatars) => {
+  if (!avatarId) {
+    return [];
+  }
+  const { source_id: sourceId } = sourceAvatars.find(({ id }) => id === avatarId) || {};
+  return sources.filter(({ id }) => id === sourceId).reduce(
+    (r, { raw_schema: rawSchema }) => r.concat(rawSchema || []),
+    []
+  ).map(({ name, title }) => ({
+    value: name,
+    content: title || name
+  }));
+};
+const getCastItems = (dataTypes) => {
+  return dataTypes.map(({ name }) => {
+    const text = i18n$1(`value_${name}`);
+    return {
+      value: name,
+      content: /* @__PURE__ */ jsxs("div", { className: b$1("cast-option"), children: [
+        /* @__PURE__ */ jsx(
+          DataTypeIcon,
+          {
+            className: b$1("field-type-select-icon"),
+            dataType: name
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: b$1("cast-option-text"), children: text })
+      ] })
+    };
+  });
+};
+const getAggregationItems = (cast, dataTypes) => {
+  const { aggregations = [] } = dataTypes.find(({ name }) => name === cast) || {};
+  return aggregations.map((aggregation) => ({
+    value: aggregation,
+    content: i18n$1(`value_${aggregation}`)
+  }));
+};
+const SourceSection = (props) => {
+  const {
+    field: { cast, guid, new_id: newId, source, aggregation, avatar_id: avatarId },
+    errors,
+    dataTypes,
+    sources,
+    sourceAvatars,
+    modifyField
+  } = props;
+  const sourceAvatarItems = getSourceAvatarItems(sourceAvatars);
+  const sourceItems = getSourceItems(avatarId, sources, sourceAvatars);
+  const castItems = getCastItems(dataTypes);
+  const aggregationItems = getAggregationItems(cast, dataTypes);
+  const sourceErrorMessageKey = getErrorMessageKey(EMPTY_SOURCE, errors);
+  const idErrorMessageKey = getErrorMessageKey(INVALID_ID, errors);
+  const handleCastChange = ([newCast]) => {
+    const updates = {
+      cast: newCast
+    };
+    const { aggregations = [] } = dataTypes.find(({ name }) => name === newCast) || {};
+    const hasAggregation = aggregations.includes(aggregation);
+    if (!hasAggregation) {
+      updates.aggregation = DatasetFieldAggregation.None;
+    }
+    modifyField(updates);
+  };
+  const renderCastOption = (option) => option.content;
+  const handleSourceChange = ([newSource]) => {
+    const hasSourceError = Boolean(getErrorMessageKey(EMPTY_SOURCE, errors));
+    let errorUpdates;
+    if (hasSourceError) {
+      errorUpdates = {
+        [EMPTY_SOURCE]: false
+      };
+    }
+    modifyField({ source: newSource }, errorUpdates);
+  };
+  const handleIdChange = (nextId) => {
+    const hasIdError = Boolean(getErrorMessageKey(INVALID_ID, errors));
+    let errorUpdates;
+    if (hasIdError) {
+      errorUpdates = {
+        [INVALID_ID]: false
+      };
+    }
+    modifyField({ new_id: nextId }, errorUpdates);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: b$1("source-section"), children: [
+    /* @__PURE__ */ jsxs("div", { className: b$1("row"), children: [
+      /* @__PURE__ */ jsxs("div", { className: b$1("label"), children: [
+        i18n$1("label_field-id"),
+        /* @__PURE__ */ jsx(HelpMark, { className: b$1("source-section-hint"), children: i18n$1("label_field-id-hint") })
+      ] }),
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          className: b$1("source-section-control"),
+          value: typeof newId === "string" ? newId : guid,
+          error: idErrorMessageKey && i18n$1(idErrorMessageKey),
+          onUpdate: handleIdChange
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: b$1("row"), children: [
+      /* @__PURE__ */ jsx("div", { className: b$1("label"), children: /* @__PURE__ */ jsx("span", { children: i18n$1("label_source") }) }),
+      /* @__PURE__ */ jsx(
+        Select,
+        {
+          filterable: true,
+          className: b$1("source-section-control"),
+          options: sourceAvatarItems,
+          value: avatarId ? [avatarId] : [],
+          onUpdate: ([newAvatarId]) => modifyField({ avatar_id: newAvatarId })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: b$1("row"), children: [
+      /* @__PURE__ */ jsx("div", { className: b$1("label"), children: /* @__PURE__ */ jsx("span", { children: i18n$1("label_field-source") }) }),
+      /* @__PURE__ */ jsx(
+        Select,
+        {
+          error: sourceErrorMessageKey && i18n$1(sourceErrorMessageKey),
+          className: b$1("source-section-control"),
+          filterable: true,
+          options: sourceItems,
+          value: source ? [source] : [],
+          disabled: !sourceItems.length,
+          onUpdate: handleSourceChange
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: b$1("row"), children: [
+      /* @__PURE__ */ jsx("div", { className: b$1("label"), children: /* @__PURE__ */ jsx("span", { children: i18n$1("label_field-type") }) }),
+      /* @__PURE__ */ jsx(
+        Select,
+        {
+          className: b$1("source-section-control", { short: true }),
+          options: castItems,
+          value: cast ? [cast] : [],
+          onUpdate: handleCastChange,
+          renderOption: renderCastOption,
+          renderSelectedOption: renderCastOption
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: b$1("row"), children: [
+      /* @__PURE__ */ jsx("div", { className: b$1("label"), children: /* @__PURE__ */ jsx("span", { children: i18n$1("label_aggregation") }) }),
+      /* @__PURE__ */ jsx(
+        Select,
+        {
+          className: b$1("source-section-control", { short: true }),
+          options: aggregationItems,
+          value: aggregation ? [aggregation] : [],
+          disabled: !aggregationItems.length,
+          onUpdate: ([newAggregation]) => {
+            modifyField({ aggregation: newAggregation });
+          }
+        }
+      )
+    ] })
+  ] });
+};
+const b = block("dl-field-editor");
+const i18n = I18n.keyset("component.dl-field-editor.view");
+const VALIDATE_TIMEOUT = 250;
+const _FieldEditor = class _FieldEditor extends React__default.Component {
+  constructor(props) {
+    super(props);
+    this.debounced = null;
+    this.isUnmounted = false;
+    this.monaco = null;
+    this.setMonaco = (monaco) => {
+      this.monaco = monaco;
+      if (monaco) {
+        registerDatalensFormulaLanguage(monaco);
+      }
+    };
+    this.setEditorInstance = (editor) => {
+      this.setState({ editor });
+    };
+    this.toggleDialogConfirm = () => {
+      this.setState({ dialogConfirmVisible: !this.state.dialogConfirmVisible });
+    };
+    this.toggleDocumentationPanel = async () => {
+      const nextDocPanelVisible = !this.props.docPanelVisible;
+      await this.props.updateUserSettings({
+        newSettings: {
+          dlFieldEditorDocShown: nextDocPanelVisible
+        }
+      });
+      this.state.editor?.layout();
+    };
+    this.toggleAdditionalPanel = () => {
+      this.setState(
+        {
+          additionalPanelVisible: !this.state.additionalPanelVisible
+        },
+        () => {
+          this.state.editor?.layout();
+        }
+      );
+    };
+    this.closeAdditionalPanel = () => {
+      this.setState(
+        {
+          additionalPanelVisible: false
+        },
+        () => {
+          this.state.editor?.layout();
+        }
+      );
+    };
+    this.validateFormula = async () => {
+      const { datasetId, workbookId, dataset } = this.props;
+      const { field: field2 } = this.state;
+      if (!dataset) {
+        return;
+      }
+      let fieldErrors = [];
+      try {
+        await getSdk().sdk.bi.validateDatasetFormula(
+          {
+            datasetId,
+            workbookId,
+            dataset,
+            field: field2
+          },
+          { concurrentId: "validateDatasetFormula" }
+        );
+      } catch (error) {
+        if (!getSdk().sdk.isCancel(error)) {
+          fieldErrors = error?.details?.data?.field_errors || [];
+          logger.logError("FieldEditor: validateDatasetFormula failed", error);
+        }
+      }
+      this.setState({ fieldErrors });
+    };
+    this.debouncedValidateFormula = () => {
+      if (this.debounced) {
+        this.debounced.cancel();
+      }
+      this.debounced = _.debounce(this.validateFormula, VALIDATE_TIMEOUT);
+      this.debounced();
+    };
+    this.modifyField = (updates, errorUpdates) => {
+      const { field: field2, errors } = this.state;
+      const updatedState = {
+        field: {
+          ...field2,
+          ...updates
+        },
+        errors: {
+          ...errors
+        }
+      };
+      if (updatedState.field.new_id && updatedState.field.new_id === updatedState.field.guid) {
+        delete updatedState.field.new_id;
+      }
+      if (errorUpdates) {
+        updatedState.errors = {
+          ...errors,
+          ...errorUpdates
+        };
+      }
+      this.setState(updatedState, this.debouncedValidateFormula);
+    };
+    this.onSplitPaneChange = () => {
+      if (this.state.editor) {
+        this.state.editor.layout();
+      }
+    };
+    this.onApply = () => {
+      const { fields, onlyFormulaEditor } = this.props;
+      const { field: field2 } = this.state;
+      const preparedField = prepareField(field2);
+      this.setState({
+        field: { ...preparedField }
+      });
+      const isFieldValid = validateField(preparedField, fields);
+      if (!isFieldValid) {
+        const errors = getErrors(preparedField, fields);
+        this.setState({ errors }, () => {
+          if (errors.invalidId && !onlyFormulaEditor) {
+            this.modifyField({ calc_mode: "direct" });
+          }
+        });
+        return;
+      }
+      if (this.isNewField) {
+        this.props.onCreate(preparedField);
+      } else {
+        this.props.onSave(preparedField);
+      }
+    };
+    this.attemptToCloseDialog = () => {
+      const { initialField, field: field2 } = this.state;
+      if (_.isEqual(initialField, field2)) {
+        this.props.onClose();
+        return;
+      }
+      this.toggleDialogConfirm();
+    };
+    this.onClose = (_2, reason) => {
+      if (reason === "outsideClick") {
+        this.attemptToCloseDialog();
+        return;
+      }
+      if (!this.state.dialogConfirmVisible) {
+        this.attemptToCloseDialog();
+      }
+    };
+    this.throttledSplitPaneChange = _.throttle(this.onSplitPaneChange, 50);
+    const field = this.props.field || createInitialField();
+    this.state = {
+      field,
+      initialField: field,
+      fieldErrors: [],
+      errors: createInitialErrors(),
+      editor: null,
+      dialogConfirmVisible: false,
+      saveAsNewField: Boolean(
+        this.props.field && this.props.field.formula && !this.props.field.title
+      ),
+      additionalPanelVisible: false
+    };
+  }
+  componentDidMount() {
+    this.debouncedValidateFormula();
+  }
+  componentWillUnmount() {
+    this.isUnmounted = true;
+  }
+  render() {
+    const { onlyFormulaEditor } = this.props;
+    const { field, errors, dialogConfirmVisible, saveAsNewField } = this.state;
+    return /* @__PURE__ */ jsxs(
+      Dialog,
+      {
+        modalClassName: b("dialog", {
+          "additional-panel-open": this.state.additionalPanelVisible
+        }),
+        open: true,
+        onClose: this.onClose,
+        onTransitionInComplete: () => {
+          window.dispatchEvent(new Event("resize"));
+        },
+        children: [
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: b({ "additional-panel-open": this.state.additionalPanelVisible }),
+              "data-qa": FieldEditorQa.Dialog,
+              children: [
+                /* @__PURE__ */ jsx(
+                  Settings,
+                  {
+                    field,
+                    errors,
+                    onlyFormulaEditor,
+                    modifyField: this.modifyField,
+                    toggleDocumentationPanel: this.toggleDocumentationPanel,
+                    toggleAdditionalPanel: this.toggleAdditionalPanel,
+                    additionalPanelVisible: this.state.additionalPanelVisible,
+                    isNewField: !this.props.field || saveAsNewField
+                  }
+                ),
+                this.renderContent()
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            DialogConfirm,
+            {
+              visible: dialogConfirmVisible,
+              message: i18n("label_confirm-message"),
+              onCancel: this.toggleDialogConfirm,
+              onApply: this.props.onClose,
+              isWarningConfirm: true,
+              confirmOnEnterPress: true
+            }
+          )
+        ]
+      }
+    );
+  }
+  renderContent() {
+    const {
+      fields,
+      sources,
+      sourceAvatars,
+      options: { supported_functions: supportedFunctions = [] } = {},
+      dataTypes = [],
+      docPanelVisible
+    } = this.props;
+    const { field, fieldErrors, errors, additionalPanelVisible } = this.state;
+    const { calc_mode: calcMode } = field;
+    const { AdditionalPanel } = registry.fieldEditor.components.getAll();
+    return /* @__PURE__ */ jsx("div", { className: b("content"), children: calcMode === "direct" ? /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        SourceSection,
+        {
+          field,
+          errors,
+          dataTypes,
+          sources,
+          sourceAvatars,
+          modifyField: this.modifyField
+        }
+      ),
+      this.renderFooter()
+    ] }) : /* @__PURE__ */ jsxs("div", { className: b("content-panels"), children: [
+      /* @__PURE__ */ jsxs(
+        SplitPane,
+        {
+          resizerClassName: SPLIT_PANE_RESIZER_CLASSNAME,
+          split: "horizontal",
+          defaultSize: "50%",
+          minSize: 0,
+          style: {
+            overflow: "initial"
+          },
+          pane1Style: {
+            ...!docPanelVisible && {
+              height: "100%",
+              maxHeight: "100%"
+            },
+            ...docPanelVisible && {
+              maxHeight: "80%"
+            }
+          },
+          pane2Style: {
+            zIndex: 2,
+            overflow: "hidden",
+            backgroundColor: "var(--g-color-base-float)"
+          },
+          allowResize: docPanelVisible,
+          onChange: this.throttledSplitPaneChange,
+          children: [
+            /* @__PURE__ */ jsx(
+              FormulaSection,
+              {
+                fields,
+                field,
+                fieldErrors,
+                supportedFunctions,
+                modifyField: this.modifyField,
+                setEditorInstance: this.setEditorInstance,
+                setMonaco: this.setMonaco,
+                onSplitPaneChange: _.throttle(this.onSplitPaneChange, 50),
+                children: this.renderFooter()
+              }
+            ),
+            isEnabledFeature(Feature.FieldEditorDocSection) ? /* @__PURE__ */ jsx(DocSection, { sdk }) : /* @__PURE__ */ jsx("div", {})
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        AdditionalPanel,
+        {
+          visible: additionalPanelVisible,
+          onClose: this.closeAdditionalPanel,
+          fields,
+          field,
+          fieldErrors
+        }
+      )
+    ] }) });
+  }
+  renderFooter() {
+    const { field } = this.props;
+    const { saveAsNewField } = this.state;
+    return /* @__PURE__ */ jsx(
+      Dialog.Footer,
+      {
+        onClickButtonCancel: this.attemptToCloseDialog,
+        onClickButtonApply: this.onApply,
+        propsButtonApply: {
+          qa: DialogFieldEditorQA.ApplyButton
+        },
+        propsButtonCancel: {
+          qa: DialogFieldEditorQA.CancelButton
+        },
+        textButtonApply: i18n(
+          `button_${field ? saveAsNewField ? "save-as" : "save" : "create"}`
+        ),
+        textButtonCancel: i18n("button_cancel")
+      }
+    );
+  }
+  get isNewField() {
+    return !this.props.field;
+  }
+};
+_FieldEditor.defaultProps = {
+  onlyFormulaEditor: false
+};
+let FieldEditor = _FieldEditor;
+const mapStateToProps = (state) => {
+  return {
+    docPanelVisible: selectFieldEditorDocShown(state)
+  };
+};
+const mapDispatchToProps = {
+  updateUserSettings
+};
+const FieldEditor_default = connect(mapStateToProps, mapDispatchToProps)(FieldEditor);
+const FieldEditor$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  default: FieldEditor_default
+}, Symbol.toStringTag, { value: "Module" }));
+export {
+  ChunkedFieldEditor as C,
+  mapUIKitThemeToMonacoTheme as a,
+  getFieldEditorDocPath as g,
+  mapUIKitThemeToDlMonacoTheme as m,
+  registerDatalensQLLanguage as r,
+  setDatalensQLLanguageConfiguration as s
+};