sea-chart 2.0.43 → 2.0.45

package/dist/utils/chart-utils/base-utils.js

@@ -1,28 +1,20 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-exports.findIfColumnDataIsArray = findIfColumnDataIsArray;
-var _shallowequal = _interopRequireDefault(require("shallowequal"));
-var _dayjs = _interopRequireDefault(require("dayjs"));
-var _slugid = _interopRequireDefault(require("slugid"));
-var _dtableUtils = require("dtable-utils");
-var _constants = require("../../constants");
-var _cellFormatUtils = require("../cell-format-utils");
-var _collaboratorUtils = require("../collaborator-utils");
-var _columnUtils = require("../column-utils");
-var _intl = _interopRequireDefault(require("../../intl"));
-var _context = _interopRequireDefault(require("../../context"));
-var _collaborator = require("../collaborator");
-var _index = require("../index");
 var _BaseUtils;
-function findIfColumnDataIsArray(column) {
+import shallowEqual from 'shallowequal';
+import dayjs from 'dayjs';
+import slugid from 'slugid';
+import { CellType, COLLABORATOR_COLUMN_TYPES, FORMULA_COLUMN_TYPES_MAP, FORMULA_RESULT_TYPE, getDateDisplayString, getNumberDisplayString, getOption, getMultipleOptionName, getPrecisionNumber, getTableById, getTableColumnByKey, isNumber, isEmpty, isNumericColumn, isDateColumn, sortText, sortNumber, sortDate, sortSingleSelect, sortFormula, getColumnOptions, DateUtils, getGeolocationDisplayString, getFormulaDisplayString, isArchiveView, getViewById, MULTIPLE_CELL_VALUE_COLUMN_TYPE_MAP } from 'dtable-utils';
+import { PIE_CHART_COLORS, CHART_SUMMARY_TYPE, CHART_SUPPORT_SORT_COLUMNS, CHART_TYPE, CHART_STYLE_SETTING_KEYS, DEFAULT_LABEL_FONT_SIZE, DEFAULT_NUMBER_FORMAT_OBJECT, X_AXIS_IS_GROUPBY_COLUMN_KEY_CHART_TYPES, STYLE_COLORS, CHART_DATA_SORT_TYPE, CHART_Y_GROUP_TYPE, HORIZONTAL_BAR_CHART_TYPES, COMPLTETELESS_CHART_TYPES, CHART_STYLE_CONFIG_SETTING_KEYS, MAP_CHART_TYPES, DEFAULT_ITEM_COLOR } from '../../constants';
+import { getClientFormulaDisplayString } from '../cell-format-utils';
+import { getKnownCollaboratorByEmail, generateDefaultUser } from '../collaborator-utils';
+import { getDateColumnFormat, getColumnByKey } from '../column-utils';
+import intl from '../../intl';
+import context from '../../context';
+import { isValidCollaboratorEmail } from '../collaborator';
+import { formatRowTotal, getFirstDayOfWeekForGroupby } from '../index';
+export function findIfColumnDataIsArray(column) {
   // link-formula may also be an array type column
-  let isGroupbyColumnDataAsAnArray = !!_dtableUtils.MULTIPLE_CELL_VALUE_COLUMN_TYPE_MAP[column.type];
-  if (column.type === _dtableUtils.CellType.LINK_FORMULA) {
+  let isGroupbyColumnDataAsAnArray = !!MULTIPLE_CELL_VALUE_COLUMN_TYPE_MAP[column.type];
+  if (column.type === CellType.LINK_FORMULA) {
     const {
       result_type
     } = column.data || {};
@@ -50,12 +42,12 @@ BaseUtils.updateSummaryValuePrecision = (result, summaryColumn, summaryValueKey)
   if (enable_precision) {
     result.forEach(item => {
       if (format === 'percent') {
-        item[summaryValueKey] = parseFloat((0, _dtableUtils.getPrecisionNumber)(item[summaryValueKey] * 100, {
+        item[summaryValueKey] = parseFloat(getPrecisionNumber(item[summaryValueKey] * 100, {
           enable_precision,
           precision
         })) / 100;
       } else {
-        item[summaryValueKey] = parseFloat((0, _dtableUtils.getPrecisionNumber)(item[summaryValueKey], {
+        item[summaryValueKey] = parseFloat(getPrecisionNumber(item[summaryValueKey], {
           enable_precision,
           precision
         }));
@@ -64,21 +56,21 @@ BaseUtils.updateSummaryValuePrecision = (result, summaryColumn, summaryValueKey)
   }
 };
 BaseUtils.isCollaborator = column => {
-  return column.type === _dtableUtils.CellType.COLLABORATOR;
+  return column.type === CellType.COLLABORATOR;
 };
 // valid chart
 BaseUtils.isValidCombinationChart = (config, table) => {
   const summaryLeftColumnKey = config.y_axis_left_summary_column;
   const summaryLeftType = config.y_axis_left_summary_type;
-  if (summaryLeftType === _constants.CHART_SUMMARY_TYPE.ADVANCED && !summaryLeftColumnKey) return false;
+  if (summaryLeftType === CHART_SUMMARY_TYPE.ADVANCED && !summaryLeftColumnKey) return false;
   if (summaryLeftColumnKey) {
-    if (!(0, _dtableUtils.getTableColumnByKey)(table, summaryLeftColumnKey)) return false;
+    if (!getTableColumnByKey(table, summaryLeftColumnKey)) return false;
   }
   const summaryRightColumnKey = config.y_axis_right_summary_column;
   const summaryRightType = config.y_axis_right_summary_type;
-  if (summaryRightType === _constants.CHART_SUMMARY_TYPE.ADVANCED && !summaryRightColumnKey) return false;
+  if (summaryRightType === CHART_SUMMARY_TYPE.ADVANCED && !summaryRightColumnKey) return false;
   if (summaryRightColumnKey) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, summaryRightColumnKey);
+    return getTableColumnByKey(table, summaryRightColumnKey);
   }
   return true;
 };
@@ -91,39 +83,39 @@ BaseUtils.isValidExistChart = (tables, chart) => {
     table_id,
     type
   } = config;
-  const table = (0, _dtableUtils.getTableById)(tables, table_id);
+  const table = getTableById(tables, table_id);
   if (!table) return false;
 
   // if table exists then it's a valid TABLE_ELEMENT chart
-  if (type === _constants.CHART_TYPE.TABLE_ELEMENT) {
+  if (type === CHART_TYPE.TABLE_ELEMENT) {
     return true;
   }
-  if (type === _constants.CHART_TYPE.SCATTER) {
+  if (type === CHART_TYPE.SCATTER) {
     const {
       column_groupby_column_key
     } = config;
     if (!column_groupby_column_key) return false;
   }
-  if (config.type === _constants.CHART_TYPE.BASIC_NUMBER_CARD) {
+  if (config.type === CHART_TYPE.BASIC_NUMBER_CARD) {
     const {
       summary_type
     } = config;
-    if (summary_type === _constants.CHART_Y_GROUP_TYPE.COUNT || !summary_type) return true;
+    if (summary_type === CHART_Y_GROUP_TYPE.COUNT || !summary_type) return true;
     const numericColumnKey = config.numeric_column_key;
     if (!numericColumnKey) return false;
-    return (0, _dtableUtils.getTableColumnByKey)(table, numericColumnKey);
+    return getTableColumnByKey(table, numericColumnKey);
   }
-  if (config.type === _constants.CHART_TYPE.DASHBOARD) {
+  if (config.type === CHART_TYPE.DASHBOARD) {
     const targetColumnKey = config.target_value_column_key;
     if (!targetColumnKey) return false;
     const totalColumnKey = config.total_value_column_key;
     if (!totalColumnKey) return false;
-    if (!(0, _dtableUtils.getTableColumnByKey)(table, targetColumnKey)) return false;
-    return (0, _dtableUtils.getTableColumnByKey)(table, totalColumnKey);
+    if (!getTableColumnByKey(table, targetColumnKey)) return false;
+    return getTableColumnByKey(table, totalColumnKey);
   }
 
   // completeness chart requires groupby_column_key, completed_column_key, and target_column_key
-  if (config.type === _constants.CHART_TYPE.COMPLETENESS || config.type === _constants.CHART_TYPE.COMPLETENESS_GROUP) {
+  if (config.type === CHART_TYPE.COMPLETENESS || config.type === CHART_TYPE.COMPLETENESS_GROUP) {
     const {
       groupby_column_key,
       completed_column_key,
@@ -132,52 +124,52 @@ BaseUtils.isValidExistChart = (tables, chart) => {
     if (!groupby_column_key) return false;
     if (!completed_column_key) return false;
     if (!target_column_key) return false;
-    if (!(0, _dtableUtils.getTableColumnByKey)(table, groupby_column_key)) return false;
-    if (!(0, _dtableUtils.getTableColumnByKey)(table, completed_column_key)) return false;
-    if (!(0, _dtableUtils.getTableColumnByKey)(table, target_column_key)) return false;
+    if (!getTableColumnByKey(table, groupby_column_key)) return false;
+    if (!getTableColumnByKey(table, completed_column_key)) return false;
+    if (!getTableColumnByKey(table, target_column_key)) return false;
     return true;
   }
 
   // if current chart is using "groupby_column_key" as key
   // if groupby_column_key is null, still return false
   let groupByColumnKey = config.groupby_column_key || config.x_axis_column_key || config.vertical_axis_column_key || config.columnKey || config.date_column_key;
-  if ([_constants.CHART_TYPE.BAR, _constants.CHART_TYPE.BAR_GROUP, _constants.CHART_TYPE.BAR_CUSTOM, _constants.CHART_TYPE.BAR_STACK, _constants.CHART_TYPE.COMPARE_BAR, _constants.CHART_TYPE.LINE, _constants.CHART_TYPE.LINE_GROUP, _constants.CHART_TYPE.AREA, _constants.CHART_TYPE.AREA_GROUP, _constants.CHART_TYPE.SCATTER, _constants.CHART_TYPE.COMBINATION].includes(config.type)) {
+  if ([CHART_TYPE.BAR, CHART_TYPE.BAR_GROUP, CHART_TYPE.BAR_CUSTOM, CHART_TYPE.BAR_STACK, CHART_TYPE.COMPARE_BAR, CHART_TYPE.LINE, CHART_TYPE.LINE_GROUP, CHART_TYPE.AREA, CHART_TYPE.AREA_GROUP, CHART_TYPE.SCATTER, CHART_TYPE.COMBINATION].includes(config.type)) {
     groupByColumnKey = config.x_axis_column_key;
   }
-  if ([_constants.CHART_TYPE.HORIZONTAL_BAR, _constants.CHART_TYPE.HORIZONTAL_GROUP_BAR, _constants.CHART_TYPE.STACKED_HORIZONTAL_BAR].includes(config.type)) {
+  if ([CHART_TYPE.HORIZONTAL_BAR, CHART_TYPE.HORIZONTAL_GROUP_BAR, CHART_TYPE.STACKED_HORIZONTAL_BAR].includes(config.type)) {
     groupByColumnKey = config.vertical_axis_column_key;
   }
-  if ([_constants.CHART_TYPE.MAP, _constants.CHART_TYPE.MAP_BUBBLE, _constants.CHART_TYPE.WORLD_MAP, _constants.CHART_TYPE.WORLD_MAP_BUBBLE].includes(config.type)) {
+  if ([CHART_TYPE.MAP, CHART_TYPE.MAP_BUBBLE, CHART_TYPE.WORLD_MAP, CHART_TYPE.WORLD_MAP_BUBBLE].includes(config.type)) {
     groupByColumnKey = config.geo_column_key;
   }
-  if ([_constants.CHART_TYPE.HEAT_MAP].includes(config.type)) {
+  if ([CHART_TYPE.HEAT_MAP].includes(config.type)) {
     groupByColumnKey = config.time_column_key;
   }
-  if ([_constants.CHART_TYPE.MIRROR].includes(config.type)) {
+  if ([CHART_TYPE.MIRROR].includes(config.type)) {
     groupByColumnKey = config.column_key;
   }
-  if ([_constants.CHART_TYPE.TREND].includes(config.type)) {
+  if ([CHART_TYPE.TREND].includes(config.type)) {
     groupByColumnKey = config.date_column_key;
   }
   if (!groupByColumnKey) return false;
-  if (!(0, _dtableUtils.getTableColumnByKey)(table, groupByColumnKey)) return false;
-  if (type === _constants.CHART_TYPE.FUNNEL) {
-    const column = (0, _columnUtils.getColumnByKey)(config.x_axis_column_key, table.columns);
-    if (!column || column.type !== _dtableUtils.CellType.SINGLE_SELECT) return false;
+  if (!getTableColumnByKey(table, groupByColumnKey)) return false;
+  if (type === CHART_TYPE.FUNNEL) {
+    const column = getColumnByKey(config.x_axis_column_key, table.columns);
+    if (!column || column.type !== CellType.SINGLE_SELECT) return false;
   }
-  if (type === _constants.CHART_TYPE.COMBINATION) {
+  if (type === CHART_TYPE.COMBINATION) {
     const isExist = _BaseUtils.isValidCombinationChart(config, table);
     if (!isExist) return false;
   } else {
     let summaryColumnKey = config.summary_column_key || config.y_axis_summary_column_key || config.horizontal_axis_column_key;
-    if ([_constants.CHART_TYPE.TABLE].includes(config.type) && config.column_groupby_multiple_numeric_column && (config === null || config === void 0 ? void 0 : config.summary_columns.length) > 0) {
+    if ([CHART_TYPE.TABLE].includes(config.type) && config.column_groupby_multiple_numeric_column && (config === null || config === void 0 ? void 0 : config.summary_columns.length) > 0) {
       // "key" and "column_key" are both exists currently, "column_key" is defined in public component, to avoid bugs, better not to change "column_key" to "key"
       summaryColumnKey = config.summary_columns[0].key || config.summary_columns[0].column_key;
     }
     const summaryType = _BaseUtils.getSummaryType(config);
-    if (summaryType === _constants.CHART_SUMMARY_TYPE.ADVANCED && !summaryColumnKey) return false;
+    if (summaryType === CHART_SUMMARY_TYPE.ADVANCED && !summaryColumnKey) return false;
     if (summaryColumnKey) {
-      return (0, _dtableUtils.getTableColumnByKey)(table, summaryColumnKey);
+      return getTableColumnByKey(table, summaryColumnKey);
     }
   }
   return true;
@@ -190,34 +182,34 @@ BaseUtils.getGroupColumn = (table, chart) => {
   const {
     type
   } = config;
-  if (_constants.COMPLTETELESS_CHART_TYPES.includes(type)) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, config.completed_column_key);
+  if (COMPLTETELESS_CHART_TYPES.includes(type)) {
+    return getTableColumnByKey(table, config.completed_column_key);
   }
-  if (_constants.HORIZONTAL_BAR_CHART_TYPES.includes(type)) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, config.vertical_axis_column_key);
+  if (HORIZONTAL_BAR_CHART_TYPES.includes(type)) {
+    return getTableColumnByKey(table, config.vertical_axis_column_key);
   }
-  if (_constants.X_AXIS_IS_GROUPBY_COLUMN_KEY_CHART_TYPES.includes(type)) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, config.groupby_column_key);
+  if (X_AXIS_IS_GROUPBY_COLUMN_KEY_CHART_TYPES.includes(type)) {
+    return getTableColumnByKey(table, config.groupby_column_key);
   }
-  if (type === _constants.CHART_TYPE.BASIC_NUMBER_CARD) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, config.numeric_column_key);
+  if (type === CHART_TYPE.BASIC_NUMBER_CARD) {
+    return getTableColumnByKey(table, config.numeric_column_key);
   }
-  if ([_constants.CHART_TYPE.WORLD_MAP, _constants.CHART_TYPE.WORLD_MAP_BUBBLE].includes(type)) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, config.geo_column_key);
+  if ([CHART_TYPE.WORLD_MAP, CHART_TYPE.WORLD_MAP_BUBBLE].includes(type)) {
+    return getTableColumnByKey(table, config.geo_column_key);
   }
-  if (type === _constants.CHART_TYPE.MIRROR) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, config.column_key);
+  if (type === CHART_TYPE.MIRROR) {
+    return getTableColumnByKey(table, config.column_key);
   }
-  if (type === _constants.CHART_TYPE.TREND) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, config.date_column_key);
+  if (type === CHART_TYPE.TREND) {
+    return getTableColumnByKey(table, config.date_column_key);
   }
-  if (type === _constants.CHART_TYPE.HEAT_MAP) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, config.time_column_key);
+  if (type === CHART_TYPE.HEAT_MAP) {
+    return getTableColumnByKey(table, config.time_column_key);
   }
-  if (_constants.MAP_CHART_TYPES.includes(type)) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, config.geo_column_key);
+  if (MAP_CHART_TYPES.includes(type)) {
+    return getTableColumnByKey(table, config.geo_column_key);
   }
-  return (0, _dtableUtils.getTableColumnByKey)(table, config.x_axis_column_key);
+  return getTableColumnByKey(table, config.x_axis_column_key);
 };
 BaseUtils.getColumnGroupColumn = (table, chart) => {
   const {
@@ -226,19 +218,19 @@ BaseUtils.getColumnGroupColumn = (table, chart) => {
   const {
     type
   } = config;
-  if (_constants.X_AXIS_IS_GROUPBY_COLUMN_KEY_CHART_TYPES.includes(type)) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, config.column_groupby_column_key);
+  if (X_AXIS_IS_GROUPBY_COLUMN_KEY_CHART_TYPES.includes(type)) {
+    return getTableColumnByKey(table, config.column_groupby_column_key);
   }
-  if ([_constants.CHART_TYPE.BAR_GROUP, _constants.CHART_TYPE.BAR_STACK, _constants.CHART_TYPE.LINE_GROUP, _constants.CHART_TYPE.HORIZONTAL_GROUP_BAR, _constants.CHART_TYPE.STACKED_HORIZONTAL_BAR, _constants.CHART_TYPE.AREA_GROUP, _constants.CHART_TYPE.COMPLETENESS, _constants.CHART_TYPE.COMPLETENESS_GROUP].includes(type)) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, config.column_groupby_column_key);
+  if ([CHART_TYPE.BAR_GROUP, CHART_TYPE.BAR_STACK, CHART_TYPE.LINE_GROUP, CHART_TYPE.HORIZONTAL_GROUP_BAR, CHART_TYPE.STACKED_HORIZONTAL_BAR, CHART_TYPE.AREA_GROUP, CHART_TYPE.COMPLETENESS, CHART_TYPE.COMPLETENESS_GROUP].includes(type)) {
+    return getTableColumnByKey(table, config.column_groupby_column_key);
   }
-  if ([_constants.CHART_TYPE.MIRROR].includes(type)) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, config.group_column_key);
+  if ([CHART_TYPE.MIRROR].includes(type)) {
+    return getTableColumnByKey(table, config.group_column_key);
   }
-  if (type === _constants.CHART_TYPE.SCATTER) {
-    return (0, _dtableUtils.getTableColumnByKey)(table, config.column_groupby_column_key);
+  if (type === CHART_TYPE.SCATTER) {
+    return getTableColumnByKey(table, config.column_groupby_column_key);
   }
-  return (0, _dtableUtils.getTableColumnByKey)(table, config.y_axis_summary_column_key);
+  return getTableColumnByKey(table, config.y_axis_summary_column_key);
 };
 BaseUtils.getSummaryColumn = (table, chart) => {
   const {
@@ -252,39 +244,39 @@ BaseUtils.getSummaryColumn = (table, chart) => {
     horizontal_axis_column_key
   } = config;
   switch (type) {
-    case _constants.CHART_TYPE.COMPLETENESS:
-    case _constants.CHART_TYPE.COMPLETENESS_GROUP:
+    case CHART_TYPE.COMPLETENESS:
+    case CHART_TYPE.COMPLETENESS_GROUP:
       {
-        return (0, _dtableUtils.getTableColumnByKey)(table, config.target_column_key);
+        return getTableColumnByKey(table, config.target_column_key);
       }
-    case _constants.CHART_TYPE.HORIZONTAL_BAR:
-    case _constants.CHART_TYPE.STACKED_HORIZONTAL_BAR:
-    case _constants.CHART_TYPE.HORIZONTAL_GROUP_BAR:
+    case CHART_TYPE.HORIZONTAL_BAR:
+    case CHART_TYPE.STACKED_HORIZONTAL_BAR:
+    case CHART_TYPE.HORIZONTAL_GROUP_BAR:
       {
-        return (0, _dtableUtils.getTableColumnByKey)(table, horizontal_axis_column_key);
+        return getTableColumnByKey(table, horizontal_axis_column_key);
       }
-    case _constants.CHART_TYPE.BAR:
-    case _constants.CHART_TYPE.BAR_GROUP:
-    case _constants.CHART_TYPE.LINE:
-    case _constants.CHART_TYPE.LINE_GROUP:
-    case _constants.CHART_TYPE.AREA:
-    case _constants.CHART_TYPE.AREA_GROUP:
-    case _constants.CHART_TYPE.BAR_STACK:
+    case CHART_TYPE.BAR:
+    case CHART_TYPE.BAR_GROUP:
+    case CHART_TYPE.LINE:
+    case CHART_TYPE.LINE_GROUP:
+    case CHART_TYPE.AREA:
+    case CHART_TYPE.AREA_GROUP:
+    case CHART_TYPE.BAR_STACK:
       {
-        return (0, _dtableUtils.getTableColumnByKey)(table, y_axis_summary_column_key);
+        return getTableColumnByKey(table, y_axis_summary_column_key);
       }
-    case _constants.CHART_TYPE.BASIC_NUMBER_CARD:
+    case CHART_TYPE.BASIC_NUMBER_CARD:
       {
-        return (0, _dtableUtils.getTableColumnByKey)(table, numeric_column_key);
+        return getTableColumnByKey(table, numeric_column_key);
       }
-    case _constants.CHART_TYPE.SCATTER:
+    case CHART_TYPE.SCATTER:
       {
-        return (0, _dtableUtils.getTableColumnByKey)(table, config.y_axis_column_key);
+        return getTableColumnByKey(table, config.y_axis_column_key);
       }
-    case _constants.CHART_TYPE.COMBINATION:
+    case CHART_TYPE.COMBINATION:
       {
-        const summaryColumnLeft = (0, _dtableUtils.getTableColumnByKey)(table, config.y_axis_left_summary_column);
-        const summaryColumnRight = (0, _dtableUtils.getTableColumnByKey)(table, config.y_axis_right_summary_column);
+        const summaryColumnLeft = getTableColumnByKey(table, config.y_axis_left_summary_column);
+        const summaryColumnRight = getTableColumnByKey(table, config.y_axis_right_summary_column);
         return {
           summaryColumnLeft,
           summaryColumnRight
@@ -292,7 +284,7 @@ BaseUtils.getSummaryColumn = (table, chart) => {
       }
     default:
       {
-        return (0, _dtableUtils.getTableColumnByKey)(table, summary_column_key);
+        return getTableColumnByKey(table, summary_column_key);
       }
   }
 };
@@ -318,7 +310,7 @@ BaseUtils.getSummaryColumnsWithMethod = (table, chart) => {
       summary_method
     } = summaryItem;
     return {
-      column: (0, _dtableUtils.getTableColumnByKey)(table, columnKey),
+      column: getTableColumnByKey(table, columnKey),
       summary_method
     };
   });
@@ -327,7 +319,7 @@ BaseUtils.getGroupName = (tables, chart) => {
   const {
     config
   } = chart;
-  const table = (0, _dtableUtils.getTableById)(tables, config.table_id);
+  const table = getTableById(tables, config.table_id);
   const column = _BaseUtils.getGroupColumn(table, chart);
   return column.name;
 };
@@ -374,24 +366,24 @@ BaseUtils.getSummaryValueDisplayString = function (summaryColumn, summaryValue)
     };
 
     // The date returned by db carries T and Z, so that there is a time difference in data formatting
-    return (0, _dtableUtils.getDateDisplayString)(summaryValue.replace(/[T|Z]/g, ' '), format);
+    return getDateDisplayString(summaryValue.replace(/[T|Z]/g, ' '), format);
   }
-  if (typeof summaryValue !== 'number') return (0, _index.formatRowTotal)(summaryValue);
-  return (0, _dtableUtils.getNumberDisplayString)(summaryValue, data || _constants.DEFAULT_NUMBER_FORMAT_OBJECT);
+  if (typeof summaryValue !== 'number') return formatRowTotal(summaryValue);
+  return getNumberDisplayString(summaryValue, data || DEFAULT_NUMBER_FORMAT_OBJECT);
 };
 BaseUtils.isNumericSummaryColumn = summaryColumn => {
   if (!summaryColumn) return false;
   const {
     type
   } = summaryColumn;
-  return type !== _dtableUtils.CellType.LINK && (0, _dtableUtils.isNumericColumn)(summaryColumn);
+  return type !== CellType.LINK && isNumericColumn(summaryColumn);
 };
 BaseUtils.isDateSummaryColumn = summaryColumn => {
   if (!summaryColumn) return false;
   const {
     type
   } = summaryColumn;
-  return type !== _dtableUtils.CellType.LINK && (0, _dtableUtils.isDateColumn)(summaryColumn);
+  return type !== CellType.LINK && isDateColumn(summaryColumn);
 };
 BaseUtils.getSummaryValue = (_ref, currentValue, nextValue, isPivotCalculator) => {
   let {
@@ -401,14 +393,14 @@ BaseUtils.getSummaryValue = (_ref, currentValue, nextValue, isPivotCalculator) =
   if (_BaseUtils.isDateSummaryColumn(summaryColumn)) {
     if (summaryMethod === 'MAX') {
       if (currentValue && nextValue) {
-        return (0, _dayjs.default)(currentValue).isBefore(nextValue) ? nextValue : currentValue;
+        return dayjs(currentValue).isBefore(nextValue) ? nextValue : currentValue;
       }
       if (!currentValue && nextValue) return nextValue;
       return currentValue;
     }
     if (summaryMethod === 'MIN') {
       if (currentValue && nextValue) {
-        return (0, _dayjs.default)(currentValue).isBefore(nextValue) ? currentValue : nextValue;
+        return dayjs(currentValue).isBefore(nextValue) ? currentValue : nextValue;
       }
       if (!currentValue && nextValue) return nextValue;
       return currentValue;
@@ -434,7 +426,7 @@ BaseUtils.getStatisticColumns = table => {
   let {
     columns
   } = table;
-  let unStatisticalColumns = [_dtableUtils.CellType.LONG_TEXT, _dtableUtils.CellType.IMAGE, _dtableUtils.CellType.FILE, _dtableUtils.CellType.CHECKBOX];
+  let unStatisticalColumns = [CellType.LONG_TEXT, CellType.IMAGE, CellType.FILE, CellType.CHECKBOX];
   return columns.filter(column => {
     return unStatisticalColumns.indexOf(column.type) === -1;
   });
@@ -442,7 +434,7 @@ BaseUtils.getStatisticColumns = table => {
 BaseUtils.isChartEqual = (preChartElement, curChartElement) => {
   const elementType = preChartElement.config.type;
   if (elementType !== curChartElement.config.type) return false;
-  return (0, _shallowequal.default)(preChartElement.config, curChartElement.config);
+  return shallowEqual(preChartElement.config, curChartElement.config);
 };
 BaseUtils.isChartStyleChange = (preChartElement, curChartElement) => {
   var _preChartElement$heig, _curChartElement$heig;
@@ -454,10 +446,10 @@ BaseUtils.isChartStyleChange = (preChartElement, curChartElement) => {
   if ((preChartElement === null || preChartElement === void 0 ? void 0 : preChartElement.width_in_unit) !== (curChartElement === null || curChartElement === void 0 ? void 0 : curChartElement.width_in_unit)) return true;
   const hasStyleConfig = preChartElement.style_config && curChartElement.style_config;
   if (hasStyleConfig) {
-    const chartStyleConfigChanged = _constants.CHART_STYLE_CONFIG_SETTING_KEYS.some(key => preChartElement.style_config[key] !== curChartElement.style_config[key]);
+    const chartStyleConfigChanged = CHART_STYLE_CONFIG_SETTING_KEYS.some(key => preChartElement.style_config[key] !== curChartElement.style_config[key]);
     return chartStyleConfigChanged;
   }
-  return !_constants.CHART_STYLE_SETTING_KEYS.every(key => preChartElement.config[key] === curChartElement.config[key]);
+  return !CHART_STYLE_SETTING_KEYS.every(key => preChartElement.config[key] === curChartElement.config[key]);
 };
 BaseUtils.isChartTypeChange = (preChartElement, curChartElement) => {
   const elementType = preChartElement.config.type;
@@ -475,9 +467,9 @@ BaseUtils.isArchiveView = (chart, tables) => {
     table_id,
     view_id
   } = chart;
-  const table = (0, _dtableUtils.getTableById)(tables, table_id);
-  const view = (0, _dtableUtils.getViewById)(table === null || table === void 0 ? void 0 : table.views, view_id);
-  return view && (0, _dtableUtils.isArchiveView)(view);
+  const table = getTableById(tables, table_id);
+  const view = getViewById(table === null || table === void 0 ? void 0 : table.views, view_id);
+  return view && isArchiveView(view);
 };
 BaseUtils.isChartSortChange = (preChartElement, curChartElement) => {
   return preChartElement.config.sort_type !== curChartElement.config.sort_type;
@@ -485,7 +477,7 @@ BaseUtils.isChartSortChange = (preChartElement, curChartElement) => {
 BaseUtils.isChartStyleChanged = (prevElement, currElement) => {
   const prevStyleConfig = prevElement && prevElement.style_config;
   const currStyleConfig = currElement && currElement.style_config;
-  if ((prevStyleConfig === null || prevStyleConfig === void 0 ? void 0 : prevStyleConfig.display_goal_line) !== (currStyleConfig === null || currStyleConfig === void 0 ? void 0 : currStyleConfig.display_goal_line) && (!(currStyleConfig !== null && currStyleConfig !== void 0 && currStyleConfig.goal_lable) || !(currStyleConfig !== null && currStyleConfig !== void 0 && currStyleConfig.goal_value))) {
+  if ((prevStyleConfig === null || prevStyleConfig === void 0 ? void 0 : prevStyleConfig.display_goal_line) !== (currStyleConfig === null || currStyleConfig === void 0 ? void 0 : currStyleConfig.display_goal_line) && (!(currStyleConfig === null || currStyleConfig === void 0 ? void 0 : currStyleConfig.goal_lable) || !(currStyleConfig === null || currStyleConfig === void 0 ? void 0 : currStyleConfig.goal_value))) {
     return false;
   }
   if (!prevStyleConfig && !currStyleConfig) {
@@ -502,24 +494,24 @@ BaseUtils.isChartStyleChanged = (prevElement, currElement) => {
     border: currBorder,
     title: currTitle
   } = currStyleConfig;
-  return !(0, _shallowequal.default)(prevBorder, currBorder) || !(0, _shallowequal.default)(prevTitle, currTitle);
+  return !shallowEqual(prevBorder, currBorder) || !shallowEqual(prevTitle, currTitle);
 };
 BaseUtils.shouldChartComponentUpdate = (prevProps, currentProps) => {
   return !_BaseUtils.isChartEqual(prevProps.chart, currentProps.chart) ||
   // chart attributes changed
-  !(0, _shallowequal.default)(prevProps.canvasStyle, currentProps.canvasStyle) ||
+  !shallowEqual(prevProps.canvasStyle, currentProps.canvasStyle) ||
   // canvasStyle
-  !(0, _shallowequal.default)(prevProps.groupbyColumn, currentProps.groupbyColumn) ||
+  !shallowEqual(prevProps.groupbyColumn, currentProps.groupbyColumn) ||
   // groupbyColumn's data、type changed or not exist
-  !(0, _shallowequal.default)(prevProps.columnGroupbyColumn, currentProps.columnGroupbyColumn) ||
+  !shallowEqual(prevProps.columnGroupbyColumn, currentProps.columnGroupbyColumn) ||
   // columnGroupbyColumn's data、type changed or not exist
-  !(0, _shallowequal.default)(prevProps.summaryColumn, currentProps.summaryColumn) ||
+  !shallowEqual(prevProps.summaryColumn, currentProps.summaryColumn) ||
   // summaryColumn's data、type changed or not exist
-  !(0, _shallowequal.default)(prevProps.globalTheme, currentProps.globalTheme) ||
+  !shallowEqual(prevProps.globalTheme, currentProps.globalTheme) ||
   // global theme changed
-  !(0, _shallowequal.default)(prevProps.chartColorTheme, currentProps.chartColorTheme) ||
+  !shallowEqual(prevProps.chartColorTheme, currentProps.chartColorTheme) ||
   // chart color theme changed
-  !(0, _shallowequal.default)(prevProps.resizeSignal, currentProps.resizeSignal) ||
+  !shallowEqual(prevProps.resizeSignal, currentProps.resizeSignal) ||
   // chart container resize changed
   _BaseUtils._isChartDataChange(prevProps, currentProps) || _BaseUtils.isChartStyleChanged(prevProps.chart, currentProps.chart);
 };
@@ -536,7 +528,7 @@ BaseUtils._isChartDataChange = (prevProps, currentProps) => {
   const {
     result: oldData
   } = currentProps;
-  if (chart.config.type === _constants.CHART_TYPE.COMBINATION) {
+  if (chart.config.type === CHART_TYPE.COMBINATION) {
     return _BaseUtils._isCombinationDataChange(newData, oldData);
   }
   if (!newData && !oldData) return false;
@@ -555,14 +547,14 @@ BaseUtils._isChartDataChange = (prevProps, currentProps) => {
     for (let j = 0; j < (newDataItemRows === null || newDataItemRows === void 0 ? void 0 : newDataItemRows.length) || 0; j++) {
       let newDataItemRow = newDataItemRows[j];
       let oldDataItemRow = oldDataItemRows[j];
-      if (!(0, _shallowequal.default)(newDataItemRow, oldDataItemRow)) return true;
+      if (!shallowEqual(newDataItemRow, oldDataItemRow)) return true;
     }
   }
   return false;
 };
 BaseUtils.getColumn = (tables, tableId, columnKey) => {
-  const table = (0, _dtableUtils.getTableById)(tables, tableId);
-  return (0, _dtableUtils.getTableColumnByKey)(table, columnKey);
+  const table = getTableById(tables, tableId);
+  return getTableColumnByKey(table, columnKey);
 };
 BaseUtils.formatEmptyName = (dataList, column_groupby_column_key, emptyName) => {
   if (!Array.isArray(dataList)) return [];
@@ -577,7 +569,7 @@ BaseUtils.formatEmptyName = (dataList, column_groupby_column_key, emptyName) =>
       item.group_name = emptyName;
     }
     if (!item.slugId) {
-      item.slugId = _slugid.default.nice();
+      item.slugId = slugid.nice();
     }
     if (!item.value) {
       item.value = 0;
@@ -603,10 +595,10 @@ BaseUtils.getPieColorSet = (tables, chart, result) => {
   const {
     type: columnType
   } = column || {};
-  const pieChartColorsLength = _constants.PIE_CHART_COLORS.length - 1;
+  const pieChartColorsLength = PIE_CHART_COLORS.length - 1;
   const backgroundColor = [];
   result.forEach((item, index) => {
-    if (columnType === _dtableUtils.CellType.SINGLE_SELECT || columnType === _dtableUtils.CellType.MULTIPLE_SELECT) {
+    if (columnType === CellType.SINGLE_SELECT || columnType === CellType.MULTIPLE_SELECT) {
       let {
         color
       } = item;
@@ -615,7 +607,7 @@ BaseUtils.getPieColorSet = (tables, chart, result) => {
       if (index > pieChartColorsLength) {
         index = index % pieChartColorsLength;
       }
-      backgroundColor.push(_constants.PIE_CHART_COLORS[index]);
+      backgroundColor.push(PIE_CHART_COLORS[index]);
     }
   });
   return backgroundColor;
@@ -633,7 +625,7 @@ BaseUtils.getPieColor = (column, index, data, currentTheme, useColumnColor) => {
       const selectedItem = columnData.options.find(item => {
         return item.name === data.name.trim();
       }) || {};
-      return selectedItem.color || '#dbdbdb';
+      return selectedItem.color || DEFAULT_ITEM_COLOR;
     }
   } else {
     const pieChartColorsLength = colors.length - 1;
@@ -654,8 +646,8 @@ BaseUtils.formatPieChartData = (data, chart, tables, currentTheme, useColumnColo
     groupby_column_key,
     minimum_slice_percent
   } = chart.config;
-  const table = (0, _dtableUtils.getTableById)(tables, table_id);
-  const column = (0, _columnUtils.getColumnByKey)(groupby_column_key, table ? table.columns : []);
+  const table = getTableById(tables, table_id);
+  const column = getColumnByKey(groupby_column_key, table ? table.columns : []);
   let sum = data.reduce((total, currentValue) => {
     return total += currentValue.value;
   }, 0);
@@ -686,11 +678,11 @@ BaseUtils.formatPieChartData = (data, chart, tables, currentTheme, useColumnColo
     filteredData.push({
       name: '_Others',
       value: filteredSum,
-      color: '#dbdbdb',
+      color: DEFAULT_ITEM_COLOR,
       percent: String(Number.parseFloat(filteredSum / sum * 100).toFixed(1)) + '%',
       rows
     });
-    colorMap['_Others'] = '#dbdbdb';
+    colorMap['_Others'] = DEFAULT_ITEM_COLOR;
   }
   return {
     data: filteredData,
@@ -708,9 +700,14 @@ BaseUtils.updateTableViewListItemNameAndColor = async (result, column, nameKey,
       data: columnData
     } = column;
     let name = result[nameKey];
-    if (columnType === _dtableUtils.CellType.SINGLE_SELECT || columnType === _dtableUtils.CellType.MULTIPLE_SELECT) {
-      const options = (0, _dtableUtils.getColumnOptions)(column);
-      let selectedOption = (0, _dtableUtils.getOption)(options, name);
+    if (isEmpty(name)) {
+      result[colorKey] = result[colorKey] || DEFAULT_ITEM_COLOR;
+      resolve(resultPromise);
+      return;
+    }
+    if (columnType === CellType.SINGLE_SELECT) {
+      const options = getColumnOptions(column);
+      let selectedOption = getOption(options, name);
       let {
         name: optionName,
         color: optionColor,
@@ -721,68 +718,80 @@ BaseUtils.updateTableViewListItemNameAndColor = async (result, column, nameKey,
         result[colorKey] = optionColor;
         isNameField && (result.original_name = id);
       } else {
-        result[colorKey] = '#dbdbdb';
+        result[colorKey] = DEFAULT_ITEM_COLOR;
       }
-    } else if (columnType === _dtableUtils.CellType.COLLABORATOR) {
-      const users = _context.default.getCollaboratorsFromCache();
+    } else if (columnType === CellType.MULTIPLE_SELECT) {
+      const options = getColumnOptions(column);
+      const optionIds = Array.isArray(name) ? name : [name];
+      const optionNames = getMultipleOptionName(options, optionIds);
+      if (optionNames) {
+        result[nameKey] = optionNames;
+        const firstOption = options.find(o => optionIds.includes(o.id));
+        result[colorKey] = (firstOption === null || firstOption === void 0 ? void 0 : firstOption.color) || DEFAULT_ITEM_COLOR;
+        isNameField && (result.original_name = optionIds);
+      } else {
+        result[colorKey] = DEFAULT_ITEM_COLOR;
+      }
+    } else if (columnType === CellType.COLLABORATOR) {
+      const users = context.getCollaboratorsFromCache();
       const user = users.find(user => user.email === name);
       if (user) {
         result[nameKey] = (user === null || user === void 0 ? void 0 : user.name) || name;
         isNameField && (result.original_name = name);
         resolve();
       } else {
-        _context.default.queryUsers([name], users => {
+        context.queryUsers([name], users => {
           const userEmail = name;
-          const user = users[userEmail] || (0, _collaboratorUtils.generateDefaultUser)(userEmail);
+          const user = users[userEmail] || generateDefaultUser(userEmail);
           const userName = user.name || userEmail;
           result[nameKey] = userName;
           isNameField && (result.original_name = userEmail);
           user.loaded = true;
-          _context.default.updateCollaboratorsCache(userEmail, user);
+          context.updateCollaboratorsCache(userEmail, user);
           resolve();
         });
       }
       return;
-    } else if (columnType === _dtableUtils.CellType.CREATOR || columnType === _dtableUtils.CellType.LAST_MODIFIER) {
-      const users = _context.default.getCollaboratorsFromCache();
+    } else if (columnType === CellType.CREATOR || columnType === CellType.LAST_MODIFIER) {
+      const users = context.getCollaboratorsFromCache();
       const user = users.find(user => user.email === name);
       if (user) {
         result[nameKey] = (user === null || user === void 0 ? void 0 : user.name) || name;
         isNameField && (result.original_name = name);
         resolve();
       } else {
-        _context.default.queryUsers([name], users => {
+        context.queryUsers([name], users => {
           const userEmail = name;
-          const user = users[userEmail] || (0, _collaboratorUtils.generateDefaultUser)(userEmail);
+          const user = users[userEmail] || generateDefaultUser(userEmail);
           const userName = user.name || userEmail;
           result[nameKey] = userName;
           isNameField && (result.original_name = userEmail);
           user.loaded = true;
-          _context.default.updateCollaboratorsCache(userEmail, user);
+          context.updateCollaboratorsCache(userEmail, user);
           resolve();
         });
       }
       return;
-    } else if (columnType === _dtableUtils.CellType.NUMBER) {
+    } else if (columnType === CellType.NUMBER) {
       let valueNumber = parseFloat(name);
-      result[nameKey] = (0, _dtableUtils.isNumber)(valueNumber) ? (0, _dtableUtils.getNumberDisplayString)(valueNumber, columnData) : name;
+      result[nameKey] = isNumber(valueNumber) ? getNumberDisplayString(valueNumber, columnData) : name;
       isNameField && (result.original_name = name);
-    } else if (columnType === _dtableUtils.CellType.DATE) {
+    } else if (columnType === CellType.DATE) {
       name = name + '';
       if (name && name.split('-').length === 3) {
-        let format = (0, _columnUtils.getDateColumnFormat)(column);
+        let format = getDateColumnFormat(column);
         let spaceIndex = format.indexOf(' ');
         if (spaceIndex > -1) {
           format = format.slice(0, spaceIndex);
         }
-        result[nameKey] = (0, _dayjs.default)(name).format(format);
+        result[nameKey] = dayjs(name).format(format);
       }
-    } else if (columnType === _dtableUtils.CellType.LINK_FORMULA) {
+    } else if (columnType === CellType.LINK_FORMULA) {
       // scatter only use number
       if (isScatterChart) {
         name.length && (name = name[0]);
         let valueNumber = parseFloat(name);
-        result[nameKey] = (0, _dtableUtils.isNumber)(valueNumber) ? (0, _dtableUtils.getNumberDisplayString)(valueNumber, columnData) : name;
+        result[nameKey] = isNumber(valueNumber) ? getNumberDisplayString(valueNumber, columnData) : name;
       }
       const {
         array_data,
@@ -795,18 +804,18 @@ BaseUtils.updateTableViewListItemNameAndColor = async (result, column, nameKey,
       };
       // for linked formula, need to call recursively, using it's result as the result of the promise
       resultPromise = _BaseUtils.updateTableViewListItemNameAndColor(result, linkedColumn, nameKey, colorKey, isScatterChart);
-    } else if (columnType === _dtableUtils.CellType.FORMULA) {
+    } else if (columnType === CellType.FORMULA) {
       const {
         result_type: resultType,
         array_type: arrayType,
         array_data: arrayData
       } = columnData || {};
-      if (resultType === _dtableUtils.FORMULA_RESULT_TYPE.NUMBER) {
+      if (resultType === FORMULA_RESULT_TYPE.NUMBER) {
         const valueNumber = parseFloat(name);
-        result[nameKey] = (0, _dtableUtils.isNumber)(valueNumber) ? (0, _dtableUtils.getNumberDisplayString)(valueNumber, columnData) : name;
+        result[nameKey] = isNumber(valueNumber) ? getNumberDisplayString(valueNumber, columnData) : name;
         isNameField && (result.original_name = name);
-      } else if (resultType === _dtableUtils.FORMULA_RESULT_TYPE.DATE || resultType === _dtableUtils.CellType.CTIME || resultType === _dtableUtils.CellType.MTIME) {
-        result[nameKey] = (0, _dtableUtils.getFormulaDisplayString)(name, columnData);
+      } else if (resultType === FORMULA_RESULT_TYPE.DATE || resultType === CellType.CTIME || resultType === CellType.MTIME) {
+        result[nameKey] = getFormulaDisplayString(name, columnData);
         isNameField && (result.original_name = name);
       } else if (arrayType && arrayData) {
         const formulaArrayColumn = {
@@ -817,19 +826,19 @@ BaseUtils.updateTableViewListItemNameAndColor = async (result, column, nameKey,
         resultPromise = _BaseUtils.updateTableViewListItemNameAndColor(result, formulaArrayColumn, nameKey, colorKey, isScatterChart, isNameField);
       } else if (Array.isArray(name)) {
         result[nameKey] = name.map(item => {
-          if ((0, _collaborator.isValidCollaboratorEmail)(item)) {
-            const collaborator = (0, _collaboratorUtils.getKnownCollaboratorByEmail)(item);
+          if (isValidCollaboratorEmail(item)) {
+            const collaborator = getKnownCollaboratorByEmail(item);
             return collaborator ? collaborator.name : item;
           }
           return item;
         }).join(', ');
         isNameField && (result.original_name = name.join(', '));
-      } else if (typeof name === 'string' && (0, _collaborator.isValidCollaboratorEmail)(name)) {
-        const collaborator = (0, _collaboratorUtils.getKnownCollaboratorByEmail)(name);
+      } else if (typeof name === 'string' && isValidCollaboratorEmail(name)) {
+        const collaborator = getKnownCollaboratorByEmail(name);
         result[nameKey] = collaborator ? collaborator.name : name;
         isNameField && (result.original_name = name);
       } else {
-        result[nameKey] = (0, _dtableUtils.getFormulaDisplayString)(name, columnData);
+        result[nameKey] = getFormulaDisplayString(name, columnData);
         isNameField && (result.original_name = name);
       }
     }
@@ -856,8 +865,8 @@ BaseUtils.sortCharts = (results, column, sortKey, isPivot) => {
   } = column;
   const sortType = 'up';
   const optionIdIndexMap = {};
-  const isPivotMultipleSelect = columnType === _dtableUtils.CellType.MULTIPLE_SELECT && isPivot;
-  if ([_dtableUtils.CellType.SINGLE_SELECT].includes(columnType) || isPivotMultipleSelect) {
+  const isPivotMultipleSelect = columnType === CellType.MULTIPLE_SELECT && isPivot;
+  if ([CellType.SINGLE_SELECT].includes(columnType) || isPivotMultipleSelect) {
     const {
       options
     } = data || {};
@@ -865,7 +874,7 @@ BaseUtils.sortCharts = (results, column, sortKey, isPivot) => {
       optionIdIndexMap[option.id] = index;
     });
   }
-  const isPivotLinkFormulaSingleAndMultipleSelect = columnType === _dtableUtils.CellType.LINK_FORMULA && [_dtableUtils.CellType.SINGLE_SELECT, _dtableUtils.CellType.MULTIPLE_SELECT].includes(column.data.array_type) && isPivot;
+  const isPivotLinkFormulaSingleAndMultipleSelect = columnType === CellType.LINK_FORMULA && [CellType.SINGLE_SELECT, CellType.MULTIPLE_SELECT].includes(column.data.array_type) && isPivot;
   if (isPivotLinkFormulaSingleAndMultipleSelect) {
     var _column$data;
     let {
@@ -889,14 +898,14 @@ BaseUtils.sortCharts = (results, column, sortKey, isPivot) => {
     if (!next && next !== 0) {
       return 1;
     }
-    if (_constants.CHART_SUPPORT_SORT_COLUMNS.includes(columnType)) {
+    if (CHART_SUPPORT_SORT_COLUMNS.includes(columnType)) {
       let realColumnType = columnType;
-      if ([_dtableUtils.CellType.LINK_FORMULA, _dtableUtils.CellType.LINK].includes(columnType)) {
+      if ([CellType.LINK_FORMULA, CellType.LINK].includes(columnType)) {
         realColumnType = column.data.array_type;
       }
       switch (realColumnType) {
-        case _dtableUtils.CellType.NUMBER:
-        case _dtableUtils.CellType.RATE:
+        case CellType.NUMBER:
+        case CellType.RATE:
           {
             if (current) {
               current = current - 0;
@@ -904,15 +913,15 @@ BaseUtils.sortCharts = (results, column, sortKey, isPivot) => {
             if (next) {
               next = next - 0;
             }
-            return (0, _dtableUtils.sortNumber)(current, next, sortType);
+            return sortNumber(current, next, sortType);
           }
-        case _dtableUtils.CellType.DATE:
-        case _dtableUtils.CellType.CTIME:
-        case _dtableUtils.CellType.MTIME:
+        case CellType.DATE:
+        case CellType.CTIME:
+        case CellType.MTIME:
           {
-            return (0, _dtableUtils.sortDate)(current, next, sortType);
+            return sortDate(current, next, sortType);
           }
-        case _dtableUtils.CellType.SINGLE_SELECT:
+        case CellType.SINGLE_SELECT:
           {
             // key was used to sort "pivot columns" in pivot chart
             const {
@@ -925,29 +934,29 @@ BaseUtils.sortCharts = (results, column, sortKey, isPivot) => {
             } = nextResult || {};
             const current = currentName || currentKey;
             const next = nextName || nextKey;
-            return (0, _dtableUtils.sortSingleSelect)(current, next, {
+            return sortSingleSelect(current, next, {
               sort_type: sortType,
               option_id_index_map: optionIdIndexMap
             });
           }
-        case _dtableUtils.CellType.MULTIPLE_SELECT:
+        case CellType.MULTIPLE_SELECT:
           {
-            return (0, _dtableUtils.sortSingleSelect)(current, next, {
+            return sortSingleSelect(current, next, {
               sort_type: sortType,
               option_id_index_map: optionIdIndexMap
             });
           }
-        case _dtableUtils.CellType.FORMULA:
-        case _dtableUtils.CellType.LINK_FORMULA:
+        case CellType.FORMULA:
+        case CellType.LINK_FORMULA:
           {
-            return (0, _dtableUtils.sortFormula)(current, next, sortType, {
+            return sortFormula(current, next, sortType, {
               columnData: data,
               value: {}
             });
           }
         default:
           {
-            return (0, _dtableUtils.sortText)(current, next, sortType);
+            return sortText(current, next, sortType);
           }
       }
     }
@@ -962,8 +971,8 @@ BaseUtils.sortChartData = (charts, sort_key) => {
     const {
       value: next
     } = nextResult;
-    if (!current && current !== 0) return -1;
-    if (!next && next !== 0) return 1;
+    if (isEmpty(current)) return -1;
+    if (isEmpty(next)) return 1;
     if (sort_key === 'ascending') {
       return current > next ? 1 : -1;
     }
@@ -987,7 +996,7 @@ BaseUtils.sortDataByKey = (data, key, sortType) => {
     if (!nextVal && nextVal !== 0) {
       return 1;
     }
-    if (sortType === _constants.CHART_DATA_SORT_TYPE.ASCENDING) {
+    if (sortType === CHART_DATA_SORT_TYPE.ASCENDING) {
       return currentVal > nextVal ? 1 : -1;
     } else {
       return currentVal > nextVal ? -1 : 1;
@@ -1013,7 +1022,7 @@ BaseUtils.formatGroupsLabel = (results, chart, tables) => {
     type,
     config
   } = chart;
-  if (_constants.X_AXIS_IS_GROUPBY_COLUMN_KEY_CHART_TYPES.includes(type)) {
+  if (X_AXIS_IS_GROUPBY_COLUMN_KEY_CHART_TYPES.includes(type)) {
     groupby_column_key = config.groupby_column_key;
   } else {
     groupby_column_key = config.x_axis_column_key;
@@ -1022,9 +1031,9 @@ BaseUtils.formatGroupsLabel = (results, chart, tables) => {
   const {
     table_id
   } = config;
-  const table = (0, _dtableUtils.getTableById)(tables, table_id);
-  const groupbyColumn = (0, _dtableUtils.getTableColumnByKey)(table, groupby_column_key);
-  const columnGroupbyColumn = (0, _dtableUtils.getTableColumnByKey)(table, column_groupby_column_key);
+  const table = getTableById(tables, table_id);
+  const groupbyColumn = getTableColumnByKey(table, groupby_column_key);
+  const columnGroupbyColumn = getTableColumnByKey(table, column_groupby_column_key);
   results.forEach(item => {
     const {
       name,
@@ -1043,84 +1052,95 @@ BaseUtils.convertResultName = (result, column, name, nameKey, colorKey) => {
     type: columnType,
     data: columnData
   } = column;
-  if (columnType === _dtableUtils.CellType.SINGLE_SELECT || columnType === _dtableUtils.CellType.MULTIPLE_SELECT) {
-    const options = (0, _dtableUtils.getColumnOptions)(column);
-    const selectedOption = (0, _dtableUtils.getOption)(options, name);
+  if (columnType === CellType.SINGLE_SELECT) {
+    const options = getColumnOptions(column);
+    const selectedOption = getOption(options, name);
     if (selectedOption) {
       result[nameKey] = selectedOption.name;
       result[colorKey] = selectedOption.color;
     } else {
-      result[colorKey] = '#dbdbdb';
+      result[colorKey] = DEFAULT_ITEM_COLOR;
+    }
+  } else if (columnType === CellType.MULTIPLE_SELECT) {
+    const options = getColumnOptions(column);
+    const optionIds = Array.isArray(name) ? name : [name];
+    const optionNames = getMultipleOptionName(options, optionIds);
+    if (optionNames) {
+      result[nameKey] = optionNames;
+      const firstOption = options.find(o => optionIds.includes(o.id));
+      result[colorKey] = (firstOption === null || firstOption === void 0 ? void 0 : firstOption.color) || DEFAULT_ITEM_COLOR;
+    } else {
+      result[colorKey] = DEFAULT_ITEM_COLOR;
     }
-  } else if (columnType === _dtableUtils.CellType.COLLABORATOR) {
-    let collaborator = (0, _collaboratorUtils.getKnownCollaboratorByEmail)(name);
+  } else if (columnType === CellType.COLLABORATOR) {
+    let collaborator = getKnownCollaboratorByEmail(name);
     if (collaborator) {
       result[nameKey] = collaborator.name;
     }
-  } else if (columnType === _dtableUtils.CellType.CREATOR || columnType === _dtableUtils.CellType.LAST_MODIFIER) {
+  } else if (columnType === CellType.CREATOR || columnType === CellType.LAST_MODIFIER) {
     if (name === 'anonymous') {
       result[nameKey] = name;
     } else {
-      const collaborator = (0, _collaboratorUtils.getKnownCollaboratorByEmail)(name);
+      const collaborator = getKnownCollaboratorByEmail(name);
       const collaboratorTemplate = {
         loaded: false,
         email: name,
         name: name
       };
-      _context.default.updateCollaboratorsCache(name, collaboratorTemplate);
+      context.updateCollaboratorsCache(name, collaboratorTemplate);
       if (!collaborator) {
-        _context.default.queryUsers([name], emailUserMap => {
-          const collaborator = emailUserMap && emailUserMap[name] || (0, _collaboratorUtils.generateDefaultUser)(name);
+        context.queryUsers([name], emailUserMap => {
+          const collaborator = emailUserMap && emailUserMap[name] || generateDefaultUser(name);
           const loadedCollaborator = {
             ...collaborator,
             loaded: true
           };
-          _context.default.updateCollaboratorsCache(name, loadedCollaborator);
+          context.updateCollaboratorsCache(name, loadedCollaborator);
           result[nameKey] = name;
         });
       } else {
         result[nameKey] = collaborator.name;
       }
     }
-  } else if (columnType === _dtableUtils.CellType.NUMBER) {
+  } else if (columnType === CellType.NUMBER) {
     const valueNumber = parseFloat(name);
-    result[nameKey] = (0, _dtableUtils.isNumber)(valueNumber) ? (0, _dtableUtils.getNumberDisplayString)(valueNumber, columnData) : name;
-  } else if (columnType === _dtableUtils.CellType.DATE) {
+    result[nameKey] = isNumber(valueNumber) ? getNumberDisplayString(valueNumber, columnData) : name;
+  } else if (columnType === CellType.DATE) {
     if (name && name.split('-').length === 3) {
-      let format = (0, _columnUtils.getDateColumnFormat)(column);
+      let format = getDateColumnFormat(column);
       const spaceIndex = format.indexOf(' ');
       if (spaceIndex > -1) {
         format = format.slice(0, spaceIndex);
       }
-      result[nameKey] = (0, _dayjs.default)(name).format(format);
+      result[nameKey] = dayjs(name).format(format);
     }
-  } else if (_dtableUtils.FORMULA_COLUMN_TYPES_MAP[columnType]) {
+  } else if (FORMULA_COLUMN_TYPES_MAP[columnType]) {
     const {
       result_type,
       array_type
     } = columnData || {};
-    if (result_type === _dtableUtils.FORMULA_RESULT_TYPE.NUMBER) {
+    if (result_type === FORMULA_RESULT_TYPE.NUMBER) {
       const valueNumber = parseFloat(name);
-      result[nameKey] = (0, _dtableUtils.isNumber)(valueNumber) ? (0, _dtableUtils.getNumberDisplayString)(valueNumber, columnData) : name;
-    } else if (result_type === _dtableUtils.FORMULA_RESULT_TYPE.ARRAY) {
-      if (_dtableUtils.COLLABORATOR_COLUMN_TYPES.includes(array_type) && Array.isArray(name)) {
+      result[nameKey] = isNumber(valueNumber) ? getNumberDisplayString(valueNumber, columnData) : name;
+    } else if (result_type === FORMULA_RESULT_TYPE.ARRAY) {
+      if (COLLABORATOR_COLUMN_TYPES.includes(array_type) && Array.isArray(name)) {
         result[nameKey] = name.map(email => {
-          let user = array_type === _dtableUtils.CellType.COLLABORATOR ? (0, _collaboratorUtils.getKnownCollaboratorByEmail)(email) : (0, _collaboratorUtils.getKnownCollaboratorByEmail)(email);
+          let user = array_type === CellType.COLLABORATOR ? getKnownCollaboratorByEmail(email) : getKnownCollaboratorByEmail(email);
           return (user || {}).name;
         });
       }
     }
-  } else if (columnType === _dtableUtils.CellType.LINK) {
-    result[nameKey] = (0, _cellFormatUtils.getClientFormulaDisplayString)([name], columnData) || null;
+  } else if (columnType === CellType.LINK) {
+    result[nameKey] = getClientFormulaDisplayString([name], columnData) || null;
   }
 };
 // theme
 BaseUtils.getCurrentTheme = themeName => {
   if (themeName) {
-    const currentColorTheme = _constants.STYLE_COLORS.find(item => item.name === themeName);
+    const currentColorTheme = STYLE_COLORS.find(item => item.name === themeName);
     return currentColorTheme;
   }
-  return _constants.STYLE_COLORS[0];
+  return STYLE_COLORS[0];
 };
 BaseUtils.getSummaryExplanation = chart => {
   const {
@@ -1130,43 +1150,43 @@ BaseUtils.getSummaryExplanation = chart => {
     type
   } = config;
   switch (type) {
-    case _constants.CHART_TYPE.PIE:
-    case _constants.CHART_TYPE.LINE:
-    case _constants.CHART_TYPE.LINE_GROUP:
-    case _constants.CHART_TYPE.RING:
+    case CHART_TYPE.PIE:
+    case CHART_TYPE.LINE:
+    case CHART_TYPE.LINE_GROUP:
+    case CHART_TYPE.RING:
       {
         return {
-          count: _intl.default.get('Count_the_number_of_records_in_each_group'),
-          advanced: _intl.default.get('Compute_the_sum_maximum_or_minimum_value_of_records_in_each_group_by_a_field')
+          count: intl.get('Count_the_number_of_records_in_each_group'),
+          advanced: intl.get('Compute_the_sum_maximum_or_minimum_value_of_records_in_each_group_by_a_field')
         };
       }
-    case _constants.CHART_TYPE.BAR:
-    case _constants.CHART_TYPE.BAR_GROUP:
+    case CHART_TYPE.BAR:
+    case CHART_TYPE.BAR_GROUP:
       {
         return {
-          count: _intl.default.get('Group_the_records_according_to_the_vertical_axis_and_count_the_records_in_each_group'),
-          advanced: _intl.default.get('Group_the_records_according_to_the_vertical_axis_and_compute_the_sum_maximum_or_minimum_of_records_in_each_group_by_a_field')
+          count: intl.get('Group_the_records_according_to_the_vertical_axis_and_count_the_records_in_each_group'),
+          advanced: intl.get('Group_the_records_according_to_the_vertical_axis_and_compute_the_sum_maximum_or_minimum_of_records_in_each_group_by_a_field')
         };
       }
     default:
       {
         return {
-          count: _intl.default.get('Count_the_records'),
-          advanced: _intl.default.get('Compute_sum_max_min')
+          count: intl.get('Count_the_records'),
+          advanced: intl.get('Compute_sum_max_min')
         };
       }
   }
 };
 BaseUtils.getLabelFontSize = labelFontSize => {
-  return (0, _dtableUtils.isNumber)(labelFontSize) ? labelFontSize : _constants.DEFAULT_LABEL_FONT_SIZE;
+  return isNumber(labelFontSize) ? labelFontSize : DEFAULT_LABEL_FONT_SIZE;
 };
 BaseUtils.imEmptyChartResult = chartResult => {
   return !chartResult || !chartResult.result && chartResult.result !== 0 || Array.isArray(chartResult.result) && chartResult.result.length === 0;
 };
 BaseUtils.getPrecisionNumber = (value, data) => {
-  const valueString = (0, _dtableUtils.getPrecisionNumber)(value, data);
+  const valueString = getPrecisionNumber(value, data);
   const valueNumber = parseFloat(valueString);
-  return (0, _dtableUtils.isNumber)(valueNumber) ? valueNumber : 0;
+  return isNumber(valueNumber) ? valueNumber : 0;
 };
 BaseUtils.isValidCellValue = function (cellValue) {
   let includeEmpty = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
@@ -1178,7 +1198,7 @@ BaseUtils.convertConfig = config => {
   const {
     type
   } = config;
-  if (type === _constants.CHART_TYPE.HORIZONTAL_BAR || type === _constants.CHART_TYPE.HORIZONTAL_GROUP_BAR || type === _constants.CHART_TYPE.STACKED_HORIZONTAL_BAR) {
+  if (type === CHART_TYPE.HORIZONTAL_BAR || type === CHART_TYPE.HORIZONTAL_GROUP_BAR || type === CHART_TYPE.STACKED_HORIZONTAL_BAR) {
     const {
       vertical_axis_column_key,
       vertical_axis_date_granularity,
@@ -1191,7 +1211,11 @@ BaseUtils.convertConfig = config => {
       vertical_axis_label_position,
       show_horizontal_axis_label,
       horizontal_axis_label_position,
-      horizontal_axis_label_color
+      horizontal_axis_label_color,
+      vertical_axis_label_font_size,
+      vertical_axis_label_font_color,
+      horizontal_axis_label_font_size,
+      horizontal_axis_label_font_color
     } = config;
     const newConfig = {
       x_axis_column_key: vertical_axis_column_key,
@@ -1203,8 +1227,12 @@ BaseUtils.convertConfig = config => {
       y_axis_summary_column_key: horizontal_axis_column_key,
       x_axis_show_label: show_vertical_axis_label,
       x_axis_label_position: vertical_axis_label_position,
+      x_axis_label_font_size: vertical_axis_label_font_size,
+      x_axis_label_font_color: vertical_axis_label_font_color,
       y_axis_show_label: show_horizontal_axis_label,
       y_axis_label_position: horizontal_axis_label_position,
+      y_axis_label_font_size: horizontal_axis_label_font_size,
+      y_axis_label_font_color: horizontal_axis_label_font_color,
       y_axis_label_color: horizontal_axis_label_color,
       y_axis_auto_range: config.horizontal_axis_auto_range,
       y_axis_max: config.horizontal_axis_max,
@@ -1217,24 +1245,24 @@ BaseUtils.convertConfig = config => {
 };
 BaseUtils.getSummaryType = config => {
   switch (config.type) {
-    case _constants.CHART_TYPE.HORIZONTAL_BAR:
-    case _constants.CHART_TYPE.HORIZONTAL_GROUP_BAR:
-    case _constants.CHART_TYPE.STACKED_HORIZONTAL_BAR:
+    case CHART_TYPE.HORIZONTAL_BAR:
+    case CHART_TYPE.HORIZONTAL_GROUP_BAR:
+    case CHART_TYPE.STACKED_HORIZONTAL_BAR:
       {
         return config.horizontal_axis_summary_type;
       }
-    case _constants.CHART_TYPE.BAR:
-    case _constants.CHART_TYPE.BAR_GROUP:
-    case _constants.CHART_TYPE.BAR_STACK:
-    case _constants.CHART_TYPE.LINE:
-    case _constants.CHART_TYPE.LINE_GROUP:
-    case _constants.CHART_TYPE.AREA:
-    case _constants.CHART_TYPE.AREA_GROUP:
-    case _constants.CHART_TYPE.SCATTER:
+    case CHART_TYPE.BAR:
+    case CHART_TYPE.BAR_GROUP:
+    case CHART_TYPE.BAR_STACK:
+    case CHART_TYPE.LINE:
+    case CHART_TYPE.LINE_GROUP:
+    case CHART_TYPE.AREA:
+    case CHART_TYPE.AREA_GROUP:
+    case CHART_TYPE.SCATTER:
       {
         return config.y_axis_summary_type;
       }
-    case _constants.CHART_TYPE.TABLE:
+    case CHART_TYPE.TABLE:
     default:
       {
         return config.summary_type;
@@ -1248,20 +1276,20 @@ BaseUtils.getGroupLabel = (cellValue, formulaRow, column, dateGranularity, geoGr
     data
   } = column || {};
   switch (type) {
-    case _dtableUtils.CellType.TEXT:
+    case CellType.TEXT:
       {
         return cellValue || null;
       }
-    case _dtableUtils.CellType.NUMBER:
+    case CellType.NUMBER:
       {
         if (!cellValue && cellValue !== 0) {
           return null;
         }
-        const number = (0, _dtableUtils.getPrecisionNumber)(cellValue, data);
+        const number = getPrecisionNumber(cellValue, data);
         let valueNumber = parseFloat(number);
-        return (0, _dtableUtils.isNumber)(valueNumber) ? (0, _dtableUtils.getNumberDisplayString)(valueNumber, column.data) : valueNumber;
+        return isNumber(valueNumber) ? getNumberDisplayString(valueNumber, column.data) : valueNumber;
       }
-    case _dtableUtils.CellType.SINGLE_SELECT:
+    case CellType.SINGLE_SELECT:
       {
         let isInvalidValue = data && data.options.findIndex(opt => opt.id === cellValue) < 0;
         if (isInvalidValue) {
@@ -1269,20 +1297,20 @@ BaseUtils.getGroupLabel = (cellValue, formulaRow, column, dateGranularity, geoGr
         }
         return cellValue;
       }
-    case _dtableUtils.CellType.DATE:
-    case _dtableUtils.CellType.CTIME:
-    case _dtableUtils.CellType.MTIME:
+    case CellType.DATE:
+    case CellType.CTIME:
+    case CellType.MTIME:
       {
         if (!dateGranularity) {
-          return (0, _dtableUtils.getDateDisplayString)(cellValue);
+          return getDateDisplayString(cellValue);
         }
-        const firstDayOfWeek = (0, _index.getFirstDayOfWeekForGroupby)('base');
+        const firstDayOfWeek = getFirstDayOfWeekForGroupby('base');
         if (dateGranularity.toUpperCase() === 'QUARTER') {
-          return _dtableUtils.DateUtils.getDateByGranularity(cellValue, 'QUARTAR', firstDayOfWeek);
+          return DateUtils.getDateByGranularity(cellValue, 'QUARTAR', firstDayOfWeek);
         }
-        return _dtableUtils.DateUtils.getDateByGranularity(cellValue, dateGranularity, firstDayOfWeek);
+        return DateUtils.getDateByGranularity(cellValue, dateGranularity, firstDayOfWeek);
       }
-    case _dtableUtils.CellType.MULTIPLE_SELECT:
+    case CellType.MULTIPLE_SELECT:
       {
         let options = data && data.options;
         if (!Array.isArray(cellValue)) {
@@ -1291,18 +1319,18 @@ BaseUtils.getGroupLabel = (cellValue, formulaRow, column, dateGranularity, geoGr
         const newCellValue = cellValue.filter(id => options.findIndex(o => o.id === id) > -1);
         return newCellValue.sort();
       }
-    case _dtableUtils.CellType.COLLABORATOR:
+    case CellType.COLLABORATOR:
       {
         if (!Array.isArray(cellValue)) return [];
-        return cellValue.filter(email => (0, _collaborator.isValidCollaboratorEmail)(email));
+        return cellValue.filter(email => isValidCollaboratorEmail(email));
       }
-    case _dtableUtils.CellType.CREATOR:
-    case _dtableUtils.CellType.LAST_MODIFIER:
+    case CellType.CREATOR:
+    case CellType.LAST_MODIFIER:
       {
         return cellValue ? cellValue : null;
       }
-    case _dtableUtils.CellType.LINK_FORMULA:
-    case _dtableUtils.CellType.FORMULA:
+    case CellType.LINK_FORMULA:
+    case CellType.FORMULA:
       {
         if (!formulaRow) return '';
         let formulaCellValue = formulaRow[key];
@@ -1310,34 +1338,34 @@ BaseUtils.getGroupLabel = (cellValue, formulaRow, column, dateGranularity, geoGr
           result_type,
           array_type
         } = data || {};
-        if (result_type === _dtableUtils.FORMULA_RESULT_TYPE.ARRAY) {
+        if (result_type === FORMULA_RESULT_TYPE.ARRAY) {
           if (array_type === 'date' && (formulaCellValue === null || formulaCellValue === void 0 ? void 0 : formulaCellValue.length) === 1) {
             const dateCellValue = formulaCellValue[0];
-            if (!dateGranularity) return (0, _dtableUtils.getDateDisplayString)(dateCellValue);
-            const firstDayOfWeek = (0, _index.getFirstDayOfWeekForGroupby)('base');
-            if (dateGranularity.toUpperCase() === 'QUARTER') return _dtableUtils.DateUtils.getDateByGranularity(dateCellValue, 'QUARTAR', firstDayOfWeek);
-            return _dtableUtils.DateUtils.getDateByGranularity(dateCellValue, dateGranularity, firstDayOfWeek);
+            if (!dateGranularity) return getDateDisplayString(dateCellValue);
+            const firstDayOfWeek = getFirstDayOfWeekForGroupby('base');
+            if (dateGranularity.toUpperCase() === 'QUARTER') return DateUtils.getDateByGranularity(dateCellValue, 'QUARTAR', firstDayOfWeek);
+            return DateUtils.getDateByGranularity(dateCellValue, dateGranularity, firstDayOfWeek);
           }
-          return (0, _dtableUtils.getFormulaDisplayString)(formulaCellValue, data, {
+          return getFormulaDisplayString(formulaCellValue, data, {
             tables: value.tables
           }) || null;
         }
-        if (result_type === _dtableUtils.FORMULA_RESULT_TYPE.NUMBER) {
-          return (0, _dtableUtils.getPrecisionNumber)(formulaCellValue, data);
+        if (result_type === FORMULA_RESULT_TYPE.NUMBER) {
+          return getPrecisionNumber(formulaCellValue, data);
         }
         return formulaCellValue ? formulaCellValue + '' : null;
       }
-    case _dtableUtils.CellType.GEOLOCATION:
+    case CellType.GEOLOCATION:
       {
         const {
           geo_format
         } = data || {};
         if (geo_format === 'country_region' || geo_format === 'lng_lat' || !geoGranularity) {
-          return (0, _dtableUtils.getGeolocationDisplayString)(cellValue, data);
+          return getGeolocationDisplayString(cellValue, data);
         }
         return cellValue ? cellValue[geoGranularity] : null;
       }
-    case _dtableUtils.CellType.LINK:
+    case CellType.LINK:
       {
         const linkCellValue = formulaRow && formulaRow[key];
         if (!Array.isArray(linkCellValue)) {
@@ -1345,11 +1373,11 @@ BaseUtils.getGroupLabel = (cellValue, formulaRow, column, dateGranularity, geoGr
         }
         return linkCellValue.map(linkVal => linkVal.display_value);
       }
-    case _dtableUtils.CellType.CHECKBOX:
+    case CellType.CHECKBOX:
       {
         return String(!!cellValue);
       }
-    case _dtableUtils.CellType.RATE:
+    case CellType.RATE:
       {
         if (!cellValue) return null;
         return cellValue + '';
@@ -1365,9 +1393,9 @@ BaseUtils.getTotal = function (summary_column_key, summary_column_type, summary_
   let formula_rows = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : {};
   let rowsLength = rows.length;
   let total;
-  if (summary_type === _constants.CHART_SUMMARY_TYPE.COUNT) {
+  if (summary_type === CHART_SUMMARY_TYPE.COUNT) {
     total = rowsLength;
-  } else if (summary_type === _constants.CHART_SUMMARY_TYPE.ADVANCED) {
+  } else if (summary_type === CHART_SUMMARY_TYPE.ADVANCED) {
     switch (summary_method) {
       case 'Distinct_values':
         {
@@ -1375,7 +1403,7 @@ BaseUtils.getTotal = function (summary_column_key, summary_column_type, summary_
           let existMap = {};
           rows.forEach(r => {
             let num;
-            if (_dtableUtils.FORMULA_COLUMN_TYPES_MAP[summary_column_type]) {
+            if (FORMULA_COLUMN_TYPES_MAP[summary_column_type]) {
               const formulaRow = formula_rows[r._id] || {};
               num = formulaRow[summary_column_key];
               num = Array.isArray(num) ? num[0] : num;
@@ -1404,14 +1432,14 @@ BaseUtils.getTotal = function (summary_column_key, summary_column_type, summary_
           let validNumbersCount = 0;
           rows.forEach(r => {
             let num;
-            if (_dtableUtils.FORMULA_COLUMN_TYPES_MAP[summary_column_type]) {
+            if (FORMULA_COLUMN_TYPES_MAP[summary_column_type]) {
               let formulaRow = formula_rows[r._id] || {};
               num = formulaRow[summary_column_key];
               num = Array.isArray(num) ? num[0] : num;
             } else {
               num = r[summary_column_key];
             }
-            if ((0, _dtableUtils.isNumber)(num)) {
+            if (isNumber(num)) {
               validNumbersCount++;
               sum += num;
             }
@@ -1429,7 +1457,7 @@ BaseUtils.getTotal = function (summary_column_key, summary_column_type, summary_
           if (rowsLength > 0) {
             let result = rows.reduce((current, next) => {
               let currentValue, nextValue;
-              if (_dtableUtils.FORMULA_COLUMN_TYPES_MAP[summary_column_type]) {
+              if (FORMULA_COLUMN_TYPES_MAP[summary_column_type]) {
                 let currentFormulaRow = formula_rows[current._id];
                 let nextFormulaRow = formula_rows[next._id];
                 currentValue = currentFormulaRow && currentFormulaRow[summary_column_key];
@@ -1440,7 +1468,7 @@ BaseUtils.getTotal = function (summary_column_key, summary_column_type, summary_
                 currentValue = current[summary_column_key];
                 nextValue = next[summary_column_key];
               }
-              if (!nextValue && nextValue !== 0) {
+              if (isEmpty(nextValue)) {
                 return current;
               }
               let isNextGreater = currentValue < nextValue;
@@ -1450,7 +1478,7 @@ BaseUtils.getTotal = function (summary_column_key, summary_column_type, summary_
                 return isNextGreater ? next : current;
               }
             });
-            if (_dtableUtils.FORMULA_COLUMN_TYPES_MAP[summary_column_type]) {
+            if (FORMULA_COLUMN_TYPES_MAP[summary_column_type]) {
               let formulaRow = formula_rows[result._id];
               total = formulaRow && formulaRow[summary_column_key];
               total = Array.isArray(total) ? total[0] : total;
@@ -1472,42 +1500,42 @@ BaseUtils.getFormattedValue = (value, column, summaryMethod) => {
   if (!column) {
     return value;
   }
-  if (summaryMethod === _constants.CHART_SUMMARY_TYPE.DISTINCT_VALUES) {
+  if (summaryMethod === CHART_SUMMARY_TYPE.DISTINCT_VALUES) {
     return value;
   }
   const {
     type,
     data
   } = column;
-  if ((0, _dtableUtils.isNumericColumn)(column)) {
-    return (0, _dtableUtils.getNumberDisplayString)(value, data);
+  if (isNumericColumn(column)) {
+    return getNumberDisplayString(value, data);
   }
-  if (_dtableUtils.FORMULA_COLUMN_TYPES_MAP[type]) {
-    return (0, _cellFormatUtils.getClientFormulaDisplayString)(value, data);
+  if (FORMULA_COLUMN_TYPES_MAP[type]) {
+    return getClientFormulaDisplayString(value, data);
   }
   return value;
 };
 BaseUtils.getSummaryResult = function (results, summaryMethod) {
   let precision = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 8;
-  const numericResults = Array.isArray(results) && results.length > 0 ? results.filter(res => (0, _dtableUtils.isNumber)(res)) : [];
+  const numericResults = Array.isArray(results) && results.length > 0 ? results.filter(res => isNumber(res)) : [];
   switch (summaryMethod) {
-    case _constants.CHART_SUMMARY_TYPE.MAX:
+    case CHART_SUMMARY_TYPE.MAX:
       {
         return _BaseUtils.getMax(numericResults);
       }
-    case _constants.CHART_SUMMARY_TYPE.MIN:
+    case CHART_SUMMARY_TYPE.MIN:
       {
         return _BaseUtils.getMin(numericResults);
       }
-    case _constants.CHART_SUMMARY_TYPE.SUM:
+    case CHART_SUMMARY_TYPE.SUM:
       {
         return _BaseUtils.getSum(numericResults, precision);
       }
-    case _constants.CHART_SUMMARY_TYPE.MEAN:
+    case CHART_SUMMARY_TYPE.MEAN:
       {
         return _BaseUtils.getMean(numericResults, precision);
       }
-    case _constants.CHART_SUMMARY_TYPE.Distinct_values:
+    case CHART_SUMMARY_TYPE.Distinct_values:
       {
         let count = 0;
         let existMap = {};
@@ -1556,15 +1584,15 @@ BaseUtils.getMean = function (list) {
   return Number.parseFloat((sum / list.length).toFixed(precision));
 };
 BaseUtils.summaryDurationResult = (result, duration, summaryType, summaryMethod, useDataDb, dbDateKey, valueKey) => {
-  const currentTime = (0, _dayjs.default)();
+  const currentTime = dayjs();
   const days = duration === 'days_30' ? 30 : 7;
   // set date to start of the day
   const formattedEndDate = currentTime.format('YYYY-MM-DD');
   const formattedMiddleDate = currentTime.subtract(days, 'days').format('YYYY-MM-DD');
-  const formattedStartDate = (0, _dayjs.default)(formattedMiddleDate).subtract(days, 'days').format('YYYY-MM-DD');
-  const endDate = (0, _dayjs.default)(formattedEndDate);
-  const middleDate = (0, _dayjs.default)(formattedMiddleDate);
-  const startDate = (0, _dayjs.default)(formattedStartDate);
+  const formattedStartDate = dayjs(formattedMiddleDate).subtract(days, 'days').format('YYYY-MM-DD');
+  const endDate = dayjs(formattedEndDate);
+  const middleDate = dayjs(formattedMiddleDate);
+  const startDate = dayjs(formattedStartDate);
   let compareValue = [];
   let comparedValue = [];
   if (useDataDb) {
@@ -1572,7 +1600,7 @@ BaseUtils.summaryDurationResult = (result, duration, summaryType, summaryMethod,
     const days2 = [];
     for (let index = 0; index < result.length; index++) {
       const item = result[index];
-      const key = (0, _dayjs.default)(item[dbDateKey]);
+      const key = dayjs(item[dbDateKey]);
       if (!key.isValid()) continue;
       if (key >= startDate && key < middleDate) {
         comparedValue.push(item[valueKey]);
@@ -1601,7 +1629,7 @@ BaseUtils.summaryDurationResult = (result, duration, summaryType, summaryMethod,
   //     }
   //   }
   // }
-  if (summaryType === _constants.CHART_SUMMARY_TYPE.ADVANCED) {
+  if (summaryType === CHART_SUMMARY_TYPE.ADVANCED) {
     comparedValue = _BaseUtils.getSummaryResult(comparedValue, summaryMethod);
     compareValue = _BaseUtils.getSummaryResult(compareValue, summaryMethod);
   } else {
@@ -1627,13 +1655,13 @@ BaseUtils.formatedTableSqlRowsByCollaboratorAndMultiple = (chart, sqlRows, chart
     sqlColumnGroupbyColumnKey
   } = chartSQLMap;
   let newSqlRows = JSON.parse(JSON.stringify(sqlRows));
-  if (config.summary_type === _constants.CHART_SUMMARY_TYPE.COUNT) {
+  if (config.summary_type === CHART_SUMMARY_TYPE.COUNT) {
     // has column group
     if (sqlColumnGroupbyColumnKey) {
-      if ((columnGroupbyColumn === null || columnGroupbyColumn === void 0 ? void 0 : columnGroupbyColumn.type) === _dtableUtils.CellType.COLLABORATOR) {
+      if ((columnGroupbyColumn === null || columnGroupbyColumn === void 0 ? void 0 : columnGroupbyColumn.type) === CellType.COLLABORATOR) {
         return newSqlRows;
       }
-      if ((columnGroupbyColumn === null || columnGroupbyColumn === void 0 ? void 0 : columnGroupbyColumn.type) === _dtableUtils.CellType.MULTIPLE_SELECT) {
+      if ((columnGroupbyColumn === null || columnGroupbyColumn === void 0 ? void 0 : columnGroupbyColumn.type) === CellType.MULTIPLE_SELECT) {
         return newSqlRows;
       }
     }
@@ -1659,7 +1687,7 @@ BaseUtils.formatedTableSqlRowsByCollaboratorAndMultiple = (chart, sqlRows, chart
       newSqlRows = Object.values(collaboratorsRowsMap);
     }
   }
-  if (config.summary_type === _constants.CHART_SUMMARY_TYPE.ADVANCED) {
+  if (config.summary_type === CHART_SUMMARY_TYPE.ADVANCED) {
     let summarySQLColumnName2ColumnKeys;
     if (summarySQLColumnName2ColumnKey) {
       summarySQLColumnName2ColumnKeys = Object.keys(summarySQLColumnName2ColumnKey);
@@ -1672,10 +1700,10 @@ BaseUtils.formatedTableSqlRowsByCollaboratorAndMultiple = (chart, sqlRows, chart
 
     // has column group
     if (sqlColumnGroupbyColumnKey) {
-      if ((columnGroupbyColumn === null || columnGroupbyColumn === void 0 ? void 0 : columnGroupbyColumn.type) === _dtableUtils.CellType.COLLABORATOR) {
+      if ((columnGroupbyColumn === null || columnGroupbyColumn === void 0 ? void 0 : columnGroupbyColumn.type) === CellType.COLLABORATOR) {
         return newSqlRows;
       }
-      if ((columnGroupbyColumn === null || columnGroupbyColumn === void 0 ? void 0 : columnGroupbyColumn.type) === _dtableUtils.CellType.MULTIPLE_SELECT) {
+      if ((columnGroupbyColumn === null || columnGroupbyColumn === void 0 ? void 0 : columnGroupbyColumn.type) === CellType.MULTIPLE_SELECT) {
         return newSqlRows;
       }
 
@@ -1817,16 +1845,16 @@ BaseUtils.getDateGranularityByType = chart => {
   const {
     type
   } = chart;
-  if ([_constants.CHART_TYPE.AREA_GROUP, _constants.CHART_TYPE.AREA, _constants.CHART_TYPE.BAR, _constants.CHART_TYPE.BAR_CUSTOM, _constants.CHART_TYPE.BAR_GROUP, _constants.CHART_TYPE.BAR_STACK, _constants.CHART_TYPE.COMPARE_BAR, _constants.CHART_TYPE.COMBINATION, _constants.CHART_TYPE.LINE_GROUP, _constants.CHART_TYPE.LINE].includes(type)) {
+  if ([CHART_TYPE.AREA_GROUP, CHART_TYPE.AREA, CHART_TYPE.BAR, CHART_TYPE.BAR_CUSTOM, CHART_TYPE.BAR_GROUP, CHART_TYPE.BAR_STACK, CHART_TYPE.COMPARE_BAR, CHART_TYPE.COMBINATION, CHART_TYPE.LINE_GROUP, CHART_TYPE.LINE].includes(type)) {
     return chart['x_axis_date_granularity'];
   }
-  if ([_constants.CHART_TYPE.COMPLETENESS_GROUP, _constants.CHART_TYPE.SCATTER, _constants.CHART_TYPE.TREND].includes(type)) {
+  if ([CHART_TYPE.COMPLETENESS_GROUP, CHART_TYPE.SCATTER, CHART_TYPE.TREND].includes(type)) {
     return chart['date_granularity'];
   }
-  if ([_constants.CHART_TYPE.HORIZONTAL_BAR, _constants.CHART_TYPE.HORIZONTAL_GROUP_BAR, _constants.CHART_TYPE.STACKED_HORIZONTAL_BAR].includes(type)) {
+  if ([CHART_TYPE.HORIZONTAL_BAR, CHART_TYPE.HORIZONTAL_GROUP_BAR, CHART_TYPE.STACKED_HORIZONTAL_BAR].includes(type)) {
     return chart['vertical_axis_date_granularity'];
   }
-  if ([_constants.CHART_TYPE.PIE, _constants.CHART_TYPE.RING, _constants.CHART_TYPE.TABLE, _constants.CHART_TYPE.TREE_MAP].includes(type)) {
+  if ([CHART_TYPE.PIE, CHART_TYPE.RING, CHART_TYPE.TABLE, CHART_TYPE.TREE_MAP].includes(type)) {
     return chart['groupby_date_granularity'];
   }
   return null;
@@ -1877,13 +1905,13 @@ BaseUtils.isCollaboratorColumnOrMultipleColumn = columnMap => {
     columnGroupbyColumn,
     groupbyColumn
   } = columnMap || {};
-  if (columnGroupbyColumn && groupbyColumn && (groupbyColumn === null || groupbyColumn === void 0 ? void 0 : groupbyColumn.type) === _dtableUtils.CellType.COLLABORATOR) {
+  if (columnGroupbyColumn && groupbyColumn && (groupbyColumn === null || groupbyColumn === void 0 ? void 0 : groupbyColumn.type) === CellType.COLLABORATOR) {
     return true;
   }
-  if (columnGroupbyColumn && groupbyColumn && (groupbyColumn === null || groupbyColumn === void 0 ? void 0 : groupbyColumn.type) === _dtableUtils.CellType.MULTIPLE_SELECT) {
+  if (columnGroupbyColumn && groupbyColumn && (groupbyColumn === null || groupbyColumn === void 0 ? void 0 : groupbyColumn.type) === CellType.MULTIPLE_SELECT) {
     return true;
   }
-  if (columnGroupbyColumn && groupbyColumn && (groupbyColumn === null || groupbyColumn === void 0 ? void 0 : groupbyColumn.type) === _dtableUtils.CellType.LINK_FORMULA && [_dtableUtils.CellType.MULTIPLE_SELECT, _dtableUtils.CellType.COLLABORATOR].includes(groupbyColumn === null || groupbyColumn === void 0 ? void 0 : (_groupbyColumn$data = groupbyColumn.data) === null || _groupbyColumn$data === void 0 ? void 0 : _groupbyColumn$data.array_type)) {
+  if (columnGroupbyColumn && groupbyColumn && (groupbyColumn === null || groupbyColumn === void 0 ? void 0 : groupbyColumn.type) === CellType.LINK_FORMULA && [CellType.MULTIPLE_SELECT, CellType.COLLABORATOR].includes(groupbyColumn === null || groupbyColumn === void 0 ? void 0 : (_groupbyColumn$data = groupbyColumn.data) === null || _groupbyColumn$data === void 0 ? void 0 : _groupbyColumn$data.array_type)) {
     return true;
   }
   return false;
@@ -1897,10 +1925,10 @@ BaseUtils.sortDataByGroupName = function (data, groupKey, groupColumn) {
   } = chart.config;
   if (!column_groupby_multiple_numeric_column) {
     if (groupColumn) {
-      if ([_dtableUtils.CellType.SINGLE_SELECT].includes(groupColumn.type)) {
+      if ([CellType.SINGLE_SELECT].includes(groupColumn.type)) {
         data.forEach(item => {
           const option = groupColumn.data.options.find(option => option.name === item[groupKey]);
-          if (option !== null && option !== void 0 && option.id) {
+          if (option === null || option === void 0 ? void 0 : option.id) {
             item['group_name_id'] = option.id;
             item['oldName'] = item.name;
             item.name = item['group_name_id'];
@@ -1920,4 +1948,4 @@ BaseUtils.sortDataByGroupName = function (data, groupKey, groupColumn) {
   }
   return data;
 };
-var _default = exports.default = BaseUtils;
+export default BaseUtils;